从0开始创建vue工程化项目~

为啥要写这个呢？就是事儿干完了，没啥事做了。

其实这章主要是讲如何让项目好管理点和防止接手人拿刀上你家喝茶，是摆脱菜鸡通往初级的必经之路。

一、创建vue项目前配置

第一步: 输入：npm install -g cnpm --registry=https://registry.npm.taobao.org 即可安装npm镜像源

( 以后再用到npm的地方直接用cnpm来代替就好了 ) 检查是否安装成功：cnpm -v 

 第二步: 全局安装vue-cli

安装vue-cli的两种方式：输入cmd命令
npm install -g @vue/cli //这个是从国外下载的比较慢 √
cnpm install -g @vue/cli //这个是从镜像源下载

查看安装的版本（显示版本号说明安装成功）
vue --version

***问题一 : 出现下面这样的情况需要下切换node版本 ( 版本需要12.0.0以上 或者大于等于14.0.0 ) 没有出现则跳过.

 ***切换node版本使用nvm：

（一） : 下载nvm  点击下面百度网盘链接下载-->安装

链接：https://pan.baidu.com/s/1RbbmkrRPWzvPU85JQ7H1KQ 
提取码：2001

（二）: 点击window 进入powershell，以管理员身份运行

查看nvm版本 : nvm -v

查看可下载node版本 : nvm ls available

查看环境中的 node 版本 : nvm ls ( 前面有*号的 表示当前使用的node版本号 )

下载符合要求版本的node : nvm install 14.16.0

使用 14.6.0版本的node : nvm use 14.16.0

查询当前node 版本号 : node -v

***可略过 : 如果你原来有版本或者版本比较低，可以升级
npm update -g @vue/cli

yarn global upgrade --latest @vue/cli

第三步：创建vue项目

第一步 : window+R----->cmd----->vue -V 查看 vue-cli版本

 第二步: vue ui --会打开一个vue项目管理器

第三步: 创建vue项目

 进行手动配置

点击下一步出现选项:

Choose Vue version --是否选择vue版本 √

Babel --代码编译器(把代码转为低版本兼容) √

TypeScript --TS技术:js的超级加强 (不是必须选项)

Progressive Web App(PWA) Suport --项目离线访问 (不是必须选项)

Router --路由 √

Vuex --vue状态管理器(管理数据的) √

CSS Pre-processors --css预处理器(sass/scss) √

Linter / Formatter --语法书写规范(代码书写不规范会报错,相互但与 开启严格模式) (不是必须选项)

Unit Testing --基于用户测试工具 (不是必须选项)

E2E Testing --基于服务端测试工具 (不是必须选项)

使用配置文件 --配置文件 √

选择好之后点击下一步: 创建好了