如何在babel插件模块解析器中使用root选项？

pxq42qpu 于 2022-12-08 发布在 Babel

关注(0)|答案(2)|浏览(244)

我尝试在一个react-native应用中使用babel-plugin-module-resolver。当我在babel.config.js中使用这样的插件配置时，它工作得很好。

plugins: [
    [
      'module-resolver',
      {
        extensions: ['.ios.js', '.android.js', '.js', '.json'],
        alias: {
          utils: './src/utils',
        },
      },
    ],
  ],

但问题是我必须在每个别名路径中写入./src。所以我尝试使用root选项。

plugins: [
    [
      'module-resolver',
      {
        root: './src', // I also tried ['./src']
        extensions: ['.ios.js', '.android.js', '.js', '.json'],
        alias: {
          utils: 'utils', // already tried '/utils' and './utils'
        },
      },
    ],
  ],

但这对我不起作用，我得到这个错误：

error: Error: Unable to resolve module '../../../utils/Themes' from 'src/components/shared/Container.js':

那么使用root选项的正确方法是什么呢？

babeljs

来源：https://stackoverflow.com/questions/64726845/how-to-use-root-option-in-babel-plugin-module-resolver

2条答案

按热度按时间

e4eetjau1#

嗯，我找到了一个解决方案，它并没有真正解决问题，但使它工作。
我用 typescript 和巴别来编译它。
我的文件结构是这样的：

|-dist
|-src
  |-db
     |-connect
        |-index.ts
  |-index.ts
|-.babelrc
|-etc...

当Babel编译我的代码时，在src/index.ts中导入db/connect，从这个开始：

import ... from "db/connect"

更改为：

var _connect = require("../db/connect");

应该是这样的：

var _connect = require("./db/connect");

你可以看到，babel支持一个文件夹，无论我怎么尝试，这仍然缺少所需的路径。
因此，要解决此问题，我只需将/dist添加到.babelrc中的路径
之前：

[
   "module-resolver",
      {
         "root": ["./"], # or ["src"] or "src" or ["./src"] or "./src" or any way you can imagine
         "alias": {
            "db": "./db",
         }
      }
   }
]

之后：

[
   "module-resolver",
      {
         "alias": {
            "db": "./dist/db",
         }
      }
   }
]

正如你所说，root不影响require路径，所以我只是删除了它。
这并不能解决问题，但能让它发挥作用。
希望对你有帮助，祝你好运

赞(0）回复(0）举报 2022-12-08

qzwqbdag2#

签入文件bable.config.js并删除插件模块-resolver，root它对我有帮助

赞(0）回复(0）举报 2022-12-08

我来回答

如何在babel插件模块解析器中使用root选项？

2条答案

相关问题

热门标签

最新问答