四、配置好 vscode的插件
Vue 2 Snippets 插件 补全Vue2 格式的代码
vetur 插件 是vue的代码高亮 描述:vetur插件的网址:http://t.zoukankan.com/snowhite-p-7656875.html
Prettier-Standard - JavaScript formatter插件 让代码规范化 官网:https://www.prettier.cn/
Prettier ESLint插件 让代码按照ESLint的规范规格式化代码
五、下载@vue/cli 脚手架
目前 @vue/cli 脚手架的最新版为 version 5
npm install @vue/cli -g
预备工作:先把cmd权限更改为 默认是管理员权限
window+r 键 输入 secpol.msc
点击左边的 “本地策略” --- 再点击右边的 “安全选项” --- 找到 “用户账号控制: 以管理员批准模式运行所有管理员” 点击 并选择 “已禁用” 然后 点击确定 ----- 重启电脑 这样之后启动cmd就是 管理员权限启动的
终端窗口创建vue2.x 项目
首先创建一个新的空文件 vue2Project
mkdir vue2Project
创建 vue2.x 项目
vue create 项目名
注意:项目名,不建议使用中文,如果是多个单词拼接 建议使用 驼峰写法
步骤一:新建一个空文件夹

步骤二:在新建的空文件夹中打开cmd终端
然后输入 cmd

步骤三: 在终端中输入 vue create 项目名 创建项目
输入 vue create 项目名字
例:vue create demo

步骤四:选择自定义模板 Manuall select features

步骤五:选择自己需要的插件
- Babel 包含ES5、6、7、8..... 以后的新语法 并且在打包时 降级为 es5
- TypeScript JS增强版的语法,并且解析 TS语法的插件
PWA 支持离线模式操作部分功能 暂时用不到,后期可以用其他的代替
- router路由插件 实现单页面跳转的插件
vuex-store插件 是vue的一个状态管理公共仓 也是内存插件
- CSS Pre-processors插件 是CSS预处理器插件 支持less、sass 转 css语法
- Linter/Formatter插件 是检测代码规范的插件
- Unit Testing插件 做单元测试的插件
- E2E Testing插件 黑盒测试的插件

选择:Babel 、router、CSS Pre-processors、Linter/Formatter
注意:选择好了以后,直接按 "回车键" 进行下一步
步骤六:选择使用 2.x 的 vue.js

步骤七:router路由 不使用 history mode(历史模式)
输入n 敲回车

步骤八:CSS解析插件, 选择使用less 语法

步骤九:ESLint对代码质量的标准 推荐选择 ESLint + Standard config 或者 ESLint + Prettier

步骤十: 设置 ESLint 检查代码的时机
选择 Lint on save 保存的时候 触发 ESLint检查

lint on save 代码文件中有代码不符合 lint 规则时,会在 compile 阶段提示 warning。如果出现了语法错误,会直接在页面上显示 error
lint and fix on commit 代码除了语法错误导致的 error 外不会提示 warning。而是在当前项目进行 git commit 操作的时候,通过 githook,在 pre-commit 阶段执行 lint 和 fix 操作,自动帮我们把有语法错误的地方修改为符合规范。
步骤十一:将插件的配置保存在各自的配置文件中
选择:In dedicated config files
Where do you prefer placing config for Babel, ESLint, etc.? (Use arrow keys)

步骤十二:不保存此次配置的项目模板
选择:n

















