导入CSS文件时的流程“找不到所需的模块" [英] Flow “Required module not found” when importing a CSS file

问题描述

当我尝试通过webpack(import(./index.css))导入CSS时，出现此错误:

When I try to import CSS via webpack(import (./index.css)) I'm getting this error:

3: import './index.css';
          ^^^^^^^^^^^^^ ./index.css. Required module not found

我有一个类似ComponentName→(index.js，index.css)的结构，因此每个组件内部都具有所有依赖项.

I have a structure like ComponentName→(index.js, index.css), so that each component has all dependencies inside.

我尝试了此 hack，但是它对我不起作用.我能以某种方式忽略它吗?

I tried this hack but it didn't work for me. Could I just ignore it somehow?

推荐答案

将此添加到您的流配置中

Add this to your flow config

[options]
module.name_mapper.extension='css' -> '<PROJECT_ROOT>/CSSModuleStub.js'

并在根目录CSSModuleStub.js中添加创建文件:

And add create a file to your root CSSModuleStub.js:

// @flow
type CSSModule = { [key: string]: string }
const emptyCSSModule: CSSModule = {}
export default emptyCSSModule

如果您想要干净的路径，可以像这样调整

If you want clean path, you can adjust like this

[options]
module.name_mapper.extension='css' -> '<PROJECT_ROOT>/flow/stub/css-modules.js'

因此将CSSModuleStub.js重命名为flow/stub/css-modules.js.

我们正在努力，如果您需要其他存根(例如:对于url-loader)，这是另一个示例

While we are at it, if you need some others stubs (eg: for url-loader) here is another example

创建flow/stub/url-loader.js

// @flow
const s: string = ""
export default s

然后添加

module.name_mapper='.*\.\(svg\|png\|jpg\|gif\)$' -> '<PROJECT_ROOT>/flow/stub/url-loader.js'

(如果将url-loader用于svg，png，jpg和gif).这将允许Flow进行正确的模块替换(url-loader返回一个字符串(base64或file-loader路径).

if you use url-loader for svg, png, jpg and gif. This will allow Flow to make the correct module replacement (url-loader returns a string (base64 or file-loader path).

例如，如果您这样做

import logoSVG from "./logo.png"
logoSVG.blah.stuff() // <-- flow will throw here

流将引发错误.

这篇关于导入CSS文件时的流程“找不到所需的模块"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！