Vue源碼解讀(1)--src/core/index.js 入口文件

Vue源碼主入口:src/core/index.js

import Vue from './instance/index' // 引用Vue構造器
import { initGlobalAPI } from './global-api/index' // 調用initGlobalAPI方法,定義全局資源
import { isServerRendering } from 'core/util/env'
import { FunctionalRenderContext } from 'core/vdom/create-functional-component'

initGlobalAPI(Vue)
...

Vue.version = '__VERSION__'

export default Vue //暴露Vue

打印出Vue構造器的屬性及原型對象屬性,此時原型對象已額外定義了30個原型對象屬性及一個自動得到的constructor(構造函數)屬性(Vue.prototype.constructor === Vue)vue

clipboard.png

https://segmentfault.com/img/...
clipboard.pngsegmentfault

該圖片引用自:【Vue源碼探究一】當咱們引入Vue,咱們引入了什麼?
而後查看src/core/global-api/index中的initGlobalAPI方法,將Vue構造器做爲參數傳入api

export function initGlobalAPI (Vue: GlobalAPI) {
  // config
  const configDef = {}
  /**
    // 全局配置: config中的參數
    config = {
        optionMergeStrategies: Object.create(null), // 合併策略的選項
        silent: false, // 取消 Vue 全部的日誌與警告
        devtools: process.env.NODE_ENV !== 'production', // 配置是否容許 vue-devtools 檢查代碼。開發版本默認爲 true,生產版本默認爲 false。生產版本設爲 true 能夠啓用檢查。
        performance: false, // 設置爲 true 以在瀏覽器開發工具的性能|時間線面板中啓用對組件初始化、編譯、渲染和打補丁的性能追蹤。只適用於開發模式和支持 performance.mark API 的瀏覽器上
        errorHandler: null, // 指定組件的渲染和觀察期間未捕獲錯誤的處理函數
        warnHandler: null, // 爲 Vue 的運行時警告賦予一個自定義處理函數。注意這隻會在開發者環境下生效,在生產環境下它會被忽略。
        ignoredElements: [],
        keyCodes: Object.create(null), // 給 v-on 自定義鍵位別名
        isReservedTag: no,
        isReservedAttr: no,
        isUnknownElement: no,
        getTagNamespace: noop,
        parsePlatformTagName: identity,
    }
    **/
  configDef.get = () => config // import config from '../config'
  if (process.env.NODE_ENV !== 'production') {
    configDef.set = () => {
      util.warn(
        // Vue.config = {...}會觸發setter,設置config中屬性不會,Vue.config.silent = true (取消 Vue 全部的日誌與警告)
        'Do not replace the Vue.config object, set individual fields instead.'
      )
    }
  }
  // 各類全局配置項
  Object.defineProperty(Vue, 'config', configDef)
  Vue.util = util // 各類工具函數,及一些兼容性的標誌位
  Vue.set = set // Vue.set
  Vue.delete = del // Vue.delete
  Vue.nextTick = util.nextTick

  Vue.options = Object.create(null) // Vue默認提供的資源
  // ASSET_TYPES: ["component", "directive", "filter"]
  config._assetTypes.forEach(type => {
    Vue.options[type + 's'] = Object.create(null)
  })

  Vue.options._base = Vue

  //builtInComponents: {KeepAlive: KeepAlive}
  util.extend(Vue.options.components, builtInComponents)

  initUse(Vue) // Vue.use
  initMixin(Vue) // Vue.minxin
  initExtend(Vue) // Vue.extend
  initAssetRegisters(Vue)
}
相關文章
相關標籤/搜索