有没有办法在vscode中打开ES6 / ES7语法支持？

103

编辑3：从0.4.0版开始，可以通过将jsconfig.json文件添加到项目文件夹中来打开ES6语法，其中包含以下内容：

{
    "compilerOptions": {
        "target": "ES6"
    }
}

编辑2：您可以在用户语音中对此功能进行投票

有没有办法在Visual Studio Code中“打开” ES6 / ES7？

屏幕截图

编辑1

尝试了@sarvesh的建议- javascript.validate.target推翻并重新启动vscode。没帮助

visual-studio-code

— 杰里米·丹尤
source

3

您介意将其作为答案而不是对问题进行编辑吗？

— Jeroen Vannevel 2015年

28

当前，使用ES6和ES7功能的唯一方法是使用Typescript。

另一方面，您可以在此处看到ES6和ES7的功能请求

— 电视台
source

1

更新：看起来ES6将开始提供2015年7月- visualstudio.uservoice.com/forums/293070-visual-studio-code/...

— ToddSmithSalter

好像还不错尽管如此，总体上还是有工作要做。

— mzdv 2015年

2

我使用的是最新版本，但是0.8.0我仍然看到胖箭头功能的错误着色...为什么？

— vanthome 2015年

@vanthome，您需要指示要使用es6编写的文件数组，请检查链接：code.visualstudio.com/Docs/languages/javascript

— TlonXP，2015年

@TionXP您是说用jsconfig.json什么方法？好吧，我没有尝试过，但是如果我在全球范围内启用它，我希望它能起作用。我不想逐个告诉VSCode我要使用ES6。

— vanthome

58

这很简单，在项目的根目录下创建一个jsconfig.json文件，并在其中写入该对象：

{
    "compilerOptions": {
        "target": "ES6",
        "module": "commonjs"
    }
}

— 奥利夫
source

效果很好，谢谢！显然，他们在今年夏天将其包含在了vscode中：blogs.msdn.com/b/vscode/archive/2015/07/06/vs-code-es6.aspx因此，以上答案不再正确。

— 汤姆（Tom）

9

"experimentalDecorators": true为es7装饰添加

— Meirion Hughes，

导入ES6呢？调试/断点可以工作吗？似乎不配合"module": "es2015"。

— arve0

这不为我工作，我有这个家伙的问题stackoverflow.com/questions/35110019/...

— 插孔空白

43

该链接很有帮助。将jsconfig.json文件添加到项目中并没有太大帮助，或者这不是最佳解决方案。转到文件>首选项>设置。在settings.json文件中添加以下行：

"jshint.options": { "esversion": 6 }

— 阿霍拉
source

5

除了上述答案...

根据VS Code文件。

确保将jsconfig.json放在 JavaScript项目的根目录中，而不仅仅是在工作区的根目录中。以下是一个jsconfig.json文件，该文件将JavaScript目标定义为ES6，exclude属性排除了node_modules文件夹。

{
    "compilerOptions": {
        "target": "ES6"
    },
    "exclude": [
        "node_modules"
    ]
}

这是带有显式文件属性的示例。

{
    "compilerOptions": {
        "target": "ES6"
    },
    "files": [
        "src/app.js"
    ]
}

files属性不能与exclude属性一起使用。如果两者都指定，则files属性具有优先权。

也尝试在tsconfig.json中编辑“ target”属性

{
  "compilerOptions": {
    "target": "es5",//es6
    "module": "system",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "node_modules",
    "typings/main",
    "typings/main.d.ts"
  ]
}

— 伊格纳修斯·安德鲁（Ignatius Andrew）
source

这是什么意思：“在JavaScript项目的根部而不是在工作空间的根部”？

— Jared Christensen

为什么不能对代码进行拾取.babelrc等？为什么所有重复的配置？grumbl

— Stijn de Witt

1

否则，您可以使用ESLint突出显示ES7错误（使用babel解析器或其他）：VSCode Linter ES6 ES7 Babel linter

— 达米安·勒鲁（Damien Leroux）
source

0

另外，您可以使用Flow代替Typescript，这更易于设置和迁移。我写了一篇关于如何使用VS Code设置Flow的小文章。

— 彼得·佩勒
source

0

截至目前，根据VSCode Marketplace上的ESLint文档，在项目根目录中包含.eslintrc配置文件可在ESLint VSCode扩展名中启用ES6插入。

我的.eslintrc配置文件如下所示：

extends:
  - standard
parser: babel-eslint
rules:
  object-curly-spacing: [ error, always ]
  react/prop-types: off
  space-before-function-paren: off

我已经通过npm在node_modules中安装了eslint，我所知道的是，在项目根文件夹ES6中使用.eslintrc时，linting可以工作，没有它，它就不能工作。

希望这可以帮助...

— 范·阿尔伯特
source