vue源码初始化

Author: coder-czy

.babelrc

@@ -0,0 +1,5 @@
+{
+  "presets": [
+    "@babel/preset-env"
+  ]
+}

.gitignore

@@ -0,0 +1,10 @@
+.DS_Store
+node_modules
+*.log
+explorations
+TODOs.md
+RELEASE_NOTE*.md
+.vscode
+dist
+temp
+types/v3-generated.d.ts

package-lock.json

@@ -0,0 +1,19 @@
+{
+  "name": "vue-code",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "type": "module",
+  "scripts": {
+    "dev": "rollup -cw"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "@babel/core": "^7.20.12",
+    "@babel/preset-env": "^7.20.2",
+    "rollup": "^3.9.1",
+    "rollup-plugin-babel": "^4.4.0"
+  }
+}

package.json

@@ -0,0 +1,17 @@
+// rollup默认可以导出一个对象，作为打包配置文件
+import babel from "rollup-plugin-babel"
+export default {
+  input: './src/index.js',//入口
+  output: {
+    file: './dist/vue.js',//出口
+    name: 'Vue',//global.Vue
+    format: 'umd',//规范
+    sourcemap: true//可以调试源代码
+  },
+  plugins: [
+    babel({
+      exclude: 'node_modules/**'//排除node_modules
+    })
+  ]
+
+}

rollup.config.js

@@ -0,0 +1,8 @@
+import { initMixin } from "./init"
+
+function Vue (options) {//用户选项
+  debugger
+  this._init(options)
+}
+initMixin(Vue)
+export default Vue

src/index.js

@@ -0,0 +1,10 @@
+import { initState } from "./state"
+
+export function initMixin (Vue) {//给vue添加init方法
+  Vue.prototype._init = function (options) {//用于初始化操作
+    const vm = this
+    vm.$options = options
+
+    initState(vm)
+  }
+}

src/init.js

@@ -0,0 +1,15 @@
+export function initState (vm) {
+  const ops = vm.$options
+  if (ops.data) {
+    initData(vm)
+  }
+
+}
+
+function initData (vm) {
+  let data = vm.$options.data
+  typeof data === 'function' ? data.call(vm) : data
+  debugger
+  console.log(data)
+
+}