Solution: 1. Open vscode and click on the extension function; 2. Search and install the Vetur plug-in in the opened window; 3. In the top menu, click "File" - "Preferences" - " Settings"-"User"-"Text Editor", find and edit the "setting.json" file; 4. Find "files.associations" in the configuration file, add the corresponding code in it, and save the file; 5. Restart vscode. Can.
The operating environment of this tutorial: windows7 system, vue3&&Visual Studio Code version 1.74.0, DELL G3 computer.
1. Install the Vetur plug-in in the editor
1.1. Open the vs code editor, and then click on the extended function on the left, as shown below
1.2. Enter in the extended function window Vetur, select Install from the searched plug-in, as shown below
1.3. After successful installation, as shown below Picture:
##2. Configure relevant information in the editor
2.1. Open VScode editor, top menu:[File]->Preferences->Settings
English version:File-> Preferences-> Settings
2.2、user -> Text editor , drop down to find and edit in setting.json
English version: Chinese version: 2.3. Find files.associations in the configuration, add the corresponding code in it, and save English version: on the right Enter the code in the red box Chinese version: 2.4. Close vs code and reopen it, the code It will be highlighted, as shown below [Related recommendations:vuejs video tutorial, web front-end development]
The above is the detailed content of What should I do if there is no syntax highlighting when writing vue in vscode?. For more information, please follow other related articles on the PHP Chinese website!