vue开发环境的搭建

Node JS的安装

Node JS提供的NPM依赖管理和编译打包工具使用起来非常方便，对于前端比较大型的项目还是采用NPM作为打包工具比较理想。要使用NPM就需要安装NodeJS，下载地址为http://nodejs.cn/download/。
选择系统对应的版本，这里我们下载Window系统的64位zip文件node-v14.2.0-win-x64.zip。下载完成后解压，可以看到里面有一个node.exe的可执行文件，如图所示：
把Node添加到系统环境变量里面，打开cmd命令行，输入npm -v，如果出现下图所示的提示信息，就说明已经安装正确：
如果安装的是旧版本的npm，可以通过npm命令升级

# Linux系统命令
sudo npm install npm -g
# windows 系统命令
npm install npm -g

如图所示，npm从6.9.0版本升级到了6.14.5版本。
更过NodeJS教程可以参考以下资料：

• 中文官网
• 菜鸟学堂

安装webpack

安装好npm之后，就可以通过npm命令来下载各种工具了。安装打包工具webpack，-g表示全局安装，代码如下：

npm install webpack -g

更多webpack教程可以参考以下资料：
菜鸟学堂

安装vue-cli

安装vue脚手架项目初始化工具vue-cli，-g表示全局安装

npm install vue-cli -g

淘宝镜像

因为NPM使用的是国外中央仓库，有时候下载速度比较“喜人”，就像Maven有国内镜像一样，NPM在国外也有镜像可用。这里建议使用淘宝镜像。
安装淘宝镜像，安装成功后用cnpm替代npm命令即可，如cnpm install webpack -g。

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

安装Yarn

Yarn是Facebook发布的node.js包管理器，比npm更快、更高效,可以使用Yarn替代npm。安装了Node，同时也就安装了NPM，可以使用下面的命令来安装：

npm i yarn -g -verbose

NPM官方源访问速度实在不敢恭维，建议使用之前切换为淘宝镜像，在Yarn安装完毕之后执行如下指令：

yarn config set registry https://registry.npm.taobao.org

到此为止，我们就可以在项目中像使用NPM一样使用Yarn了。使用Yarn跟NPM差别不大，具体命令关系如下：

npm install => yarn install
npm install --save [package] => yarn add [package]
npm install --save-dev [package] => yarn add [package] --dev
npm install --global [package] => yarn global add [package]
npm uninstall --save [package] => yarn remove [package]
npm uninstall --save-dev [package] => yarn remove [package]

编译器

Visual Studio Code是一款非常优秀的开源编辑器，非常适合前端作为IDE，根据自己的系统下载响应的版本进行安装，如图所示：
VSCode下载地址
更多VSCode教程可以参考以下资料：
官网文档
简书教程
大家如果想获取最新的文章，可以关注一下我的公众号，以后都会给大家分享满满的干货。