egoist / egoist/rollup-plugin-postcss
SCSS modules does not work with inject:true
- Dominant language
- JavaScript
- Stars
- 689
- Forks
- 210
- PR merge metrics
- No merged PRs in 30d
Description
Hi everyone,
I have a problem with postCSS: **it works with `extract: true` and not with `extract: false; inject:true`**
Here is my `rollup.config.js`
```
import commonjs from "@rollup/plugin-commonjs"
import peerDepsExternal from "rollup-plugin-peer-deps-external"
import typescript from "rollup-plugin-typescript2"
import postcss from "rollup-plugin-postcss"
import packageJson from "./package.json"
import { terser } from "rollup-plugin-terser"
import progress from "rollup-plugin-progress"
import { visualizer } from "rollup-plugin-visualizer"
export default [
{
input: ["src/index.ts", "src/inputs/index.ts"],
output: [
{
dir: "dist",
format: "cjs",
exports: "auto",
sourcemap: false
}
],
preserveModules: true,
plugins: [
progress(),
peerDepsExternal(),
commonjs(),
typescript({ useTsconfigDeclarationDir: true }),
postcss({
extract: true,
minimize: true,
modules: true
}),
terser(),
visualizer({})
],
external: [...Object.keys(packageJson.peerDependencies || {}), ...Object.keys(packageJson.dependencies || {})]
}
]
```
Here is my `TextField.tsx`
```
import React from "react"
import classnames from "classnames"
import ITextFieldProps from "./TextField.types"
import style from "./TextField.module.scss"
const TextField: React.FC = (props: ITextFieldProps) => {
return
}
export default TextField
```
Here is my `TextField.module.scss`
```
@import "../../style/variables.scss";
.textField {
background-color: $color;
}
```
Here are my devDependencies
```
"devDependencies": {
"@rollup/plugin-commonjs": "^19.0.1",
"@rollup/plugin-node-resolve": "^13.0.2",
"@rollup/plugin-typescript": "^8.2.3",
"@storybook/addon-actions": "^6.3.4",
"@storybook/addon-essentials": "^6.3.4",
"@storybook/addon-links": "^6.3.4",
"@storybook/addon-storyshots": "^6.3.4",
"@storybook/node-logger": "^6.3.4",
"@storybook/preset-create-react-app": "^3.2.0",
"@storybook/react": "^6.3.4",
"@testing-library/jest-dom": "^5.11.4",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"@types/react": "^17.0.14",
"@types/react-dom": "^17.0.9",
"node-sass": "^6.0.1",
"postcss": "^8.3.6",
"rollup": "^2.53.2",
"rollup-plugin-peer-deps-external": "^2.2.4",
"rollup-plugin-postcss": "^4.0.0",
"rollup-plugin-progress": "^1.1.2",
"rollup-plugin-terser": "^7.0.2",
"rollup-plugin-typescript2": "^0.30.0",
"rollup-plugin-visualizer": "^5.5.2",
"sass": "^1.35.2",
"tsconfig-paths-webpack-plugin": "^3.5.1"
},
```
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.