如何搭建Vue开发环境以及创建一个vue项目到运行全过程简单易懂！

第一步：安装Node.js和npm

官网下载：https://nodejs.org/en/download/
下载好了安装一直点就好了，npm不要再次安装，node安装包里面自带的有，安装完成在cmd 命令输入 node -v npm -v 回车查看，如下图看到版本号即为安装成功。

• 

第二步： 安装 webpack和cnpm

cnpm和npm的区别就在于下载路径不一样，cnpm走的是国内下载路径，很快，但npm 走的是国外的，下载速度要慢很多，建议使用cnpm但不是必须使用，安装直接在cmd命令里面继续输入
npm install cnpm -g --registry=https://registry.npm.taobao.org 回车就可以，安装完后直接继续输入cnpm -v 看到版本号如下图说明安装成功

安装webpack:Cnpm/npm install -g webpack,安装完成后

第三步：安装Vue-cli

全局安装 继续输入 cnpm install -g vue-cli 回车，安装完成后，继续输入vue -V看到如下图即为安装成功，注意这里的V 是大写的

到这里我们的环境基本配置完成，如果是启动项目，直接在项目src那层文件夹中执行cmd启动命令，npm run dev 或者 npm run serve 如果项目启动失败可能是依赖包有问题，直接在cmd命令输入 cnpm install 再继续执行启动命令即可，如果你是要新建一个vue项目那接着往下看：

第四部：使用vue-cli来创建一个基于 webpack 的新项目

继续输入vue init webpack mydemo 按回车出现下图，直接回车，出现选项除了install vue-router选yes，其他全部选no即可 ，然后按照下面提示输入 cd mydemo 进入你创建的项目目录，然后继续 cnpm install 安装依赖包，安装完成后 执行 npm run dev 即可成功启动项目；

既然都用到VUe了，那你对VUE全家桶一定不陌生吧，如果你还不知道，就该好好学习一下啦：什么是Vue全家桶,Vue全家桶包含哪些东西以及怎么使用
希望这篇文章可以能帮到你哦，喜欢的点个赞吧！
这里有个我自己整理的关于VUE开发环境配置文档，大家可以免费下载下来，保存在电脑里面，这样换工作后就不需要从新配置环境了，直接打开文档按需引入安装配置即可，白嫖的还不要，快拿走吧：https://download.csdn.net/download/m0_46156566/13710044