vscode本地编译

ゝ一世哀愁。 2023-03-04 06:38 5阅读 0赞

方法一: 在 js 后缀文件中写 javascript 代码.  
注意文件位置，最好不要同时打开 多个项目

1.  环境配置:

(1). 需要安装 nodejs （ node -v 和 npm -v 检验是否安装成功)

(2). 安装 Code Runner 扩展包

1.  新建一个 js 后缀的文件,如test.js

console.log("hello world");
    console.log("2314");

1.  运行程序

(1) 如果你安装了 Code Runer,那么就可以直接点击右键选择 Run Code 运行代码,就可以在 OUTPUT 窗口上看到运行结果

！！！！！这一步至关重要，其他方法也行不通可能就是因为这一步没有设置：如果显示乱码：  
控制面板–》更改日期、时间或数字格式–》管理–》更改系统区域设置 --？》勾选Beta版![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg_size_16_color_FFFFFF_t_70]![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg_size_16_color_FFFFFF_t_70 1]

(2) 在 vscode 的 TERMINAL 终端输入: node test.js 也可以看到 运行结果  
注意：这里打开的文件 位置要对

(3) 想要按下 F5 进行运行并且调试,那么就要配置好 launch.json 文件. 先点击 Run -> Open Configurations, 输入以下内容

{ 
        // Use IntelliSense to learn about possible attributes.
        // Hover to view descriptions of existing attributes.
        // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
        "version": "0.2.0",
    
        "configurations": [
            
            
            { 
            "name": "Launch",
            "type": "node",
            "request": "launch",
            "program": "${workspaceRoot}/test.js",
            //vscode打开的 是test文件夹， workspaceRoot代表当前文件夹
            },
        ]
    }

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg_size_16_color_FFFFFF_t_70 2]

这里没有成功的话，可以 尝试：（此前已经设置好了）  
Run Code运行不了：  
1、打开 “File”->“Preferences”->“Setting”

2、打开"Extensions" ,点击打开Run code configuration，设置"Default Language"  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg_size_16_color_FFFFFF_t_70 3]  
1、打开 “File”->“Preferences”->“Setting”  
2.搜索debug—》勾选Allow Breakpoints Everywhere  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg_size_16_color_FFFFFF_t_70 4]

法二：在 html 后缀文件中写 javascript 代码.（没有调试成功）  
参考链接：[https://www.cnblogs.com/ttweixiao-IT-program/p/13048275.html][https_www.cnblogs.com_ttweixiao-IT-program_p_13048275.html]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200801171603126.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg_size_16_color_FFFFFF_t_70 1]: /images/20230208/e0fdd81b872549e0a6cfaa8e2bcca2f5.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg_size_16_color_FFFFFF_t_70 2]: /images/20230208/6adcb5cf68d14a0ea12435bf10ed9142.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg_size_16_color_FFFFFF_t_70 3]: /images/20230208/efef6cdf7ed543828d2337b8a1192a69.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjEwMDQwNg_size_16_color_FFFFFF_t_70 4]: /images/20230208/b725235b2c8f43498f2970b7d1e42f76.png
[https_www.cnblogs.com_ttweixiao-IT-program_p_13048275.html]: https://www.cnblogs.com/ttweixiao-IT-program/p/13048275.html