flowtype - tutorial - Flujo "Módulo obligatorio no encontrado" al importar un archivo CSS
flow type tutorial (3)
Cuando intento importar CSS a través de webpack (importar (./index.css)), aparece este error:
3: import ''./index.css'';
^^^^^^^^^^^^^ ./index.css. Required module not found
Tengo una estructura como ComponentName → (index.js, index.css), de modo que cada componente tiene todas las dependencias dentro.
Intenté this truco pero no funcionó para mí. ¿Podría simplemente ignorarlo de alguna manera?
Agrega esto a tu configuración de flujo
[options]
module.name_mapper.extension=''css'' -> ''<PROJECT_ROOT>/CSSModuleStub.js''
Y añada crear un archivo a su raíz CSSModuleStub.js :
// @flow
type CSSModule = { [key: string]: string }
const emptyCSSModule: CSSModule = {}
export default emptyCSSModule
Si quieres una ruta limpia, puedes ajustar así
[options]
module.name_mapper.extension=''css'' -> ''<PROJECT_ROOT>/flow/stub/css-modules.js''
Y así renombrar CSSModuleStub.js a flow/stub/css-modules.js .
Mientras estamos en ello, si necesita algunos otros apéndices (por ejemplo: para url-loader ) aquí hay otro ejemplo.
Crear flow/stub/url-loader.js
// @flow
const s: string = ""
export default s
Y añadir
module.name_mapper=''.*/./(svg/|png/|jpg/|gif/)$'' -> ''<PROJECT_ROOT>/flow/stub/url-loader.js''
Si usas url-loader para svg, png, jpg y gif. Esto permitirá a Flow realizar el reemplazo correcto del módulo (url-loader devuelve una cadena (base64 o ruta del cargador de archivos).
Por ejemplo si lo haces
import logoSVG from "./logo.png"
logoSVG.blah.stuff() // <-- flow will throw here
El flujo lanzará un error.
Gracias @MoOx, esto es genial !! ¿Alguna sugerencia sobre un talón para el cargador de paquetes webpack?
Estaba pensando algo como esto ...
module.name_mapper=''^bundle?[a-zA-Z0-9$_]+$'' -> ''<PROJECT_ROOT>/flow/stubs/bundle-loader.js.flow''
require(''bundle?lazy&name=bundleName!path/to/file'')
Para no tener que declarar CSSModule para cada proyecto, he publicado un paquete npm que lo hace: