VUE learning notes

Vue 2入门

提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加
第一章. 安装

---

---

前言

提示：这里可以添加本文要记录的大概内容：

工作需要学习Vue2，不动为何后端要被分到玩前端

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、Vue2安装

Vue 是一个基于nodejs的前端框架，很强大但是也很多坑。许多组件基于Vue开发，例如以后要用到的Element UI 和 Vant组件都有基于Vue2 或者Vue3 的版本。

Vue安装必须有前置的nodejs，现阶段相当多的教程已经写了如何在一台电脑上安装nodejs和vue，但是有个大前提是，你不需要去进行版本控制。比如这次项目由于是返回来总结内容，有个大坑需要注意，开发的pc端前端和移动端前端不在一个版本上，所以就需要版本控制方式，这里参考其他人使用nvm进行安装

二、NVM安装

nvm是一个nodejs的版本控制工具，可以给你自动安装选中的版本，在新老版本中切换，自动下载npm。

1.安装nvm

直接去bing上搜索nvm的github或者gitee的同步库，安装到windows即可
这里有两个大坑：

1. 安装路径不能有中文（这一点很多博客都提到了）
2. 安装路径即使是英文，中间也不能有空格！不然百分百出乱码（巨坑，千万注意，我安装在program files下一样出了乱码）
3. 打开nvm安装目录下settings文件，输入如下代码配置好npm的镜像，不然下载时候会受到网速限制或者甚至翻不出去墙

配置淘宝镜像

arch: 64  //window 64位机
proxy: 
node_mirror: https://npm.taobao.org/mirrors/node/
npm_mirror: https://npm.taobao.org/mirrors/npm/

安装后看别的博客配置好环境变量就行
%NVM_HOME% 和 %NVM_SYMLINK%

2.使用npm

在cmd或者powershell输入如下命令，出现版本号就代表已经安装好

nvm version

使用命令列出nvm能下载的nodejs版本

nvm list available

使用如下命令列出已经安装好的nodejs

nvm list \\前面有星号的就是当前使用的版本

选择合适的版本后用命令进行安装

nvm install xx.xx.xx\\版本号

使用如下命令切换nodejs的版本

nvm use xx.xx.xx \\ 版本号

3.安装对应版本的vue和脚手架

npm install vue -g
npm install vue-cli -g
npm install webpack -g

安装好后用命令
vue -V 显示版本号就是安装完成了

---

总结

使用nvm进行版本控制比自己搞nodejs简单多了，之前被坑了好多次，这那版本对不上。