Questions tagged [rollup-plugin-postcss]

30 questions
5
votes
2 answers

Rollup minify classnames

Is there any rollup.js plugins which allow to obfuscate / mangle CSS class names? I haven't found anything, except this one for webpack: https://github.com/sndyuk/mangle-css-class-webpack-plugin
Daniel
  • 839
  • 10
  • 20
4
votes
0 answers

Rollup plugin develop: How to prevent other plugins processing files those my plugin have already processed

I am developing a rollup plugin to process a part of plugin-user's project files (js, sass, css etc) with some tricks, but if user have another plugin in his or her project such as postcss, it will reprocessed files which my plugin already…
4
votes
1 answer

Svelte: Unable to get imported unused CSS purged

I unsuccessfully tried to remove unused css imported from an external css file. I have tried a lot of combinaisons in vain, every time I run the build script I end up with a huge bundle.css. Here is the list of everything I tried so far: Importing…
3
votes
0 answers

Is there any way of using Rollup and rollup-plugin-postcss and rollup-plugin-scss so it treats css modules separately and sass separately?

We are using rollup to build our project and our requirement is a single .css file generated from compiling the .scss files. Separately in some components we want to use css modules with the styles being imported. On configuring rollup with…
Mickey Puri
  • 835
  • 9
  • 18
3
votes
2 answers

Tailwind styles are not being applied after bundling with Rollup

Apologies if this is an obvious question, this is my first time trying to build a component library. I'm building a React component library with Tailwind CSS 3. When I run the components with Storybook, they display as intended. However, when I…
3
votes
0 answers

Rollup pack scss into multiple bundles

I am using rollup-plugin-scs(v3.0.0) plugin in rollup(v2.62.0) to pack my svelte(v3.44.3) application. There are two sets of scss files. One set is for left-to-right languages, and the other for right-to-left languages. For each set, there is an…
Mr.Wang from Next Door
  • 13,670
  • 12
  • 64
  • 97
3
votes
3 answers

Replace all image paths in a css file with base64 encoded strings - rollup

I am trying to replace all the image paths in a css background url to a base64 encoded string while doing a rollup build. I am using rollup-plugin-postcss for this, I am able to generate a separate .css file in the build, but I want the image paths…
Hitesh Misro
  • 3,397
  • 1
  • 21
  • 50
3
votes
2 answers

Rollup - Allow :export statement in scss file to import in js

We have a Vue component library built with Rollup. The development is in early stage but everything worked well so far besides this one thing: we are not able to export SASS variables from a scss file and import them in a js file. We are used to do…
pmrotule
  • 9,065
  • 4
  • 50
  • 58
3
votes
0 answers

tsdx - import .css - error - PostCSS plugin postcss-modules requires PostCSS 8

I have created a package using TSDX create . I require to use a .css file I followed the guide from https://tsdx.io/customization#rollup Error: Error: PostCSS plugin postcss-modules requires PostCSS 8.
tony
  • 41
  • 3
3
votes
0 answers

How to properly inject extracted css file into head of html file with rollup.js?

I got simple rollup.config.js - everything seems fine to me and should work as I intend it (in the topic title), but only js file getting injected into html. Please help, tried tons of different packages already like rollup-plugin-postcss,…
n19htz
  • 126
  • 1
  • 10
2
votes
0 answers

How to avoid having injected CSS styles discarded by tree shaking?

I am using Rollup to bundle a React component. This component is later used in a React application bundled with Webpack. The component uses styles defined in two CSS modules -- one containing global styles and one with specific styles for the…
betabandido
  • 18,946
  • 11
  • 62
  • 76
2
votes
1 answer

Rollup plugin postcss does not inject css imported from node_modules

Here is my rollup config // rollup.config.js const postcss = require('rollup-plugin-postcss'); const autoprefixer = require('autoprefixer'); module.exports = { rollup(config, _options) { config.plugins.push( postcss({ plugins:…
Manish Jangir
  • 5,329
  • 4
  • 42
  • 75
2
votes
2 answers

Changing rollup-plugin-postcss generated CSS class names for only certain files

I need to configure rollup-plugin-postcss to only modify the CSS class names of certain files. I know this is possible with WebPack but I can't figure out how to do it with Rollup. Ideally I would like to give a regular expression that describes…
Jonathan Byrne
  • 193
  • 1
  • 11
2
votes
3 answers

.css file not added into distribution in js only library build with rollup

I'm writing JS library using rollup-starter-lib as base of my JS library "version": "1.29.0" It has main.js file & main.css file, There is no html file. main.js file is all about DOM manipulation, main.css file is necessary in implementation steps,…
Chanuka Asanka
  • 2,798
  • 3
  • 24
  • 36
1
vote
1 answer

Did the svelte.config.js file replace the rollup.config.js file in SvelteKit?

I'm trying to get PostCSS set up in my SvelteKit project to start playing with container queries. I installed 'svelte-preprocess' in my svelte.config.js file and made a postcss.config.cjs file (see below) svelte.config.js import adapter from…
1
2