Vue项目做了不少,最近在学习设计模式与Vue源码,记录一下自己的脚印!共勉!注:此处源码学习方式为先了解其大模块,从宏观再去到微观学习,以免一开始就研究细节然后出不来~
- config.js
- 'web-full-dev': {
- entry: resolve('web/entry-runtime-with-compiler.js'),
- }
- entry-runtime-with-compiler.js
- import config from 'core/config'
- import Vue from './runtime/index'
- export default Vue
- runtime/index.js
- import Vue from 'core/index'
- instance/index.js
- import { initMixin } from './init'
- import { stateMixin } from './state'
- import { renderMixin } from './render'
- import { eventsMixin } from './events'
- import { lifecycleMixin } from './lifecycle'
- import { warn } from '../util/index'
- function Vue (options) {
- if (process.env.NODE_ENV !== 'production' &&
- !(this instanceof Vue)
- ) {
- warn('Vue is a constructor and should be called with the `new` keyword')
- }
- this._init(options)
- }
- initMixin(Vue)
- stateMixin(Vue)
- eventsMixin(Vue)
- lifecycleMixin(Vue)
- renderMixin(Vue)
- export default Vue
- .//初始化的入口,各种初始化工作
- .initMixin(Vue)
- .//数据绑定的核心方法,包括常用的$watch方法
- .stateMixin(Vue)
- .//事件的核心方法,包括常用的$on,$off,$emit方法
- .eventsMixin(Vue)
- .//生命周期的核心方法
- .lifecycleMixin(Vue)
- .//渲染的核心方法,用来生成render函数以及VNode
- .renderMixin(Vue)
来源: http://www.cnblogs.com/Nutrient-rich/p/7754675.html