vue搭建环境,请手动配置Vue开发环境

　　刚开始学vue，新手装这个环境真的不太友好。下面这篇文章主要介绍Vue安装和环境配置的相关信息，有需要的朋友可以参考一下。

目录

　　 1、安装node.js2、查看npm3、安装npm的国产镜像—cnpm4、安装webpack(开源前端打包工具)5、检查webpack是否安装成功6、安装vue-cli脚手架搭建工具7、创建vue项目补充：Vue-CLI下载repo vuejs-templates/Web Pack失败

1、安装node.js

　　从node.js官网下载安装node。安装过程很简单，一路“下一步”就行(傻逼安装)。安装完成后，打开命令行工具(win r，然后输入cmd)，输入node -v，如下图所示。如果出现相应的版本号，则安装成功。

2、查看npm

　　一旦安装了node.js，您就有了自己的npm(包管理工具)。打开命令行工具(win r，然后输入cmd)，输入npm -v命令，查看npm是否安装成功。

3、安装npm的国内镜像—cnpm

　　在命令行中输入NPM install-g cnpmregistry=http://registry.npm.taobao.org。安装完成后，可以使用cnpm -v命令检查安装是否成功。如果输出了版本号，则安装成功。

4、安装webpack（一款开源的前端打包工具）

　　打开命令行工具输入：cnpm install webpack -g

5、查看webpack是否安装成功

　　安装完成后，输入webpack -v。如果出现xxx未安装，则需要执行相应的指令，如下图所示。只需执行命令cnpm install webpack -D和cnpm install web pack-dev-server-D。

　　如果出现相应的版本号，则安装成功。

6、安装vue-cli脚手架构建工具

　　打开命令行工具，输入：cnpm install vue-cli -g，安装完成后，输入vue -V(注意这里的大写“V”)，如下图所示。如果出现相应的版本号，则安装成功。

7、创建Vue项目

　　打开命令行工具，输入相应的文件夹路径，执行命令vue init webpack vueDemo(自己的项目名)。

补充：vue-cli Failed to download repo vuejs-templates/webpack连接超时解决办法

　　在我配置了nmp、node.js、vue-cli环境，并准备好为最终测试创建一个项目之后，Vue init webpack项目名称总是失败，我总是报告这个错误，因为我无法连接到外部网络或者连接超时。

　　查阅资料后，记录自己的错误。

　　解决办法是用离线下载。我们需要在github仓库下载vue-templates/webpack，然后在本地解压。

　　您需要手动下载webpack-simple模板，并输入链接https://github.com/vuejs-templates/webpack.

　　下载到我们的c盘用户目录，创建你自己的。vue-templates文件夹，解压到当前文件夹，命名为webpack。

　　当再次执行vue init webpack vuedemo命令时，参数- offline意味着需要离线初始化。这样就可以成功创建了，接下来就是创建项目的参数了。

　　最后，创建完成后，npm run dev启动项目，在浏览器中输入http://localhost:8080/进行测试。这是成功的。

总结

　　关于Vue安装和环境配置的步骤，本文到此结束。有关Vue安装和环境配置的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望你以后能支持我们！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。