一、 安装Node.js
(一) 注意事项
1. 注意电脑系统版本以及位数，按照自己电脑的环境下载相应的Node.js安装包
2. 确定运行项目的Node.js版本和npm版本，避免后期因为版本不同而产生的一些差异问题
3. 在官网下载Node安装包时请下载稳定版（或不同版本的稳定版），正确区分稳定版（LTS）和最新版（Current）
(二) 下载安装
双击安装包，一直点下一步，请自定义安装目录（推荐），然后一直点下一步，最后安装成功即可。
(三) 检测验证
在键盘按下【win+R】键，输入cmd，然后回车，打开命令行界面，进入命令提示符窗口，分别输入以下命令，显示版本号，则安装成功
node -v? ? ? ? ?显示安装的nodejs版本
npm -v? ? ? ? ?显示安装的npm版本
(四) 更改全局下载路径
1、 一般情况下全模块所在路径和缓存路径放在node安装目录，所以在安装目录下新建【node_global】和【node_cache】文件
2、 命令行设置路径
打开命令行界面，输入下面命令：
npm config set prefix " C:\Tools\web\Nodejs\node_global"
npm config set cache " C:\Tools\web\Nodejs\node_cache"
(五) 配置环境变量
1、 在【用户变量】Path下新增【C:\Tools\web\Nodejs\node_global】环境变量
2、 在系统变量下新建【NODE_PATH】,变量值：【C:\Tools\web\Nodejs\node_global\node_modules】
3、 在系统变量【Path】下新增【%NODE_PATH %】变量
??
4、 测试验证?
npm install express -g? ? ?# -g是全局安装的意思（会下载到C:\Tools\web\Nodejs\node_global\node_modules目录），不加 -g 就是默认下载到当前目录
能正确下载到配置的目录表示node环境配置成功！
注意：
若执行命令npm install express -g 出现如下报错，是由于权限的原因，右击Nodejs文件夹->属性->安全，点击编辑，将所有权限都?即可。
(六) 全局安装cnpm
由于npm的服务器在海外，所以访问速度比较慢，访问不稳定 ，cnpm的服务器是由淘宝团队提供 服务器在国内cnpm是npm镜像，一般会同步更新，相差在10分钟，所以cnpm在安装一些软件时候会比较有优势。但是一般cnpm只用于安装时候，所以在项目创建与卸载等相关操作时候我们还是使用npm。
npm install -g cnpm --registry=https://registry.npm.taobao.org
执行成功后目录会出现cnpm文件
如果出现“xxx不是内部命令”说明没找到命令
① 可以尝试关闭cmd窗口，然后重新打开cmd
② 环境变量配置不完整（重点）
二、 安装Vue脚手架
(一) 安装Vue-cli脚手架
命令行执行cnpm install --g vue-cli下载脚手架
检测vue环境：vue -V
(二) 创建项目
vue create? code? ? //其中code为你的项目目录名称?
? (enter键确认,并进入下一步)
然后选择第三个自定义项目环境Manually select features(手动选择项目特性)
(三) 选择运行环境
（按键盘空格表示选中或者取消）
? Babel 主要是对es6语法转换成兼容的js （选上）
? TypeScript 支持使用TypeScript语法来编写代码
? Progressive Web App (PWA) Support [把网页做的更像原生app]
? Router 支持vue路由配置插件（一般都会选择）
? Vuex 支持vue程序状态管理模式 (一般都会选择)
? CSS Pre-processors 支持css预处理器 （一般都会选择）
? Linter / Formatter 支持代码风格检查和格式化 （选上）
? Unit Testing 单元测试
? E2E Testing E2E测试
-----------------------------------------------------------------
选择vue版本
这里的意思是问你本次项目是否采用history模式，如果选择Y,需要后台配置具体看vueRouter官网解释，这里我门选择 n用hash模式
-----------------------------------------------------------------
问你选择哪一种CSS预处理语言，我的项目中一般使用的是SCSS我选择第一个
-----------------------------------------------------------------
选择一种格式化代码方式：我一般选择 ESLint + Prettier
-----------------------------------------------------------------
意思是问你什么时候进行代码规则检测，我一般会选择保存就检测，也就是Lint on Save
-----------------------------------------------------------------
意思是将Babel,PostCSS,ESLint这些配置文件放哪，通常我们会选择放到独立位置，让package.json文件干净点，所以选择第一个
-----------------------------------------------------------------
这里是问你是否记录这次配置选择，选择之后会让你为这次配置起一个名字，这样下次可以直接快速配置选择，最后回车后就会初始化项目了
根据指令提示 我们先执行cd code，然后执行npm run serve，就可以正常启动项目了
三、 项目配置
(一) 项目结构
api：数据请求接口目录，封装Http请求并挂在于vue原型链上
utils：工具事件目录，封装公共方法
assets：静态资源文件，css、img等，这个文件内容不会被压缩
components：组件模板文件，用于存放公共组件
mixin：混入组件，相当于提出公共方法，在需要的地方可多次使用
router：路由组件，可做全局路由配置和拦截
store：临时存储，引入vuex-persist做持久化存储（相当于locastrong本地存储）
views：页面资源文件
(二) Scss预处理器
可以做公共css样式，公共变量，公共css方法
在vue.config.js 配置公共scss资源加载方式（注意：公共scss文件并不能在