Vue CLI 3.0 正式发布,Vue.js 开发标准化工具

文章来自开源中国(微信ID:oschina2013)

如需转载请注明上述来源,其他来源无效并视为侵权

Vue CLI 3.0 已发布,该版本经历了重构,旨在:

1)减少现代前端工具的配置烦扰,尤其是在将多个工具混合在一起使用时;

2)尽可能在工具链中加入最佳实践,让它成为任意 Vue 应用程序的默认实践。

Vue CLI 是 Vue 应用的标准化构建工具(链),核心是提供基于 webpack 4 构建的预配置构建设置,目标是最大限度地减少开发者必须经历的配置过程。因此,Vue CLI 3 对具备以下特点的项目都支持开箱即用:

1、预配置的 webpack 功能,如模块热替换、代码分割、 摇树优化(tree-shaking)、高效持久化缓存、错误覆盖等;

2、通过 Babel 7 + preset-env 对 ES2017 进行转换和基于使用情况的 polyfill 注入

3、支持 PostCSS(默认启用 autoprefixer)和所有主要的 CSS 预处理器

4、具有 hashed asset link 和预加载/预取资源提示的 Auto-generated HTML

5、通过.env 文件的模式和级联环境变量

6、现代模式:并行发布原生 ES2017 +bundle 和传统 bundle

7、多页面模式:构建具有多个 HTML / JS 入口点的应用程序

8、构建目标:将 Vue 单文件组件构建为库或原生 Web 组件

此外,你可以在创建新项目时混合使用多种可选集成,包括:

1、TypeScript

2、PWA

3、Vue Router & Vuex

4、ESLint / TSLint / Prettier

5、通过 Jest 或 Mocha 进行单元测试

6、通过 Cypress 或者 Nightwatch 进行 E2E 测试

最重要的是,Vue CLI 确保所有上述功能可以很好地协同工作,不必自己进行连接。 

无需 Eject 即可配置

上面列出的所有功能都可以零配置:当通过 Vue CLI 3 构建项目时,它会安装 Vue CLI 运行时服务(@ vue / cli-service),选择功能插件,并生成必要的配置文件。在多数情况下,你只需要专注于编写代码。

但是,试图抽象掉底层依赖关系的 CLI 工具通常会剥离对这些依赖关系进行微调的内部配置的能力 - 为了进行这种更改,用户通常必须 “eject”,即检查原始配置到项目,以便进行更改。这样做的缺点是,一旦 eject,从长远来看,将无法升级到最新版本的工具。

开发团队承认能够更低级别访问配置的重要性,但也不想抛弃那些 “eject” 用户,因此找到了一种方法来不用 eject 即可调整配置的方法。

对于 Babel,TypeScript 和 PostCSS 等第三方集成,Vue CLI 会尊重这些工具的相应配置文件。对于 webpack ,用户可以利用webpack-merge将简单对象合并到最终配置中,或者通过 webpack-chain 精确定位和调整现有的加载器和插件。此外,Vue CLI 附带vue inspect命令可帮助检查内部 Webpack 配置。最大的好处是,你不需要为了进行小的调整而eject - 你仍然可以升级 CLI service和插件以接收修复和新功能更新。

可扩展的插件系统

Vue CLI 3 的插件系统非常强大:它可以在应用程序的 scaffolding阶段注入依赖项和文件,并调整应用的 webpack 配置或在开发期间向 CLI service注入其他命令。大多数像 TypeScript 这样的内置集成都使用相同的插件 API实现为插件功能,所有这些 API 都可用于所有社区插件。如果有兴趣编写自己的插件,请查阅插件开发指南

在 Vue CLI 3 中,不再拥有“模板”(template) - 相反,你可以创建自己的远程设置,并与其他开发者共享你选择的插件和选项。

图形用户界面 (GUI)

Vue CLI 3 附带了一个完整的 GUI ,不仅可以创建新项目,还可以管理项目中的插件和任务。甚至还带有下面这种花哨的 webpack 仪表板 :

即时原型(Instant Prototyping)

在编写代码之前等待 npm install 并不好玩。有时我们只需要即时访问工作环境即可获得灵感的火花。使用 Vue CLI 3 的vue serve 命令,你只需要启用 Vue 单文件组件即可进行原型设计。

原型开发服务器和标准应用具有相同的设置,因此你可以轻松地将原型*.vue 文件移至正确的脚手架项目的src 文件夹中以继续处理它。

更多更新细节可查阅发行说明

Get started :https://cli.vuejs.org/zh/guide/

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,015评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,262评论 1 292
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,727评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,986评论 0 205
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,363评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,610评论 1 219
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,871评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,582评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,297评论 1 242
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,551评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,053评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,385评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,035评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,079评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,841评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,648评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,550评论 2 270

推荐阅读更多精彩内容