文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

VScode中配置JavaScript编译环境的方法

2024-04-02 19:55

关注

01. 起因

由于不是经常写前端JS代码,不想单独安装一个IDE,如WebStorm等,就在VSCODE中配置一个可以运行JS代码的环境吧!

这样使用VSCode即可以写前端代码,也可以写C++代码,还可以写Python代码,真不错!!!

02. 下载安装VSCODE

下载地址:https://code.visualstudio.com/

至于安装就不啰嗦了,根据提示安装即可

03. 方式一:使用Node.js做为解释器运行JS代码

Node.js的安装和配置

Node.js的下载:

Node.js官网下载地址:https://nodejs.org/en/download/

通过上面的链接下载Node.js无脑安装:除了需要修改安装路径,其他都是下一步,环境变量也会自动配置

测试nodejs是否安装成功:

cmd下输入:node -v,查看是否能够正常打印出版本号cmd下输入:npm -v,查看是否能够正常打印出版本号注:安装node之后会自带npm

配置Node.js:需要配置两个地方

通过npm安装的包的存储位置(路径):配置文件中的 nodejs prefixnode缓存位置(路径):配置文件中的 cache(缓存)路径

nodejs安装好之后,通过npm下载全局模块默认安装到:C:\Users\username\AppData\Roaming\npm下,一般我们不想把东西存到C盘里面的,我们进行如下设置,把通过npm安装的文件依赖全部都放到我们自己想放的地方,便于管理

1、在nodejs安装路径下,新建node_global和node_cache两个文件夹

2、设置node_global和node_cache

设置缓存文件夹

npm config set cache "E:\NodeJs\node_cache"

设置通过npm安装的包的存放路径

npm config set prefix "E:\NodeJs\node_global"

注意:设置成功后,之后用命令npm install XXX -g(全局安装),安装以后模块就在E:\NodeJs\node_global

更多关于Node.js的配置参考这篇博文:https://blog.csdn.net/weixin_45583303/article/details/111354653

在VSCODE中配置Node.js

建立一个文件夹(如:demo),在文件夹中建立一个js文件(如demo.js),使用VSCODE打开该文件夹,然后按下图操作:

编写好JS文件之后,按F5就能直接在控制台查看运行结果了

04. 方式二:使用VSCODE插件Code Runner运行JS代码

安装插件

打开VSCODE:

使用

安装了 Code Runer之后,重启VSCODE,选中要运行的JS文件右键选择 Run Code 运行代码,就可以在控制台查看运行结果了。

到此这篇关于VSCODE中配置JavaScript编译环境的文章就介绍到这了,更多相关vscode 配置js编译环境内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     807人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     351人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     314人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     433人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     221人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯