配置Vue开发环境

配置VUE开发环境

1.在node.js官网下载node.js安装包,然后安装,如果不是用安装包安装的可能需要手动配置nodejs环境变量.
2.依次设置npm安装和缓存路径:

//这里路径我指定的是nodejs安装包所在的文件夹下
npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"

3.安装淘宝镜像

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

4.安装webpack和vue-cli脚手架,在命令行中执行下列两个命令，进行安装。之后把D:\NodeJs\node_global;D:\NodeJs\node_modules;路径添加到环境变量PATH中。

npm install webpack -g
npm install vue-cli -g  //一定要用npm,这步用cnmp是下载不全的

5.打开命令行,在要创建vue项目的路径下(vue.cmd所在路径,例如D:\NodeJs\node_global)执行下面命令,这的等待时间可能会有点长,一旦出现任何选项,全都按enter选择默认的选项,运行成功后会在项目路径下发现新增的vue_demo文件夹,里面就是所需的vue文件

vue init webpack vue_demo   //vue_demo是要创建的vue项目名称

6.在命令行中进入到项目路径，然后执行npm install命令，安装项目需要的依赖。

npm install

7.然后执行npm run dev命令，运行项目。

npm run dev

我的小意外:在执行npm install时报错,然后将PAC切换为全局模式,然后重新执行这条命令,就这样两种模式来回切换直到不报错了.或者如果报错原因是npm版本问题,那么可以执行npm update -g进行更新,最后run就可以啦.

以上是我的安装步骤,有参考帖子,还有大神耐心讲解,所以记录下来,忘记时可以看看,要记得将vue_demo文件进行备份哦!