Trouble installing the vue debugging tool

Recently, in the process of learning Vue.js, the author encountered a very difficult problem: it is very troublesome to install the debugging tools of Vue.js. Here I will share the problems encountered and solutions.

In my development environment, I use Visual Studio Code and Git Bash. First, I installed the debugging tools for Vue.js according to the command provided by the official Vue.js documentation:

npm install -g @vue/devtools

Then, I ran the following command in Git Bash:

vue-devtools

However, I got I got the following error message:

bash: vue-devtools: command not found

It looks like the debugging tools I installed are not working properly. So I checked the installation directory of the npm module and found that the installed module was not in the PATH environment variable. Use the following command to add the PATH environment variable:

export PATH=$PATH:/c/Users/username/AppData/Roaming/npm

Here/c/Users/username/AppData/Roaming/npm is the installation path of the Vue.js debugging tool, according to your actual situation Just change it. After adding the environment variable, I ran the vue-devtools command again and found another error:

Starting inspector on 127.0.0.1:9229 failed: address already in use

The reason for this error is that there is already an application on my computer. Port 9229. So, I looked for the program occupying port 9229 and terminated it manually. Run the vue-devtools command again and find that the debugging tool is finally started successfully.

To summarize:

1. Installing the debugging tools of Vue.js requires npm installation.
2. After the installation is complete, you need to manually add the directory where the debugging tool is located to the PATH environment variable.
3. If the error Starting inspector on 127.0.0.1:9229 failed: address already in use occurs, you need to find the program occupying port 9229 and terminate it manually.

In the author's use, installing the Vue.js debugging tool actually takes a long time and compilation process, and also requires some manual control. Therefore, it is recommended to check your own computer environment before installation. , network and disk storage are optimized to improve the installation success rate. At the same time, you can also use other debugging tools, such as VS Code plug-ins, to achieve similar functions. In general, the Vue.js debugging tool may be more troublesome to install, but it is still very convenient to use and can make our development more efficient.

The above is the detailed content of Trouble installing the vue debugging tool. For more information, please follow other related articles on the PHP Chinese website!