创建支持es6，vscode可调试的nodejs es6工程

最新推荐文章于 2024-09-13 20:44:55 发布

萧洛

最新推荐文章于 2024-09-13 20:44:55 发布

阅读量2k

点赞数

文章标签： nodejs es6 vscode express

本文链接：https://blog.csdn.net/jxbinwd/article/details/83651547

版权

通常vscode调试es6工程时，比如有import语句，会有如下错误：
SyntaxError: Unexpected token import

网上有很多例子都是不可行的，或者是老版本的vscode或nodejs es6工程。

现在举例说明如何创建支持es6并且vscode可调试的nodejs工程：

(以windows为例)

1. 打开控制台（建议以管理员方式打开，否则npm install可能会失败），按顺序执行以下命令

md prj-es6 //创建文件夹

cd prj-es6 //进入文件夹

express --view=ejs //创建一个express工程，需先安装express-generator。（npm install -g express-generator，全局安装）

npm install //安装express工程依赖

npm install --save-dev babel-cli babel-preset-es2015 //es6语法支持需安装这两模块

2. 在prj-es6文件夹中是添加.babelrc文件

用vscode打开prj-es6文件夹，使用vscode添加.babelrc文件。（windows下是无法直接添加）

.babelrc 文件内容：

{
    "presets": [
    "es2015"
    ],
    "sourceMaps": true,
    "retainLines": true
}

3. 修改launch.json内容

打开vscode菜单： “调试”--“打开配置”。

修改后：

{
    // 使用 IntelliSense 了解相关属性。 
    // 悬停以查看现有属性的描述。
    // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "启动程序",
            "program": "${workspaceFolder}\\bin\\www",
            "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/babel-node"
        }
    ]
}

这样就完成了，可以在www或app.js中增加一条import语句，启动调试验证。

参考：https://www.jianshu.com/p/959aa9814345