Question

我有一个使用scss和css-modules的文件，如：

import styles from './Login.scss';

webpack构建工作正常，但我遇到了流量错误：Required Module Not Found

在我的.flowconfig中我有

[ignore]
.*/node_modules/fbjs/.*
.*/app/main.js
.*/app/dist/.*
.*/release/.*
.*/git/.*

[include]

[libs]

[options]
esproposal.class_static_fields=enable
esproposal.class_instance_fields=enable
esproposal.export_star_as=enable
module.name_mapper.extension='css' -> '<PROJECT_ROOT>/flow/CSSModule.js.flow'
module.name_mapper.extension='styl' -> '<PROJECT_ROOT>/flow/CSSModule.js.flow'
module.name_mapper.extension='png' -> '<PROJECT_ROOT>/flow/WebpackAsset.js.flow'
module.name_mapper.extension='jpg' -> '<PROJECT_ROOT>/flow/WebpackAsset.js.flow'
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue

我也看过https://github.com/facebook/flow/issues/338，但它确实没有任何解决方案。

是否有人为此问题找到了解决方法？

Answer 1

此错误的更好解决方案是使用css-modules-flow-types webpack插件为CSS模块生成流类型。

Flow不知道scss扩展程序，因此您需要在.flowconfig部分的[options]添加以下内容：

; Extensions
module.file_ext=.js
module.file_ext=.jsx
module.file_ext=.json
module.file_ext=.css
module.file_ext=.scss

您还应该将*.scss.flow添加到.gitignore。这些文件不应该被签入，因为它们是在webpack构建期间自动生成的。

Answer 2

可以通过将.scss文件分配给空模块来修复此错误。我只是将npm安装为空并将其添加到.flowconfig： module.name_mapper.extension='scss' -> 'empty/object'

Answer 3

我们可以使用module.name_mapper.extension来替换Object上导入模块的类型

module.name_mapper.extension-指定要匹配的文件扩展名和替换模块名称，用->分隔。

向.flowconfig文件添加选项

// .flowconfig
[options]
module.name_mapper.extension='scss' -> '<PROJECT_ROOT>/flowconfig.mock-module.js'

创建新文件

// flowconfig.mock-module.js
export default Object;

Answer 4

在.flowconfig文件中添加了我想要流识别的所有文件类型

[options]    
module.file_ext=.js
module.file_ext=.json
module.file_ext=.jsx
module.file_ext=.css
module.file_ext=.scss

使用.scss文件找不到流模块

4 个答案: