initGlobalAPI

Vue.config

在 initGlobalAPI 中初始化，一些全局所需的配置

  1. {
  2.   optionMergeStrategies: Object.create(null), // 用于合并策略，用于 core/util/options
  3.   silent: false, // 是否取消警告
  4.   productionTip: process.env.NODE_ENV !== 'production', // 在启动时是否显示生产模式提示消息
  5.   devtools: process.env.NODE_ENV !== 'production', // 是否启用开发者模式
  6.   performance: false, // 是否记录性能
  7.   errorHandler: null, // 用于处理错误的函数
  8.   warnHandler: null, // 用于处理警告的函数
  9.   ignoredElements: [], // 忽略哪些自定义元素
  10.   keyCodes: Object.create(null), // v-on 的自定义别名
  11.   isReservedTag: no,
  12.   isReservedAttr: no,
  13.   isUnknownElement: no,
  14.   getTagNamespace: noop, // 获取标签的命名空间
  15.   parsePlatformTagName: identity, // 解析指定平台的真实标签
  16.   mustUseProp: no, // 检查 attrs 是否必须得用 props 绑定
  17.   async: true, // 是否开启异步更新
  18.   _lifecycleHooks: LIFECYCLE_HOOKS
  19. }

Vue.util

在 initGlobalAPI 中初始化，应该并不推荐开发者使用，应该主要是给 plugin 开发者使用的，比如 vue-router 等插件所需的工具方法

  1. {
  2.   warn, // 报错函数
  3.   extend, // 对象合并函数
  4.   mergeOptions, // 用于修改 options 值 @link https://juejin.im/post/6844903821903298568
  5.   defineReactive // 将数据对象的数据属性转换为访问器属性
  6. }

Vue.set/Vue.delete/Vue.nextTick

在 initGlobalAPI 中初始化，等同 $set/ $delete / $nextTick ，感觉也是暴露给 plugin 使用的。

Vue.options

在 initGlobalAPI 中使用，组件的全局配置存放的地方

  1. {
  2.     components: {
  3.         KeepAlive
  4.     },
  5.     directives: Object.create(null),
  6.     filters: Object.create(null),
  7.     _base: Vue
  8. }

Vue.use

在 initGlobalAPI 中通过 initUse 初始化得到，用于安装 plugin

在此处可以对 Vue 加工

Vue.mixin

在 initGlobalAPI 中通过 initMixin 初始化得到， 用于安装全局 mixin

主要通过 mergeOptions 将 mixin 传入到 Vue.options.mixin 中

Vue.cid/Vue.extend

Vue.component/Vue.directive/Vue.filter

在 initGlobalAPI 中通过 initAssetRegisters 中初始化得到

其实类似于 Vue.mixin 通过 mergeOptions 添加全局的 options

总结

  1. // initGlobalAPI
  2. Vue.config
  3. Vue.util = {
  4.     warn,
  5.     extend,
  6.     mergeOptions,
  7.     defineReactive
  8. }
  9. Vue.set = set
  10. Vue.delete = del
  11. Vue.nextTick = nextTick
  12. Vue.options = {
  13.     components: {
  14.         KeepAlive
  15.         // Transition 和 TransitionGroup 组件在 runtime/index.js 文件中被添加
  16.         // Transition,
  17.         // TransitionGroup
  18.     },
  19.     directives: Object.create(null),
  20.     // 在 runtime/index.js 文件中，为 directives 添加了两个平台化的指令 model 和 show
  21.     // directives:{
  22.     //    model,
  23.     //    show
  24.     // },
  25.     filters: Object.create(null),
  26.     _base: Vue
  27. }
  29. // initUse ***************** global-api/use.js
  30. Vue.use = function (plugin: Function | Object) {}
  32. // initMixin ***************** global-api/mixin.js
  33. Vue.mixin = function (mixin: Object) {}
  35. // initExtend ***************** global-api/extend.js
  36. Vue.cid = 0
  37. Vue.extend = function (extendOptions: Object): Function {}
  39. // initAssetRegisters ***************** global-api/assets.js
  40. Vue.component =
  41. Vue.directive =
  42. Vue.filter = function (
  43.   id: string,
  44.   definition: Function | Object
  45. ): Function | Object | void {}
  47. // expose FunctionalRenderContext for ssr runtime helper installation
  48. Object.defineProperty(Vue, 'FunctionalRenderContext', {
  49.   value: FunctionalRenderContext
  50. })
  52. Vue.version = '__VERSION__'
  54. // entry-runtime-with-compiler.js
  55. Vue.compile = compileToFunctions