如何解决：使用 yarn 工作区在反应原生中"Unable to resolve module..."？

Question

我使用的是react native with yarn工作区。一切正常，但我无法让别名正常工作。当我尝试使用：

import { useTailwind } from 'tailwind'

我得到错误：

Error: Unable to resolve module ../../../src/theme/useTailwind.tsx from /Users/.../packages/mobile-app/src/App.tsx

我的文件夹结构如下：

- root
- packages
- mobile-app
- src
- App.tsx
- theme
- useTailwind.tsx

我的metro.config.js看起来像这样：

const path = require('path')
module.exports = {
projectRoot: path.resolve(__dirname, '../../'),
transformer: {
getTransformOptions: async () => ({
transform: {
experimentalImportSupport: false,
inlineRequires: false, // default true
},
}),
},
};

我在babel.config.js中配置别名如下：

module.exports = {
presets: ['module:metro-react-native-babel-preset'],
plugins: [
[
"module-resolver",
{
"root": [
"./src"
],
"alias": {
"tailwind": "./src/theme/useTailwind.tsx",
}
}
]
]
};

我试着用yarn start --reset-cache运行metro bundler，但它不起作用。我需要更改什么才能使别名正常工作？

Answer 1

适用于所有有相同问题的人。我能够通过如下更改路径来解决问题：

"alias": {
"tailwind": "./packages/mobile-app/src/theme/useTailwind.tsx",
}