chore: fix typos

src/apis/watch.ts

@@ -180,8 +180,8 @@ function createWatcher(
             flushMode
           );
 
-  // `shiftCallback` is used to handle firty sync effect.
-  // The subsequent callbcks will redirect to `callback`.
+  // `shiftCallback` is used to handle dirty sync effect.
+  // The subsequent callbacks will redirect to `callback`.
   let shiftCallback = (n: any, o: any) => {
     shiftCallback = callback;
     applyCb(n, o);
@@ -214,14 +214,14 @@ export function watch(
   cb?: Partial<WatcherOption> | WatcherCallBack<any>,
   options?: Partial<WatcherOption>
 ): StopHandle {
-  let callbck: WatcherCallBack<unknown> | null = null;
+  let callback: WatcherCallBack<unknown> | null = null;
   if (typeof cb === 'function') {
     // source watch
-    callbck = cb as WatcherCallBack<unknown>;
+    callback = cb as WatcherCallBack<unknown>;
   } else {
     // effect watch
     options = cb as Partial<WatcherOption>;
-    callbck = null;
+    callback = null;
   }
 
   const opts: WatcherOption = {
@@ -242,5 +242,5 @@ export function watch(
     installWatchEnv(vm);
   }
 
-  return createWatcher(vm, source, callbck, opts);
+  return createWatcher(vm, source, callback, opts);
 }

src/component/componentProps.ts

@@ -17,30 +17,30 @@ export type PropType<T> = PropConstructor<T> | PropConstructor<T>[];
 
 type PropConstructor<T> = { new (...args: any[]): T & object } | { (): T };
 
-type RequiredKeys<T, MakeDefautRequired> = {
+type RequiredKeys<T, MakeDefaultRequired> = {
   [K in keyof T]: T[K] extends
     | { required: true }
-    | (MakeDefautRequired extends true ? { default: any } : never)
+    | (MakeDefaultRequired extends true ? { default: any } : never)
     ? K
     : never;
 }[keyof T];
 
-type OptionalKeys<T, MakeDefautRequired> = Exclude<keyof T, RequiredKeys<T, MakeDefautRequired>>;
+type OptionalKeys<T, MakeDefaultRequired> = Exclude<keyof T, RequiredKeys<T, MakeDefaultRequired>>;
 
 // prettier-ignore
 type InferPropType<T> = T extends null
   ? any // null & true would fail to infer
   : T extends { type: null }
-    ? any // somehow `ObjectContructor` when inferred from { (): T } becomes `any`
+    ? any // somehow `ObjectConstructor` when inferred from { (): T } becomes `any`
     : T extends ObjectConstructor | { type: ObjectConstructor }
       ? { [key: string]: any }
       : T extends Prop<infer V>
         ? V
         : T;
 
 // prettier-ignore
-export type ExtractPropTypes<O, MakeDefautRequired extends boolean = true> = {
-  readonly [K in RequiredKeys<O, MakeDefautRequired>]: InferPropType<O[K]>;
+export type ExtractPropTypes<O, MakeDefaultRequired extends boolean = true> = {
+  readonly [K in RequiredKeys<O, MakeDefaultRequired>]: InferPropType<O[K]>;
 } & {
-  readonly [K in OptionalKeys<O, MakeDefautRequired>]?: InferPropType<O[K]>;
+  readonly [K in OptionalKeys<O, MakeDefaultRequired>]?: InferPropType<O[K]>;
 };

src/reactivity/reactive.ts

@@ -3,7 +3,7 @@ import { getCurrentVue } from '../runtimeContext';
 import { isPlainObject, def, hasOwn, warn } from '../utils';
 import { isComponentInstance, createComponentInstance } from '../helper';
 import {
-  AccessControIdentifierlKey,
+  AccessControlIdentifierKey,
   ReactiveIdentifierKey,
   NonReactiveIdentifierKey,
   RefKey,
@@ -40,14 +40,14 @@ function setupAccessControl(target: AnyObject): void {
   }
 
   if (
-    hasOwn(target, AccessControIdentifierlKey) &&
-    target[AccessControIdentifierlKey] === AccessControlIdentifier
+    hasOwn(target, AccessControlIdentifierKey) &&
+    target[AccessControlIdentifierKey] === AccessControlIdentifier
   ) {
     return;
   }
 
   if (Object.isExtensible(target)) {
-    def(target, AccessControIdentifierlKey, AccessControlIdentifier);
+    def(target, AccessControlIdentifierKey, AccessControlIdentifier);
   }
   const keys = Object.keys(target);
   for (let i = 0; i < keys.length; i++) {
@@ -56,7 +56,7 @@ function setupAccessControl(target: AnyObject): void {
 }
 
 /**
- * Auto unwrapping when acccess property
+ * Auto unwrapping when access property
  */
 export function defineAccessControl(target: AnyObject, key: any, val?: any) {
   if (key === '__ob__') return;
@@ -81,7 +81,7 @@ export function defineAccessControl(target: AnyObject, key: any, val?: any) {
     configurable: true,
     get: function getterHandler() {
       const value = getter ? getter.call(target) : val;
-      // if the key is euqal to RefKey, skip the unwrap logic
+      // if the key is equal to RefKey, skip the unwrap logic
       if (key !== RefKey && isRef(value)) {
         return value.value;
       } else {
@@ -92,7 +92,7 @@ export function defineAccessControl(target: AnyObject, key: any, val?: any) {
       if (getter && !setter) return;
 
       const value = getter ? getter.call(target) : val;
-      // If the key is euqal to RefKey, skip the unwrap logic
+      // If the key is equal to RefKey, skip the unwrap logic
       // If and only if "value" is ref and "newVal" is not a ref,
       // the assignment should be proxied to "value" ref.
       if (key !== RefKey && isRef(value) && !isRef(newVal)) {
@@ -151,7 +151,7 @@ export function nonReactive<T = any>(obj: T): T {
     return obj;
   }
 
-  // set the vue obserable flag at obj
+  // set the vue observable flag at obj
   (obj as any).__ob__ = (observe({}) as any).__ob__;
   // mark as nonReactive
   def(obj, NonReactiveIdentifierKey, NonReactiveIdentifier);

src/reactivity/ref.ts

@@ -100,7 +100,7 @@ export function createRef<T>(options: RefOption<T>) {
 
 type RefValue<T> = T extends Ref<infer V> ? V : UnwrapRef<T>;
 
-// without init value, explict typed: a = ref<{ a: number }>()
+// without init value, explicit typed: a = ref<{ a: number }>()
 // typeof a will be Ref<{ a: number } | undefined>
 export function ref<T = undefined>(): Ref<T | undefined>;
 // with init value: a = ref({ a: ref(0) })
@@ -138,16 +138,16 @@ export function toRefs<T extends Data = Data>(obj: T): Refs<T> {
 
   const res: Refs<T> = {} as any;
   Object.keys(obj).forEach(key => {
-    let val = obj[key];
+    let val: any = obj[key];
     // use ref to proxy the property
     if (!isRef(val)) {
-      val = createRef({
+      val = createRef<any>({
         get: () => obj[key],
-        set: v => (obj[key as keyof T] = v as any),
+        set: v => (obj[key as keyof T] = v),
       });
     }
     // todo
-    res[key as keyof T] = val as any;
+    res[key as keyof T] = val;
   });
 
   return res;

src/setup.ts

@@ -51,16 +51,16 @@ function updateTemplateRef(vm: ComponentInstance) {
   }
 
   const newKeys = Object.keys(refs);
-  const validNewKyes = [];
+  const validNewKeys = [];
   for (let index = 0; index < newKeys.length; index++) {
     const key = newKeys[index];
     const setupValue = rawBindings[key];
     if (refs[key] && setupValue && isRef(setupValue)) {
       setupValue.value = refs[key];
-      validNewKyes.push(key);
+      validNewKeys.push(key);
     }
   }
-  vmStateManager.set(vm, 'refs', validNewKyes);
+  vmStateManager.set(vm, 'refs', validNewKeys);
 }
 
 function activateCurrentInstance(
@@ -124,7 +124,7 @@ export function mixin(Vue: VueConstructor) {
     }
 
     const { data } = $options;
-    // wapper the data option, so we can invoke setup before data get resolved
+    // wrapper the data option, so we can invoke setup before data get resolved
     $options.data = function wrappedData() {
       initSetup(vm, vm.$props);
       return typeof data === 'function' ? data.call(vm, vm) : data || {};

src/symbols.ts

@@ -6,9 +6,9 @@ function createSymbol(name: string): string {
 
 export const WatcherPreFlushQueueKey = createSymbol('vfa.key.preFlushQueue');
 export const WatcherPostFlushQueueKey = createSymbol('vfa.key.postFlushQueue');
-export const AccessControIdentifierlKey = createSymbol('vfa.key.accessControIdentifier');
-export const ReactiveIdentifierKey = createSymbol('vfa.key.reactiveleIdentifier');
-export const NonReactiveIdentifierKey = createSymbol('vfa.key.nonReactiveleIdentifier');
+export const AccessControlIdentifierKey = createSymbol('vfa.key.accessControlIdentifier');
+export const ReactiveIdentifierKey = createSymbol('vfa.key.reactiveIdentifier');
+export const NonReactiveIdentifierKey = createSymbol('vfa.key.nonReactiveIdentifier');
 
 // must be a string, symbol key is ignored in reactive
 export const RefKey = 'vfa.key.refKey';

test/apis/watch.spec.js

@@ -34,7 +34,7 @@ describe('api/watch', () => {
     }).then(done);
   });
 
-  it('basic usage(value warpper)', done => {
+  it('basic usage(value wrapper)', done => {
     const vm = new Vue({
       setup() {
         const a = ref(1);

test/setup.spec.js

@@ -98,7 +98,7 @@ describe('setup', () => {
       .then(done);
   });
 
-  it('should reveive props as first params', () => {
+  it('should receive props as first params', () => {
     let props;
     new Vue({
       props: ['a'],
@@ -112,7 +112,7 @@ describe('setup', () => {
     expect(props.a).toBe(1);
   });
 
-  it('should reveive SetupContext second params', () => {
+  it('should receive SetupContext second params', () => {
     let context;
     const vm = new Vue({
       setup(_, ctx) {
@@ -343,7 +343,7 @@ describe('setup', () => {
   });
 
   it('inline render function should work', done => {
-    // let createELement;
+    // let createElement;
     const vm = new Vue({
       props: ['msg'],
       template: '<div>1</div>',