vue其他之“安装、插件、依赖”

文件名为vue的文件，输入vue然后选择模板可以快速创建vue模板 回车，可以出现模板
文件名为html的文件，输入！回车可以出现模板

0.开发工具
Vue Devtools的 安装 vue的开发者工具，可以更好的查看vue的信息 （安装）
Git History Diff 可以看到git所有的提交记录、改动文件，包括每一行代码的提交时间、提交人，非常方便 （安装）
Gitee 提供 Gitee 平台操作仓库能力 （安装）
Open Browser Preview 谷歌浏览器打开 （安装）
Open in External App 在外部应用程序中打开 （安装）
Auto Rename Tag 当我想把它变为h6时，只需要修改第一个开始标签h1为h6，尾标签会自动跟着修改成, （安装）
Bracket Pair Colorizer2  代码变得有颜色 （安装）
Prettier自动格式化-视情况安装

1.手动指定从哪个镜像服务器获取资源
npm install -g cnpm --registry=https://registry.npmmirror.com

2.安装脚手架cnpm install -gd vue-cli  这里的d包含了开发和运行环境
cnpm install -g @vue/cli   //常用
vue --version查看vue-cli脚手架版本,版本必须在4.5以上才可以支持vue3.0
vue -V查看vue-cli脚手架版本,版本必须在4.5以上才可以支持vue3.0

3.创建项目vue create demo
vue init   是vue-cli2.x脚手架 的初始化方式
vue create 

4.安装细节
1.检查到新的版本，对版本更新
2.3个选项，选哪一个，默认vue2 , 默认vue3,建议选第三个（手动选择），因为默认情况下没有路由，没有vuex
3.选择哪个版本2.x 3.x
4.选择路由模式No
5.配置文件是添加新的还是放在xx中    选第一个
6.刚才设定的一些预设信息，是否保存，以后创建项目   

5.指令说明
卸载npm uninstall less-loader
npm install less --save-dev  
npm install less -S -D 

6.注意安装依赖：
vuex、路由、less预处理器、轮播swiper、element-ui、axios、mock、sass预处理器、懒加载、cookie
1.安装npm i vuex@3的时候要vue2.0要安装3版本的
2.安装npm install --save vue-router@3

2.安装less预处理器:
npm i less-loader@7  --save-dev
如果报错就使用cnpm install less --save-dev

4.请安装swiper：5.3.6版本，目前6.0版本使用有问题
cnpm install swiper@^5.3.6 vue-awesome-swiper --save
需要同时安装swiper和vue-awesome-swiper两个插件。
用法：
import { Swiper, SwiperSlide } from ‘vue-awesome-swiper’
import ‘swiper/css/swiper.css’
export default {
components: {    Swiper,    SwiperSlide  }
}

5.element-ui
npm i element-ui -S    （可以先试试看安装能不能成功）7.0版本npm新版安装多会有此依赖树错误的问题出现,解决：npm i -g npm@6.14.8
npm install -g npm   # npm升级到最新版本
npm install npm@6.14 -g  # 6.14就是你想要降的版本
npm uni 是卸载

6.axios安装
引入后
Vue.prototype.axios = axios
接下来，在其它组件内部，就可以使用this.axios进行访问了
Vue2.0建议使用Vue.prototype.$axios = axios;来进行挂载，不需要使用VueAxios插件了

7.mock安装
//1需要安装插件 cnpm i mockjs --save-dev
//2.建mock文件夹 api.js编辑import  Mock from 'mockjs'还有其他
  const mock = true;//3.定义开关
  if(mock){
    require('./mock/api')
  }

8.关于sass安装
a.查看node-sass和sass-loader版本是否对应  node.js版本也要对应起来
sass-loader 4.1.1，node-sass 4.3.0   node11版本
sass-loader 7.0.3，node-sass 4.7.2   node15版本
sass-loader 7.3.1，node-sass 4.7.2   node15
sass-loader 7.3.1，node-sass 4.14.1  node15
node-sass@5.0.0和sass-loader@10.1.1可以完美配合

9.vue-lazyload --save-dev 懒加载
10.vue-cookie --save-dev 要用cookie的方式传递，告诉后台我是谁