postcss-import
postcss-import copied to clipboard
feature request: support conditional exports (package.json `exports` field)
Love the style
support, but would really helpful for conditional exports to also be legible to postcss-import
:
{
...,
"exports": {
".": "./dist/index.js",
"./*": "./dist/lib/*/index.js",
"./styles": "./dist/styles/index.css",
"./styles/*": "./dist/styles/*/index.css",
"./package.json": "./package.json"
},
...,
}
The main reason I suggest this is because I cannot specify an @import "my-package/styles"
statement in a way that is supported by both esbuild (supports standardized package.json exports
, but not nonstandard style
) and postcss-import
(where situation is reversed). my-package/styles
is the only thing that works for esbuild, but my-package
is the only thing that works for postcss-import
.
I would recommend following the Node doctrine of "if exports
exists, it overrides anything else" (i.e. style
field). Also thank you for maintaining this project, it is a core part of modern development workflows IMO, only reason I suggest the enhancement.
The module we use for resolution doesn't support exports
yet; so that's a technical blocker: https://github.com/browserify/resolve/issues/222.
Presumably, we'd want to support some kind of style-specific conditional export as well, so you could export both JS and CSS at .
, similiar to how using both main
& style
works today. Does esbuild have anything like this?
No sir, not that I know of, hence the conflict.
Regarding "JS and CSS at same import", I would not recommend that! You can import from "." with postcss-import by using the nonstandard "style" field; to use exports, you must pick one.
Pure CSS modules could export at ".", and normal JS modules could simply export at "/styles" (which is what I do).
/* NBD! */
@import "my-package/styles"
I was also looking for this just now. I assumed it would be finding exports (example of how the popular slider component Swiper does it: https://github.com/nolimits4web/swiper/blob/e54f07d6047f56e0469fd7d3024ede36e5b942fe/src/copy/package.json)
Ideally the identifier would just be run through native Node resolution to get the entry point and prefer the style
field in nearest package.json (else fall back to entry point at .
).
This way the specifiers are "true to form", and @import "..."
mirrors import(...)
in JS as closely as possible.
Relevant: https://nodejs.org/api/packages.html#community-conditions-definitions
Also relevant : https://github.com/nodejs/node/pull/46994