Visual Studio Code vs Code, a modern lightweight code editor that is free and open to Microsoft, supports almost all of the major development language syntax highlighting, custom hotkeys, code snippets, brace matching, and more, as well as plug-in extensions. and optimized for Web development and cloud application development. Here's a quick introduction to the configuration of the JavaScript development environment in VS code.
First on the Microsoft official website download installs the Good vs code and opens, installs the plug-in in the expansion store, directly ctrl+shift+x opens the extension store, searches the search box the code runner and debugger for chrome two plug-ins, other plug-ins can install freely, As shown below:
Next we create an HTML file, add the JS method to the file, the content is as follows:
1 <html>
2 <body>
3 <script>
4 alert("Hello World");
5 </script>
6 </body>
7 </html>
Compile and run the finished HTML document, press F5 to have a popup box to indicate what environment we use, choose the chrome Environment, After selecting the compiler will create a. vscode folder in the same directory as the current HTML file, with only one Launch.json configuration file in the compiler, and the file contents configured as follows:
1 {
2 "version": "0.2.0",
3 "configurations": [
4
5 {
6 "type": "chrome",
7 "request": "launch",
8 "name": "Launch Chrome against localhost",
9 "url": "file:///F:/JavaScript/Demo/alax005.html",
10 "program": "${workspaceFolder}"
11 }
12 ]
13 }
Note: (1). Type is chrome, which means you can only open Chrome browser when compiling and running HTML file, if you want to change to another browser, you need to install the corresponding plugin, and change the type to the corresponding browser name;
(2). The URL is the file path where the HTML file is to be executed, indicating that the alax005.html file to be executed is in the demo folder in the F-drive JavaScript folder, and the URL path should correspond to the path of the file to be compiled to run;
(3). For example, create a new alax006.html file, compile the runtime should advance the file path in the Launch.json file, and press the F5 key to run the debug console below the compiler will output the corresponding running results, but also in the Chrome browser display.
Configuration of the JavaScript development environment in Visual Studio code