Shulou(Shulou.com)06/02 Report--

This article mainly introduces how to use vscode to open the existing vue project, has a certain reference value, friends in need can refer to. I hope you will learn a lot after reading this article. Next, let the editor take you to learn about it.

Install the plug-in

1. Installation of vetur plug-in

The plug-in is a highlighted plug-in for the basic syntax of the vue file. Enter vetur in the plug-in window and click to install the plug-in. After installation, click File-> preferences-> Settings to open the settings interface, and add configuration on the right side of the settings interface.

"emmet.syntaxProfiles": {"vue-html": "html", "vue": "html"}

2. Installation of eslint plug-in

Eslint intelligent error detection plug-in, plays an important role in specific development, can help us find errors in time. As for installation, also open the plug-in extension window, enter eslint and click to install the plug-in. After installation, you also need to configure it in the same place as the vetur plug-in.

"eslint.validate": ["javascript", "javascriptreact", "html", "vue"], "eslint.options": {"plugins": ["html"]}

The vetur and eslint plug-ins are shown in the following figure in the configuration:

Import the project and compile

1. Import the project

Download the vuestic-admin project (https://github.com/epicmaxco/vuestic-admin) from github, pull it locally, open VSCode, click on the file, open the folder, import the project, and type npm install at the console terminal to add package dependencies.

If you do not have npm installed, install npm first.

2. Run the project

Also when you finally execute npm run dev to start running the project, this command automatically runs the project on the browser, and the result is shown in the figure below, indicating that the configuration is successful.

Thank you for reading this article carefully. I hope the editor will share how to use vscode to open the content of the existing vue project. At the same time, I also hope that you can support us, pay attention to the industry information channel, and find out if you encounter problems. Detailed solutions are waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.