像个专家一样构建 Vue.js app 而不伤大脑

1,853 阅读1分钟
绅士们女士们大家好,这里是「绅士大概一分钟」(划掉),其实是构建只要一分钟。

这一分钟你能得到什么:

  1. 愉悦的 Webpack 开发环境,热重载
  2. 专业级的生产环境打包配置,自动分离第三方模块,压缩并且 optimize

那还等什么?开始吧:

第 0 ~ 30 秒

你需要用来安装 vbuild,在没有 yarn 之前这个数字大概要翻至少四倍。

yarn global add vbuild

第 30 ~ 50 秒

来写你的 app 把,能用就行,反正你之后会慢慢加功能,比如放在 `index.js`:
import Vue from 'vue'

new Vue({
  el: '#app',
  render: h => h('h1', 'chuang qian ming yue guang')
})

第 50 ~ 60 秒

先休息 5 秒吧,还剩 5 秒的时候狂敲键盘在终端键入以下内容开启开发模式:

vbuild --dev

如果你打字慢可以打:

vbuild -d

虽然也快不了多少(笑

---

最后呢,app 写好了吗,运行 `vbuild` 不要 `--dev` 就可以像个砖家一样地打包压缩并优化你的 app 了哟。看看打包生成的 `dist` 目录吧!文件多的不要不要的。

---

和 vue-cli 有什么区别?

笑)我不知道,你猜



本文对你有帮助?欢迎扫码加入前端学习小组微信群: