VSCode搭建Vue项目
vscode vue 格式化
1.在 vscode 的extension中搜索 “vetur”插件，并安装，安装成功后重启编辑器。
2.设置，查找 vetur.editor.defaultFormatter
Editor:Default Formatter 选择 Vetur
1.假设Vscode、nodejs等已经安装
打开VScode的终端，调出命令输入框。点击终端-新建终端。
node -v && npm -v
查看npm安装的插件
npm ls -g cnpm
npm ls -g --depth 1
2.vue-cli可以帮助我们快速构建Vue项目。
npm install -g vue-cli
3.安装webpack，它是打包js的工具
npm install -g webpack
4.始创建vue项目
首先创建一个文件夹用来存放你的项目，用vscode打开对应的文件夹，并在终端cd到对应的文件夹
vue init webpack myvue
1.项目名称，如果不需要就直接回车
2.项目描述，如果不需要就直接回车
3.项目作者，默认计算机用户名
4.构建方式，两个选择（上下箭头选择，回车即为选定,vscode支持箭头选择）
建议选择 : Runtime + Compiler:recommended for most users
5.安装vue的路由插件，需要就选y
6.是否使用ESLint检测你的代码，建议选择 ‘N’
因为选择 ‘Y’ 在做调试项目时,控制台会有很多 黄色警告 提示格式不规范,但其实并不影响项目
7.是否安装单元测，建议 : N
8.是否安装E2E测试框架NightWatch（E2E，也就是End To End，“用户真实场景”）建议 : N
9.项目创建后是否要为你运行“npm install”?这里选择包管理工具(上下箭头选择，回车即为选定,vscode支持箭头选择）
// 使用npm
// 使用yarn
// 自己操作
完成之后的vscode左边可以看到如下目录，其中main.js就是入口。
5.运行项目
先cd到项目文件夹，cd myvue，然后输入以下指令
完成之后，项目文件夹中会出现一个dist文件夹，里面就是打包之后的内容，直接部署就好
npm 部署方式
npm run dev
npm run build
yarn 部署方式
yarn run dev
yarn build
npm与yarn比较：
npm init yarn init 初始化项目
npm install/link yarn install/link 默认安装依赖
npm install taco --save yarn add taco 安装某个依赖，并默认保存到package
npm uninstall taco --save yarn remove taco 移除某个依赖
npm install taco --save-dev yarn add taco --dev 安装某个开发时依赖
npm update taco --sav yarn upgrade taco 更新某个依赖
npm install taco --global yarn global add taco 安装某个全局依赖
npm publish/login/logout yarn publish/login/logout 发布/登录/登录
npm run/test yarn run/test 运行某个命令
Yarn 独有的命令：
yarn licenses ls —— 允许你检查依赖的许可信息
yarn licenses generate —— 自动创建依赖免责声明 license
yarn why taco —— 检查为什么会安装 taco，详细列出依赖它的其他包
yarn why vuepress —— 检查为什么会安装 vuepress，详细列出依赖它的其他包
lite-server 安装
npm init
npm install --save-dev lite-server
修改package.json文件，加入如下语句：
"scripts": {
"dev": "lite-server",
"start": "lite-server"
},
默认端口是3000，如果想使用其他端口需要修改配置：
新建bs-config.json文件，
{
"port":8084,
"browser" : ["chrome"]
}
高级玩法
删除json配置文件，新建bs-config.js文件，
在这里你可以自定义lite-server的行为，在刷新的时候执行各种回调函数，比如压缩css，比如合并js等
"use strict";
module.exports = {
injectChanges: false,
files: [ './**/*.{html,htm,css,js}' ],
watchOptions: { ignored: 'node_modules' },
server: {
baseDir: './',
middleware: []
},
"port":8084,
"browser" : ["chrome"]
}