必须提前安装好 node 环境,并首先全局 安装 vue-cli3 脚手架
npm install -g @vue/cli
装完之后可以查看一下是否已经安装,我这里安装的版本是 @vue/cli@3.5.1
npm list -g --depth 0
8D8F61E5-118A-473e-9614-F072851DC90C.png
创建项目
运行下面命令创建一个项目
vue create myapp
选择配置,默认配置还是手动,这里我选择手动 Manually
createApp.png
配置相关的插件和功能
配置相关的插件和功能.png
这里选择自己需要的一些插件和功能,我想试一下typescript,所以选上,
- typescript
- vue-router
- vuex
- css预处理器
- 格式检查
- 单元测试
class-style.png
是否使用class风格的组件语法,这里选y,脚手架就会帮我们安装以下组件
- vue-class-component
- vue-property-decorator
是否使用babel做转义,选y
babel.png
是否选择 history 模式路由规则,我这里选择 y
historyRouter.png
选择一种css预处理语言,这里我选择sass
node-sass.png
选择一种校验规则,我选择TSLint
linter.png
选择校验的时机
- 保存的时候校验
-
提交的时候校验
lintfeature.png
选择单元测试的配置,这里选择Mocha + Chai
unitTest.png
这里是询问怎么存放babel,postcss,eslint等的配置文件
- 单独存放
- 集成在package.json
我选择第一项,单独存放
配置存储位置.png
询问是否保存当前配置,我选择否
image.png
配置好了,开始安装
image.png