feat: support postcss sugarss #2436
Conversation
piecyk
force-pushed
the
feat/css/add-sugarss
branch
from
122f0a6 to
2957932
Compare
piecyk
force-pushed
the
feat/css/add-sugarss
branch
from
2957932 to
f17adf3
Compare
|
Ok, changed to only cache postcss config path 😄 |
| plugins: [require('postcss-nested')] | ||
| module.exports = (api) => { | ||
| if (/\.sss$/.test(api.file)) { | ||
| return { |
There was a problem hiding this comment.
nitpick (non-blocking): I would prefer an initial object at the start of the function body and return it at the end of the function
Then in between you can add dynamically properties and extend it
So something like
const config = {
plugins: [require('postcss-nested')]
}
if (/\.sss$/.test(api.file)) {
config.parser = 'sugarss'
config.plugins.unshift(require('postcss-simple-vars'))
}
return configMay need to be extended with some type-safety or so
| } catch (e) { | ||
| if (!/No PostCSS Config found/.test(e.message)) { | ||
| throw e | ||
| } | ||
| return (cachedPostcssConfig = null) | ||
| return (cachedPostcssConfigPath = null) |
There was a problem hiding this comment.
thought (dx): I'm a bit confused by this line
Could we split it into two lines?
I think it means the same as 🤔
cachedPostcssConfigPath = null
return null
Shinigami92
added
the
p2-nice-to-have
|
@yyx990803 what do you think this postcss sugarss ? |
| (typeof inlineOptions === 'string' ? inlineOptions : config.root) | ||
|
|
||
| const ctx = { file, env: config.mode } | ||
| const result = (await postcssrc(ctx, searchPath)) as PostCSSConfigResult |
There was a problem hiding this comment.
This is obviously very inefficient - I think a better way to do this is have two cached & resolved config values - one for SugarSS and one for normal CSS.
There was a problem hiding this comment.
We can cache the resolved config with a hash of the ctx object, but we'll need to replace ctx.file with ctx.type (the file extension without the dot).
There was a problem hiding this comment.
Another option is to provide a cache function like Babel does it:
https://babeljs.io/docs/en/config-files#apicache
|
@piecyk is it possible to get this merged? Or maybe I'd use parts of your work? |
|
@vitalybaev you can fork this PR and keep working on it to address the issues listed above 👍🏼 |
Hi, this PR adds support for handling https://github.com/postcss/sugarss in css plugin, it's Indent-based CSS syntax for PostCSS.
Biggest change here is how the postcss config is resolve.
For handling
.ssswe need tell postcss to use the sugarss parser but not for css files. This can be achieved via passing aidthat will be passedctx: { file: string }to config. Similar as https://github.com/webpack-contrib/postcss-loader does it.Current implementation was caching resolved config, this is not true now as we resolved it per id. Changed it to keep cache for each id, but wondering now if that will give any significant performance improvement, or just increase memory 🤔
Added
cachedPostcssConfigPaththat will keep path to resolved config this can impact performance.