vue-cli4.5创建vue项目
1. 关于node 以及 配置npm镜像为淘宝镜像
-
node -v 查看当前版本
-
nvm ls 查看所有版本
-
nvm use 12.19.0 切换版本
npm镜像为淘宝镜像:
npm config set registry https://registry.npm.taobao.org
2. 安装vue-cli4.5
npm install -g @vue/cli //全局安装vue-cli最新版本
vue -V //注意,此时需要使用大写的-V,小写的-v
出现如下所示表示vue脚手架(vue-cli4.5)安装成功
> C:\Users\dataexa>vue --version
> @vue/cli 4.5.9
复制代码
3. 创建vue项目
3.1 进入创建项目目录
vue create test001 //创建项目,test001位项目名,项目名中不允许出现大写字母
复制代码
3.2 选择自定义配置
通过键盘中的向下箭头控制,选择 Manually select features 手动配置
如下图所示。
手动配置选项解释
3.3 选择手动配置中的选项
向上向下箭头控制方向,空格进行选中,可选择如下配置,引入Router 和vuex以及CSS预处理器,选择完成回车即可
3.4 选择vue版本
因为 vue 3的生态目前还不太健全,建议非尝鲜项目选择 vue 2.x。
因为需要才选择的3
3.5 选择是否使用历史模式
此处建议选择不使用,即输入N,选择使用hash模式
3.6 选择CSS预处理器
此处建议选择 Sass/SCSS(with dart-sass),即直接选择回车即可。
node-sass是自动编译实时的,dart-sass需要保存后才会生效
3.7 选择eslint 校验规则
此处建议选择默认配置,即直接回车即可。 我没有这一步
自己没有要求前面就不要选eslint
3.8 选择什么时候进行代码校验
此处建议选择第一个,即直接回车即可。 我没有这一步
Lint on save 保存时检查, Lint and fix on commit 提交时检查
3.9 选择如何存放配置
此处建议选择第二个配置,即存放到package.json文件中。
In dedicated config files 存放到独立文件中,In package.json 存放到 package.json 中
3.10 选择是否保存本次配置
建议选择N,即不保存,否则以后创建项目修改不配置不太方便