搭建 vue 开发环境: node.js安装+vue脚手架

第一次搭建vue操作环境，报了不少错，没搭建成功，然后这样一步步来终于好了，将步骤简单记录下来：

第一步：下载下载node 安装包进行安装，下载地址：：https://nodejs.org/en/ 或者 http://nodejs.cn/

第二步：点击node安装包开始安装，安装目录自己定义（我的在D盘）。

安装测试

HOME+R  输入cmd打开命令行窗口  进入安装路径 输入node -v

第三步：

1、在安装路径下的文件夹里面，新建node_global和node_cache两个文件夹

2、在建好上面两个文件夹后，在黑窗口执行下面两个命令：

     设置缓存文件夹

     npm config set cache "D:\node\node_cache"
　 设置全局模块存放路径

     npm config set prefix "D:\node\node_global"
     作用：设置成功后，之后用命令npm install XXX -g安装以后模块就在D:\node\node_global里

第四步：基于 Node.js 安装cnpm（淘宝镜像）

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

第五步：设置环境变量

1：新建：NODE-HOME

2：配置编辑path

打开命令行，输入node -v，安装环境变量后，输入cnpm -v 如下，都出现版本号说明配置成功

第六步：安装Vue

cnpm install vue -g

第七步：安装vue命令行工具，即vue-cli 脚手架

cnpm install vue-cli -g

第八步：新项目的创建

1.打开存放项目的文件夹

打开开始菜单，输入 CMD，或使用快捷键 win+R，输入 CMD，敲回车，弹出命令提示符。打开你将要新建的项目目录

2.根据模版创建新项目

vue init webpack demo1

接个简单的图：

第九步：启动  执行 npm run dev  或者   npm run dev

这里是最后一个坑：npm run dev 时报错 ，package.json找不到

npm ERR! path F:\vueTest\package.json

npm ERR! code ENOENT

npm ERR! errno -4058

npm ERR! syscall open

npm ERR! enoent ENOENT: no such file or directory, open 'F:\vueTest\package.json'

npm ERR! enoent This is related to npm not being able to find a file. n
其实是没进入到文件目录里，一定是进到文件的目录中再去npm run dev 就不会报错了！ 再下面图片这个地方进行项目启动！！！

 

这样才会成功：

成功页面：