如何使用 babel-plugin-module-resolver 为根路径设置别名并禁用其他根导入？答案

【问题标题】：How to use babel-plugin-module-resolver to set an alias for the root path and disable other root imports?如何使用 babel-plugin-module-resolver 为根路径设置别名并禁用其他根导入？
【发布时间】：2020-09-08 23:16:46
【问题描述】：

我想做这样的导入import Foo from '~/components/Foo'

https://github.com/tleunen/babel-plugin-module-resolver

如果我将.babelrc 设置为：

{
  "plugins": [
    ["module-resolver", {
      "root": "./",
      "alias": {
        "~/": "./"
      }
    }]
  ]
}

我也尝试过（以及许多其他组合）：

{
  "plugins": [
    ["module-resolver", {
      "root": ".",
      "alias": {
        "~": "."
      }
    }]
  ]
}

然后我可以像这样在脚本中使用它：

import Foo from 'components/Foo'

如果我这样做 import Foo from '~/components/Foo' 将不起作用（我希望它会这样做）
我想强制用户必须在前面加上 ~/，这样就不会有多种使用模式。

【问题讨论】：

标签： javascript reactjs ecmascript-6 babeljs babel-plugin

【解决方案1】：

{
  "plugins": [
    ["module-resolver", {
      "root": ["./",]
      "alias": {
        "~/": "./"
      }
    }]
  ]
}

试试看

【讨论】：

请在您的回答中添加一些解释