vue环境搭建

一. 安装nodejs

1. 下载nodejs

https://nodejs.org/en/download/

2. 下载完成之后正常安装

3. 安装完成之后查看版本(node安装会默认装好npm)

注：npm（node package manager）

二. 安装淘宝镜像（npm太慢，使用淘宝镜像）

npm install -g cnpm --registry=http://registry.npm.taobao.org

三. 通过cnpm安装vue-cli和webpack(vue-cli自带了webpack)

cnpm install vue-cli -g
npm install -g @vue/cli (vue-cli 3)

1. WebPack可以看做是模块打包工具：分析项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其打包为合适的格式以供浏览器使用。webpack在打包过程中，会分析各个文件之间的依赖关系，然后生成一个依赖图并用文件的形式保存下来，未来浏览器运行代码的时候就可以读取这个文件，就知道了各个代码块之间的关联以及如何调用了。
2. vue-cli: vue.js的脚手架，它是一个专门为单页面应用快速搭建繁杂的脚手架，它可以轻松的创建新的应用程序而且可用于自动生成vue和webpack的项目模板。
3. webpack与vue-cli的关系
   vue-cli是基于nodejs+webpack封装的命令行工具。你可以理解为汇集了各种命令的 bash，或者bat。
   用vue-cli执行build，实际上是webpack做的。原本需要自己配置webpack的相关配置，被cli简化了。并且按照vue的用户习惯整理了一套构建和目录规范。

四. 创建项目

vue init webpack 项目名
vue create 项目名 (vue-cli 3)

五. 进入项目目录，安装依赖

cnpm install

六. 运行项目

npm run serve

七. 打包项目

npm run build

八. 通过nvm安装多个版本的node

1、下载链接

https://github.com/coreybutler/nvm-windows/releases

2、通过nvm安装node

nvm install v14.16.0

3、通过nvm查看node版本

nvm ls

4、通过nvm切换node版本

nvm use v14.16.0