egoist / egoist/rollup-plugin-postcss

Bundle size increase due to CSS content duplication in stylesheet export

Open
#468 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
689
Forks
210
PR merge metrics
No merged PRs in 30d

Description

### Problem Description
When using `rollup-plugin-postcss` with CSS modules, the plugin generates duplicate CSS content in the output bundle, leading to unnecessary bundle size increase. This occurs because the same CSS content is stored twice:

1. Once in the CSS variable (`var ${cssVariableName}`)
2. Again in the stylesheet export (`export var stylesheet`)

This duplication directly impacts the final bundle size, which is especially problematic for production builds where bundle size optimization is critical.

### Current Behavior (Causing Bundle Bloat)
```javascript
var css_248z = ".class { color: red; }";
var stylesheet = ".class { color: red; }";

// inject code

export { css_248z as default, stylesheet };
//# sourceMappingURL=...
```

### Expected Behavior (Optimized)
```javascript
var css_248z = ".class { color: red; }";
var stylesheet = css_248z;

// inject code

export { css_248z as default, stylesheet };
//# sourceMappingURL=...
```

### Environment
- `rollup-plugin-postcss` version: 4.0.2

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.