Skip to content

Instantly share code, notes, and snippets.

@MoOx MoOx/.flowconfig
Last active Jul 12, 2018

Embed
What would you like to do?
flow config webpack adjustements to avoid the "Required module not found" for png, css, svg etcc
# ...
[options]
# webpack loaders
module.name_mapper='.*\.css$' -> '<PROJECT_ROOT>/flow/stub/css-modules.js'
module.name_mapper='.*\.\(svg\|png\|jpg\|gif\)$' -> '<PROJECT_ROOT>/flow/stub/url-loader.js'
// @flow
type CSSModule = { [key: string]: string }
const emptyCSSModule: CSSModule = {}
export default emptyCSSModule
// @flow
const s: string = ""
export default s
@MoOx

This comment has been minimized.

@oliverturner

This comment has been minimized.

Copy link

commented May 24, 2016

@MoOx you're an absolute legend :) thanks so much for being such a huge help!

@tonyxiao

This comment has been minimized.

Copy link

commented Jul 12, 2016

Followed exactly but doesn't seem to be working. What version of flow are you using? latest version 0.28 or something else? @MoOx

@jvalente

This comment has been minimized.

Copy link

commented Jul 12, 2016

@tonyxiao, I was able to yield the expected result w/ v0.28.
Make sure you use module.name_mapper='.*\.css$' like presented here instead of module.name_mapper.extension='css' like presented on the SO explanation.

@AlicanC

This comment has been minimized.

Copy link

commented Jul 28, 2016

I think you should just declare types instead of exporting actual objects.

CssStub.js

/* @flow */

declare export default {[key: string]: string};

FileStub.js

/* @flow */

declare export default string;
@acusti

This comment has been minimized.

Copy link

commented Sep 15, 2016

👍 on directly declaring the export default type. Nice approach.

Also, 👍 on not using the module.name_mapper.extension shorthand, as @jvalente instructed. I was unable to configure multiple module.name_mapper directives and have them work well together when using the .extension version and couldn’t figure out why. Specifically, I needed to be able to use the css stub for module names matching '.*\.css$', but overriding that if the module name starts with !raw! to use the file stub (export string) version. Here’s what worked:

.flowconfig

module.name_mapper='^!raw!.*$' -> '<PROJECT_ROOT>/flow/stub/url-loader.js'
module.name_mapper='.*\.css$' -> '<PROJECT_ROOT>/flow/stub/css-modules.js'

However, when I had the same config, just with module.name_mapper='.*\.css$' -> '<PROJECT_ROOT>/flow/stub/css-modules.js replaced with module.name_mapper.extension='css' -> '<PROJECT_ROOT>/flow/stub/css-modules.js', that name_mapper overrides the !raw! name_mapper and makes flow think that import Raw from '!raw!./style.css will import an object.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.