vue源码解读--npm run build做了什么

目录导航

当我们执行npm run build时，执行的是package.json中的scripts下的

根据指令找到对应的文件scripts\build.js

let builds = require('./config').getAllBuilds()

根据模块规范，require的引入方式一般对应的是module.exports或者exprts.youDefinedName，因此找到scripts\config.js，并在该文件下搜索exports.getAllBuilds或module.exports=youDefinedName

exports.getAllBuilds = () => Object.keys(builds).map(genConfig)

builds是一个对象，保存着一组模块规范，比如：AMD、CJS、CMD、ESM、UMD等，vue将根据不同的模块规范输出对应的js文件，示例

genConfig将拿到每一个builds中的键值对并做遍历最后生成一份rollup的打包配置文件

因此builds['web-full-cjs-dev']的输出结果即

即打包出口为dist/vue.common.dev.js；入口为src/platforms/web/entry-runtime-with-compiler.js

回到build.js

process.argv[2]取得实际上是build指令对应的参数，我们这里没有参数，因此会走向else逻辑剔除weex平台的相关代码

之后调用build开始构建，最终调用fs模块的writeFile能力输出打包后的文件

即dist下的js文件

---

也就是说，npm run build只做了一件事，那就是使用rollup输出符合各种模块规范的js文件

因此，我们的入口文件是src/platforms/web/entry-runtime-with-compiler.js