Can't resolve composed CSS from node_modules folder
0xR opened this issue · comments
I have CSS which look like this:
.button {
composes: btn from 'basscss-btn';
}
I get the error:
{ Error: ENOENT: no such file or directory, open '/project/src/basscss-btn-primary'
at Error (native)
errno: -2,
code: 'ENOENT',
syscall: 'open',
path: '/project/src/basscss-btn-primary' }
While it should be resolving node_modules/basscss-btn/index.css
.
I tried using the resolveOptions
but it seems to only be used to resolve JS imports and not composed CSS modules.
After digging around, I think you’re meant to specify the css file you want: basscss-btn/index.css
in this case. Let me know how that goes!
Thanks I'll try that. But it would be cool though if I could specify resolve options to do this automatically.
I just remembered I tweaked my webpack config to get it to work there:
new webpack.ResolverPlugin(
new webpack.ResolverPlugin.FileAppendPlugin(['/index.css'])
),
So it does make sense that this doesn't work automatically for es-css-modules.
Tried it, but now I get another error for:
composes: btn-primary from 'basscss-btn-primary/index.css';
Error: Class name btn-primary is invalid
Which is hard to fix, since I don't control the naming of basscss. I don't consider this an edge case since dash-casing is default for css.
This seemed to work for me (test). You’re only meant to run your own files through, and not basscss’s. Does that fix anything?
I am running on my own files. In my file it looks like this:
.primary {
composes: btn-primary from 'basscss-btn-primary';
}
I can post a repro tomorrow.
Okay, I should have fixed that bug in version 1.2.4
.
For some reason I can't reproduce it anymore. I do have some more question, maybe we should use some chat.
Sure, you can DM me on Twitter if that works best (@jacobp100).