Thanks to the original author: https://www.cnblogs.com/alice-fee/p/8038367.html
Setup 1: to be normally open chrome shop, search vuejs devtools installation. chrome: // extensions / developer tools - enabled extensions;
Installation Method 2 (recommended): GitHub download plug-ins, npm package install dependencies, dragged browser extensions
To do:
1. Download the chrome extension.
On github download and unzip the archive to a local, github Download: https://github.com/vuejs/vue-devtools
2. npm install
After the download is complete, open a command line cmd into the vue-devtools-master folder,
1. npm install, installation dependencies; If the installation is too slow, please refer to the article at the end of the instructions.
2. npm run build
npm run build executed, will shells src file in chrome> js file folder produces several illustrated above;
If the implementation of the above command error, can not load background script "build / background.js", as shown below:
3. Open the shells> chrome> manifest.json and put json file in the "persistent": false into true
4. Extended chrome plugin
1. Open chrome browser, open the More Tools> Extensions;
2. Then click Load unpacked extensions, and then the shells> chrome folder into
5, the test installation was successful
在插件的目录下执行npm run dev,这个时候我们的插件就可以运行了,打开localhost:8080可以看到插件已经安装并运行了。
方法3: 下载chrome插件安装包(.crx文件)离线安装(版本较低不推荐)
下载地址:http://www.cnplugins.com/devtool/vuejs-devtools/download.html
安装方法:http://www.cnplugins.com/tools/how-to-setup-crx.html
在chrome中新开一个TAB,输入:chrome://extensions/ 回车,打开应用管理器,可以看到之前安装的其他应用。将下载后的.crx文件,拖入即可安装。
另附:
1. 建议使用npm淘宝镜像安装依赖包地址:http://npm.taobao.org/
命令行安装npm淘宝镜像:
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
之后我们就可以使用cnpm代替npm安装依赖包了
2. chrome插件网地址 http://www.cnplugins.com/, 有需要别的插件的可类似以上操作。