如何在 eslintrc 文件中使用 import？答案

【问题标题】：How to use import inside eslintrc file?如何在 eslintrc 文件中使用 import？
【发布时间】：2019-10-07 03:23:04
【问题描述】：

我正在尝试使用导入的对象为 .eslintrc.js 文件中的全局变量设置一些限制，但导入不起作用。如何进行动态 eslint 配置？

import {loadedGlobals} from '@/util/globals'                      

module.exports = {
    'globals': Object.keys(loadedGlobals).reduce((acum, key) => {
        acum[key] = false
        return acum
    }, acum),
    // ...
}

【问题讨论】：

标签： javascript eslint

【解决方案1】：

如何在 eslintrc 文件中使用 import？

ESLint 目前不支持名为 eslintrc 的配置文件，所以我假设您的意思是 .eslintrc.js。

ESLint 目前不支持 ES 模块，您可以从其 configuration file formats 文档中的 JavaScript (ESM) 项目符号项中看到。

如果您愿意在这里安装另一个依赖项，您可以在 .eslintrc.js 中使用 import：

安装esm模块npm i esm -D（这里我选择devDependency）。
创建一个新文件作为.eslintrc.js 的同级文件，名为.eslintrc.esm.js。
.eslintrc.esm.js 内部包含您的 ESLint 配置。在这里你可以使用import，你应该将你的配置导出为export default { // Your config }。
在.eslintrc.js 内包含以下代码：

const _require = require('esm')(module)
module.exports = _require('./.eslintrc.esm').default

现在您应该可以像往常一样运行eslint。额外文件有点笨拙，但如果您愿意，可以将它们组织在一个目录中，并使用eslint 的--config 选项指向新位置。

【讨论】：

【解决方案2】：

您可能会注意到在导出对象时使用的是旧语法。您可以尝试使用 require() 而不是 import。

或者，您可以查看Shareable Configs。

【讨论】：