intuit / intuit/design-systems-cli
postcss-loader webpack config uses outdated options object
- Dominant language
- TypeScript
- Stars
- 419
- Forks
- 89
- PR merge metrics
- No merged PRs in 30d
Description
This bug was discovered when attempting to use `@storybook/addon-postcss` with Storybook 6.3.
There are deprecation warnings that postcss will require addon-postcss to function in Storybook 7.
**Describe the bug**
The options object for postcss-loader changed in v4.0.
**To Reproduce**
OLD:
```javascript
{
loader: 'postcss-loader',
options: {
sourceMap: true,
plugins: (
await getPostCssConfig({
useModules: false
})
).plugins
}
```
**Expected behavior**
NEW:
```javascript
{
loader: 'postcss-loader',
options: {
sourceMap: true,
postcssOptions: { // This property is now required
plugins: (
await getPostCssConfig({
useModules: false
})
).plugins
}
}
```
**Screenshots**
Omitting this new `postcssOptions` property will result in the following error:

**Additional context**
This error happens at build-time within the `@design-systems/storybook` plugin.
I have not explored further than that right now.
In the `modify-webpack.js` file, updating the postcss-loader to use the `postcssOptions` object will fully fix this issue.
This fix will break compatibility with postcss-loader v3.0 and lower, however this should not be a problem as postcss-loader is a controlled dependency of `@design-systems/bundle`.
Contributor guide
Assessment
This issue has not been assessed yet.