如何使用vue cli4.x搭建vue项目 - 行业资讯 - 肥雀云

　　介绍

这篇文章主要为大家展示了如何使用vue cli4.x搭建vue项目,内容简而易懂,希望大家可以学习一下,学习完之后肯定会有收获的,下面让小编带大家一起来看看吧。

cli - 4. x已经发布好久了,斟酌了好久,还是决定将原来的cli - 2. x升级到4。x,详细的升级过程可以戳这里

1,创建项目vue创建vuetest <代码>

, # 63;请选择一个预设:(用箭头键),# 9756;(使用箭头键) 　　比;eslint违约(巴别塔),# 9756;(使用默认的配置,会安装巴贝尔和eslint) 　　手动选择特性,# 9756;(手动配置)

这里我选择的是手动配置(使用↑↓箭头切换,进入确认,箭头切换失效可以戳这里),当然如果你之前有保存过配置模板的话,在这里还会有第三个选项就是你之前保存过的(下面会说到),因为想想配置的不是很多,所以习惯了每次都是手动配置

3,手动配置项选择

如何使用vue cli4。x搭建vue项目

通过↑↓箭头选择你要配置的项,按空格是选中,按一个是全选,按我是反选(以下是每一个选项的详细解释)

, # 63;请选择一个预设:手动选择功能　　,# 63;检查你的项目所需的特性:(新闻& lt; space>选择,& lt; a>切换,& lt; i>逆选择) 　　祝辞(*)巴别塔,# 9756;(转码器,可以将ES6代码转为ES5代码) 　　()打印稿,# 9756;(js的超集,强类型语言) 　　()进步的Web应用程序(PWA)支持,# 9756;(渐进式网络应用程序) 　　()路由器,# 9756;(vue-router vue路(由)) 　　()Vuex, # 9756; (Vuex (vue的状态管理模式)) 　　()的CSS预处理器,# 9756;(CSS预处理器(如:少,sass)) 　　(*)短绒/格式化程序和# 9756;(代码风格检查和格式化(如:ESlint)) 　　单元测试(),# 9756;(单元测试) 　　()E2E测试及# 9756;(集成测试)

根据自己项目的实际需求选择合适的配置

我这里是全选了这里是后面会出现的配置详细信息

, # 63;使用组件类样式syntax& # 63;(Y/n):和# 9756;(是否使用巴贝尔做转义) 　　　　--------------------------------------------------------------------------------------- 　　,# 63;使用巴别塔与打印稿(所需的现代模式,自动侦测polyfills, transpiling JSX), # 63;,# 9756;(使用巴贝尔与打印稿一起用于自动检测的填充) 　　　　--------------------------------------------------------------------------------------- 　　,# 63;router&使用历史模式;# 63;(需要适当的服务器设置索引后备生产),# 9756;(路由模式) 　　　　-------------------------------------------------------------------------------------- 　　预处理程序和# 63;选择一个CSS (PostCSS Autoprefixer和CSS模块支持默认):(用箭头键),# 9756;(CSS编译器) 　　比;Sass/SCSS (dart-sass), # 9756;(保存后编译) 　　Sass/SCSS (node-sass), # 9756;(实时编译) 　　少　　手写笔　　---------------------------------------------------------------------------------------- 　　,# 63;选择一个短绒/格式化程序配置:(用箭头键),# 9756;(选择语法检查规范) 　　比;ESLint与错误预防alt="如何使用vue cli4.x搭建vue项目">

他们说新项目要求使用cli4。x,于是网上找了步骤执行(建议看完再实际操作)

<强> 1,首先卸载