Once used Angularjs, Reactjs developed projects, and now want to learn to learn Vuejs to develop. It's called 工欲善其事 its prerequisite. Now we're going to laian the chrome Vuejs devtools plugin.
Installation Method 1: You need to open the Chrome store normally, search Vuejs devtools installation. chrome://extensions/Developer Tools-Extender enabled;
Method 2:github Download Plug-ins, NPM package installation dependencies, drag into the browser extender (recommended)
Specific actions:
1. Download the chrome extensions.
Download and extract the compressed package to the local GitHub, GitHub the address: HTTPS://GITHUB.COM/VUEJS/VUE-DEVTOOLS2. NPM Install
When the download is complete, open the command line cmd into the Vue-devtools folder,
1. NPM Install, install the dependency pack; If the installation is too slow, follow the instructions at the end of the article.
2. NPM Run Build
After the NPM run build executes, it will produce a few JS files in the SRC folder under Shells>chrome as shown above;
The background script "Build/background.js" cannot be loaded if the above command is not executed.
3. Open Shells>chrome>manifest.json and change the "persistent" in the JSON file: false to True
4. Extended Chrome Plugin
1. Open Chrome Browser, open more Tools > extender;
2. Click to load the unpacked extender, and then put the Shells>chrome folder into
5, the test installation was successful
In the plugin directory to perform npm run Dev, this time our plug-ins can be run, open localhost:8080 can see the plug-in has been installed and run.
Method 3: Download the Chrome plugin installation package (. crx file) offline installation (lower version not recommended)
Download Address: http://www.cnplugins.com/devtool/vuejs-devtools/download.html
Installation method: Http://www.cnplugins.com/tools/how-to-setup-crx.html
Open a new tab in Chrome, enter: chrome://extensions/carriage return, open Application Manager, you can see the other applications installed before. The. crx file will be downloaded and dragged in to install.
Also attached:
1. Recommended use of NPM Taobao mirrored installation of the dependency package address: http://npm.taobao.org/
The command line installs NPM Taobao Mirror:
$ NPM install-g cnpm--registry=https://registry.npm.taobao.org
Then we can use CNPM instead of NPM to install the dependency pack.
2. Chrome plug-in network address http://www.cnplugins.com/, there is a need for other plug-ins can be similar to the above operation.