React：Flow：导入本地 js 文件 - 无法解决问题模块

Question

我正在使用 Flow: Static type checking library 作为反应前端应用程序，它抛出 "cannot resolve" 用于从 src 目录的内部导入：

Example in file at path: src/abc/def/ghi/hello.jsx, I am using the following import:
import words from '../words';

--> Throws error "Cannot resolve module ../words

words.js is in src/abc/def dir

已编辑： 安装 flow-typed 后，我的 .flowconfig 看起来像这样：

[ignore]
.*/node_modules/.*
.*/build/.*
.*/dist/.*


[include]
.*/src/.*
.*/test/.*

[libs]
flow-typed

[lints]

[options]
all=true
module.system.node.resolve_dirname=node_modules
module.system.node.resolve_dirname=src

[strict]

如何在 .flowconfig 文件中为此类导入映射流？

提前致谢。

Answer 1

要从 ./hello.jsx 转到 ./def，您必须进入另一个目录

从“../../words”导入单词；

Answer 2

成功了。

相对路径并不真正适用于 Flow。

我们需要从项目根映射导入以便 Flow 理解。

我将导入更改为

import words from 'def/words';

将以下内容添加到您的 .flowconfig 文件

module.name_mapper='^def\(.*\)$' -> '<PROJECT_ROOT>/src/abc/def/'

修复了以上错误。

Answer 3

/path/to/project/node_modules/.bin/flow stop
/path/to/project/yarn run flow (or your flow invoking script)

这解决了我的问题。

Answer 4

在我的例子中，问题是我在 webpack 中使用了相对路径，例如

resolve: {
    modules: [
         path.resolve(__dirname, 'src'),
         ...
    ]
}

所以，我可以像这样从 src 导入我的自定义模块（不写 src/）

import CustomModule from 'pages/CustomModule'

但是 flow 现在没有关于那个 webpack 配置的信息，所以我必须在我的 .flowconfig 文件中添加下一个代码

[options]
module.name_mapper='src' -> '<PROJECT_ROOT>/src'

更多信息

about flow options

about name_mapper

React：Flow：导入本地 js 文件 - 无法解决问题模块

React: Flow: Import a local js file - cannot resolve issue module

javascript

reactjs

react-native

flowtype

flow-typed