Import mapping to scoped repo

[marcobiedermann]

According to the docs, postcss-import support importing from node_modules.
Unfortunately this does not work with scoped repositories and .css file extension:

node_modules/@brand/package-1

@import '@brand/package-1.css;'

To get it to work, I have to remove the file-extension @import '@brand/package-1; but this might cause resolving issues than also using JS imports.

I am not sure if #306 tackles this issue

[RyanZim]

When you write @import "@brand/package-1.css";; postcss-import interprets that as referring to the npm package @brand/package-1.css. This is required, because npm package names can contain .. Example: https://www.npmjs.com/package/normalize.css

[marcobiedermann]

@RyanZim Thank you, I know that already.
But I would like to remove the .css extension from my package name because it might include JS as well.

My setup looks like the following:

node_modules
node_modules/@brand
node_modules/@brand/package-1
node_modules/@brand/package-1/index.css
node_modules/@brand/package-1/index.js

I than would like to include it via

@import '@brand/package-1.css'

which would map to the index.css file like it is with node modules

const package = require('@brand/package-1');

which would map to the index.js file

As far as I know this is not possible with postcss-import right now.
I would have to use

@import '@brand/package-1/index.css'

to fix it.

[RyanZim]

You need to do:

@import '@brand/package-1'

---

@import '@brand/package-1/index.css'

works too, but it's not advised.

[marcobiedermann]

@RyanZim This is what I am talking about.
But I would like to just use

@import '@brand/package-1';

I know I can map an entry point within my package.json but this is already used for JS

[michael-ciniawsky]

@marcobiedermann Use pkg.style to map the entry for CSS files

[marcobiedermann]

@michael-ciniawsky
Oh thank you, I did not know that.