vue.js源码构建

本文深入探讨Vue.js的构建过程,从构建脚本到Runtime Only与Runtime + Compiler的区别。详细解析了构建入口、配置文件、Rollup构建规则以及Vue.js的别名配置。通过对源码的分析,理解不同Vue版本的适用场景。

vue源码是基于Rollup构建的,它的构建相关配置都在script目录下。

构建脚本

通常一个基于NPM托管的项目都会有一个package.json文件,它是对项目的描述文件,它的内容实际上是一个标准的JSON对象。

我们通常会配置script字段作为NPM的执行脚本,vue.js源码构建的脚本如下

{
  "script": {
    "build": "node scripts/build.js",
    "build:ssr": "npm run build -- web-runtime-cjs,web-server-renderer",
    "build:weex": "npm run build -- weex"
  }
}

这里总共有3条命令,作用都是构建vue.js,后面2条是在第一条命令的基础上,添加一些环境参数。

当在命令行运行npm run build 的时候,实际上会执行 node scripts/build.js ,接下来我们来看看它实际是怎么构建的。

构建过程

我们对于构建过程分析是基于源码的,先打开构建的入口js文件,在scripts/build.js中:

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

// filter builds via command line arg
if (process.argv[2]) {
  const filters = process.argv[2].split(',')
  builds = builds.filter(b => {
 
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

浏览器翻译官~

你的励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值