Eslint - 脚本和模块的 SourceType 混合答案

【问题标题】：Eslint - SourceType mixture of script and moduleEslint - 脚本和模块的 SourceType 混合
【发布时间】：2016-07-21 22:17:33
【问题描述】：

我们开始混入一些 es6 模块，当你在不使用 sourceType: 脚本时使用 import/export 时，eslint 会抱怨

Parsing error: 'import' and 'export' may appear only with 'sourceType: module'at line 1 col 1

但是，如果我将 sourceType 更改为模块，那么每个具有“use strict”的文件；在顶部被标记为在模块中不需要使用严格。

模块是我的 jsx 文件，我的 js 文件是 POJ，所以我需要两个 sourceTypes 才能运行。

关于如何强制 eslint 同时使用模块和脚本有什么想法吗？我想避免运行两个单独的 eslintrc 文件和规则集，只是为了让一个是模块，另一个是脚本。

【问题讨论】：

为什么不禁用将use strict 标记为不需要的规则？（我认为这是可能的）

标签： javascript eslint

【解决方案1】：

有一种方法可以让你的蛋糕也吃起来，让你的所有文件都使用.js 扩展名，同时消除文件的sourceTypes 的歧义。

首先，就像其他答案所建议的那样，添加替代文件扩展名的覆盖：

 { "overrides":
            [
            { "files": [ "*.js" ]
            , "excludedFiles": "*unambiguous.js"
            , "processor": "plugin-name/disambiguate" }
            ,
            { "files": [ "*.mjs" ]
            , "parserOptions":
                    { "sourceType": "module" } }
            ] }

然后神奇的事情来了：像这样制作一个超级简单的 ESLint 插件

var module_regex = /\bimport\b|\bexport\b/

module .exports =
        { processors:
                { disambiguate:
                        { preprocess: (_source_string, _file_path) => {
                                if (module_regex .test (_source_string)) {
                                        return [
                                                { text:  _source_string
                                                , filename: 'unambiguous.mjs' } ] }
                                else {
                                        return [
                                                { text: _source_string
                                                , filename: 'unambiguous.js' } ] } } } } }

通过此设置，在 ESLint 插件消除了您的 Javascript 代码的歧义后，ESLint 就可以正常理解您的 sourceType，而无需更改 .js 文件扩展名。

这非常适合 ESLint 配置/插件模型，作为插件，您甚至可以将 "overrides" 放在插件配置中，这样您的基本配置所需要做的就是包含插件，以消除歧义工作。

可能会考虑在某个时候将它放在 npm 上，希望这对某人有所帮助。

【讨论】：

【解决方案2】：

现在在 eslint 4.1.0+ 中有一个更好的方法：

module.exports = {
  overrides: [
    {
      files: [ "rollup.config.js" ],
      parserOptions: { sourceType: "module" },
    }
  ]
};

您还可以在overrides 部分中按全局更改规则或任何您想要的内容。

【讨论】：

【解决方案3】：

我已经使用选项sourceType:script 在根文件夹中创建了主文件。在文件夹中时./front 文件.eslintrc.json:

{
    "extends": "../.eslintrc.json",
    "parserOptions": {
        "sourceType": "module"
    }
}

【讨论】：

【解决方案4】：

只要你的脚本有一个扩展名而你的模块有一个不同的扩展名，那么你就可以有两种不同的配置。

// .eslintrc.json
{
    // ...
    // Your normal config goes here
    // ...
}

使用 eslint . 对您的正常脚本进行 Lint，就像您一直在做的那样。默认为sourceType: "script"，默认拉取.eslintrc.json，默认仅lints*.js文件。

// .eslintrc.modules.json
{
    "extends": "./.eslintrc.json",
    "parserOptions": {
        "sourceType": "module"
    },
    // You can have additional module-specific config here if you want
}

现在您可以使用 eslint --config .eslintrc.modules.json --ext .jsx . 仅对模块进行 lint，这将拉取模块配置，这只是普通 .eslintrc.json 的扩展，并且只会对 *.jsx 文件进行 lint。

【讨论】：