vue-cli4.x创建项目

前言

之前都是用vue-cli2.9.3开发的,现在终于有空来升级一下了,刚刚下载的版本是vue-cli4.3.1。
下载之前要先卸载以前的vue-cli2.x,npm uninstall vue-cli -g或者yarn global remove vue-cli卸载它
卸载vue-cli2.x
卸载完之后,在下载vue-cli4.x
vue-cli4.x创建项目_第1张图片
如果你用npm下载失败了,如上图所示,不要慌,可能是你的网络太差了而已,因为npm的服务器在国外呢。那么,我们的解决办法就是用淘宝镜像cnpm去下载,就可以了。
下载成功
下载完了,那么我们开始创建项目吧!
创建项目详解参考的是:https://blog.csdn.net/sxjit/article/details/104238661

vue-cli4.x创建项目详解

创建项目


vue create 项目名

选择配置

vue-cli4.x创建项目_第2张图片
请无视第一项,是我之前的个人配置,一般会有上面两项。
default:默认配置(只有babel和eslint)
Manually select features:手动配置
一般做项目默认配置是不够用的,所以我们选择手动配置
vue-cli4.x创建项目_第3张图片
我自己的配置是这样的,你们可以根据自己的实际情况选择!
vue-cli4.x创建项目_第4张图片

选择路由模式

选择路由模式

路由模式分history和hash,hash模式是#/开头的,可以根据自己的实际情况选择,个人感觉差别不大。

选择css预编译方式

vue-cli4.x创建项目_第5张图片
我一般选择less,其实它们三个用法相似,看个人熟练度吧。如果是小白,建议不要选sass/scss,因为sass被墙了,npm总是会下载失败的,要用cnpm才能下载。

选择代码校验方式

vue-cli4.x创建项目_第6张图片
开发没什么要求的话,可以选第一个。最后一个配合VScode里的Prettier插件使用也不错,主要是看你们自己的心情拉。

选择代码检查时间点

代码检查时间点
选择第一项就是,在保存之后自动检查代码格式,我一般选择这个。
第二个是fix 或者 commit 的时候检查。

询问配置保存的位置

配置保存
选第一个就是自己自定义名字,存上面选择的配置(一开始创建项目的第一个)。
第二个就是保存在package.json里。

询问是否保存为预设值

是否保存
这个是询问刚刚的配置是否保存我预设值,保存了之后,以后vue create项目时就是会现在你之前保存过的设置。个人推荐保存吧,为了以后创建项目方便点。

自动创建

直接回车就是自动创建项目了。

你可能感兴趣的:(vue)