Vuejs2.5.9源码解读(1) — package.json

获取vue2.5.9源码

从https://github.com/vuejs/vue/releases下载源码包。

package.json脚本命令

vue下的package.json:

...
"scripts": {
"dev": "rollup -w -c build/config.js --environment TARGET:web-full-dev",
"dev:cjs": "rollup -w -c build/config.js --environment TARGET:web-runtime-cjs",
"dev:esm": "rollup -w -c build/config.js --environment TARGET:web-runtime-esm",
"dev:test": "karma start test/unit/karma.dev.config.js",
"dev:ssr": "rollup -w -c build/config.js --environment TARGET:web-server-renderer",
"dev:compiler": "rollup -w -c build/config.js --environment TARGET:web-compiler ",
"dev:weex": "rollup -w -c build/config.js --environment TARGET:weex-framework",
"dev:weex:factory": "rollup -w -c build/config.js --environment TARGET:weex-factory",
"dev:weex:compiler": "rollup -w -c build/config.js --environment TARGET:weex-compiler ",
"build": "node build/build.js",
"build:ssr": "npm run build -- web-runtime-cjs,web-server-renderer",
"build:weex": "npm run build -- weex",
"test": "npm run lint && flow check && npm run test:types && npm run test:cover && npm run test:e2e -- --env phantomjs && npm run test:ssr && npm run test:weex",
"test:unit": "karma start test/unit/karma.unit.config.js",
"test:cover": "karma start test/unit/karma.cover.config.js",
"test:e2e": "npm run build -- web-full-prod,web-server-basic-renderer && node test/e2e/runner.js",
"test:weex": "npm run build:weex && jasmine JASMINE_CONFIG_PATH=test/weex/jasmine.json",
"test:ssr": "npm run build:ssr && jasmine JASMINE_CONFIG_PATH=test/ssr/jasmine.json",
"test:sauce": "npm
4000
run sauce -- 0 && npm run sauce -- 1 && npm run sauce -- 2",
"test:types": "tsc -p ./types/test/tsconfig.json",
"lint": "eslint src build test",
"flow": "flow check",
"sauce": "karma start test/unit/karma.sauce.config.js",
"bench:ssr": "npm run build:ssr && node benchmarks/ssr/renderToString.js && node benchmarks/ssr/renderToStream.js",
"release": "bash build/release.sh",
"release:weex": "bash build/release-weex.sh",
"release:note": "node build/gen-release-note.js",
"setup": "node build/setup.js",
"commit": "git-cz"
},
...

vuejs最初是为web平台设计的，后面加入了对weex的支持，因此上面会有weex的相关内容。web平台编译脚本命令：

"build": "node build/build.js",

和

"dev": "rollup -w -c build/config.js --environment TARGET:web-full-dev",

。build应用于生产环境，dev应用于开发环境。

源码项目结构

阅读源码前，先关注下项目目录结构，学习项目目录结构组织，为以后自己做项目规划项目目录提供借鉴。

.circleci

.github

benchmarks

build                 // 打包相关配置，根据不同入口，打包不同的文件
- config.js         // 打包生成的相关信息

dist                  // 打包后生成文件的存放位置

examples              // vuejs的部分示例

flow                  // 使用Flow进行静态类型检查，这里定义声明了一些静态类型

packages              // vue编译后生成的npm包

src                   // 源码主体
- compiler          // 模板解析相关文件
- codegen         // 根据ast生成render函数
- directives      // 通用生成render函数之前需要处理的指令
- parser          // 模板解析

- core              // 核心代码
- components
- global-api
- instance
- observer
- util
- vdom

- platforms         // 平台划分
- web             // web端独有文件
- compiler
- runtime
- server
- util
- weex            // weex端独有文件

- server            // 服务端渲染相关
- bundle-render
- optimizing-compiler
- template-renderer
- webpack-plugin

- sfc               //

- shared            // 共享工具方法

test                  // 测试用例

types                 // typescript

.babelrc                 // babel配置信息[扩展内容(常用工具/Babel-Javascript编译器/Babel配置文件基础)]
.editorconfig[*]         // 编辑器配置
.eslintignore[*]         // eslint检查忽略配置[扩展内容(常用工具/ESLint基础)]
.eslintrc[*]             // eslint配置信息[扩展内容(常用工具/ESLint基础)]
.flowconfig[*]           // flow配置信息[扩展内容(常用工具/Flow基础)]
.gitignore[*]            // git提交忽略文件配置[扩展内容(常用工具/Git基本使用)]
BACKERS.md[*]            // 发起人和支持者信息
LICENSE[*]               // 项目使用的许可信息
package-lock.json[*]     // 项目依赖版本的快照信息
package.json[*]          // 项目依赖及项目信息[扩展内容(Nodejs/package.json文件内容解析)]
README.md[*]             // vue相关介绍