parcel-bundler/parcel

Parcel 2: PostCSS transform

devongovett opened this issue · 3 comments

devongovett commented

Create the @parcel/transform-postcss package in packages/transforms/postcss. This package is a Parcel 2 transform plugin for PostCSS. It will be based on the postcss transform inside CSSAsset from Parcel 1, separated into its own package.

The @parcel/transform-postcss package is responsible for the following things:

  • Loading .postcssrc configs
  • Parsing an AST if needed
  • Transforming with PostCSS
  • Generating a string if needed
jhpratt commented

@padmaia Will this allow compilation of entire bundles, rather than each file individually? It's my understanding that's why things like @import don't currently work when using PostCSS.

  • 👍2
padmaia commented

@jhpratt tbh, I've shelved this task while I've been working on some more pressing issues in core. After reading through #1165 we may still want to have the default PostCSS transformer work on a file per file basis so that the performance is optimal by default (parallelization and more granular caching), but it should definitely be possible to configure a custom PostCSS transform that supports your needs. It also might be possible to get the best of both worlds. Perhaps an optimizer plugin that runs over an entire package could replace all of the variables. I'm not sure if that would work or be desirable though 🤷‍♀️

mischnic commented

Reading #2983, there is a message() function where plugins register dependencies.
This way, a PostCSS plugin that resolves the imports (e.g. (postcss-import](https://github.com/postcss/postcss-import/blob/master/index.js#L199)) can forward the dependency list to Parcel for the watcher/HMR.