搭建vue2.0开发环境及手动安装vue-devtools工具

安装vue脚手架

1.安装node.js，如果安装成功输入 node -v ,查看node版本号，输入npm -v查看npm版本

https://nodejs.org/en/

2.注册淘宝镜像，定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm

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

3.安装vue的脚手架vue-cli，安装完后，输入vue查看是否有提示信息

cnpm install --global vue-cli

4.使用脚手架新建一个vue项目

首先，切盘到D盘，命令 D:

然后，切换到自己的文件夹下

输入：vue init webpack vue-project-test

回车，vue-project-test是我自己的文件夹的名字，是基于webpack的项目，输入之后就一直回车

5.安装依赖，然后运行

安装vue-devtools工具

1.在官网下载源码：https://github.com/vuejs/vue-devtools

2.安装yarn，查看版本：yarn --version

npm install -g yarn

3.安装yarn淘宝镜像

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

yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g

4.进入下载的vue-devtools源码文件夹下，运行

yarn install
yarn run build

5.依赖安装及编译完成后加载到谷歌浏览器

vue-devtools/packages/shell-chrome/

编译好的资源已上传(都可以直接加载到谷歌浏览器)

由于csdn下载没法设置为免费，这里贴出百度网盘的连接：

链接: https://pan.baidu.com/s/12v5BurFe-CRsXMbpR-egSA

提取码: xmb6

没有使用谷歌浏览器打包的vue-devtools：

https://download.csdn.net/download/InternetJava/12190927

使用谷歌浏览器打包的vue-devtools：

https://download.csdn.net/download/InternetJava/12190919

参考：https://www.jianshu.com/p/0c6678671635