Original link: blog.csdn.net/sinat_34849…

Problem 1.

Download vue-devtool (5.3.4), download zip (5.3.4), and run the command.

npm i
npm run build
Copy the code

2. Solve

1) Update nodeJS

You are advised to install NVM (NodeJS version management tool) and download the latest LTS version (long-term support version). In case of installation failure, refer to the documentation: NVM failed to install NodeJS

 npm config set registry http://registry.npm.taobao.org/
Copy the code

2) Webpack installation failure

The official Webpack documentation says :”… Use the latest long term support version of Node.js…” ; Open/project root directory /packages/shell-chrome/package.json, copy the configuration in the red box to/project root directory /package.json, and run NPM I

If you encounter installation failure, you can refer to another note: Webpack webpack- CLI

3) Other (template) issues

Other problems are template problems, there are many kinds of error, not a description and screenshots, directly say the solution: 1. Json and add the following configuration to the “devDependencies” field. After the replication is complete, the terminal executes NPM I

"devDependencies": {..."@vue/compiler-sfc": "^ 3.0.8"."css-loader": "^ 4.3.0"."file-loader": "^ 6.1.0"."postcss-loader": "^ 3.0.0"."style-resources-loader": "^ 1.2.1." "."stylus": "^ 0.54.7"."stylus-loader": "^ 3.0.1." "."url-loader": "^ 4.1.0." "."vue-loader": "^ 15.7.1"."vue-style-loader": "^ 4.1.0." "."vue-template-compiler": "^ 2.6.10"."buble": "^ 0.19.0"."buble-loader": "^ 0.5.1"
}
Copy the code

2. Open/project root directory /packages/shell-chrome/package.json

There are four plug-ins that failed to be installed using the NPM command because remote does not exist. Careful little partners can find, this is not the four files in packages? !

Create a new folder in the project root directory /node_modules named @vue-devtools and copy the four files to the new folderOnce the copy is complete, look at the package.json files in the four folders. After deleting the code in the “dependencies” field, execute NPM I in the corresponding directory, as shown in the following figure.

3. After the above operation is completed, NPM run build can be used to obtain the result:

3. Complete the Chrome extension

1. Open Chrome and go to more tools -> Extensions

2. Manually load the decompressed extension in the project root directory/Packages /shell-chrome 3. Installation is successful.