Home > Web Front-end > H5 Tutorial > Develop Vue using vue-devtools

Develop Vue using vue-devtools

巴扎黑
Release: 2017-07-21 13:47:23
Original
2528 people have browsed it

Foreword:

Since vue is data-driven, there is nothing that can be parsed by viewing the DOM structure during development and debugging.

But with the help of the vue-devtools plug-in, we can easily parse and debug the data structure.

1. Download the chrome extension

GitHub download address:

It is recommended to use npm Taobao mirror according to the dependency package

Address:

Command line installation npm Taobao mirror:

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

#After that we can use cnpm instead of npm to follow the dependency packages. npm is indeed too slow to install dependency packages. ....

##2. cnpm install

After the download is complete, open the command line cmd and enter the vue-devtools folder, follow the dependency package and npm run build

##3. Open shells>chrome>src>manifest.json and change "persistent":false in the json file to true

4. Extend the chrome plug-in

1. Open the chrome browser, open Settings>Click or Programs>Click Developer Mode

2. Then Click to load the decompressed extension, then put the shell>chrome folder into

##Finally

Open the one written in vue Project, f12 opens the debugging tool to debug the vue project.

The above is the detailed content of Develop Vue using vue-devtools. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template