The mini-css-extract-plugin extracts CSS into separate files. It creates a CSS file per JS file which contains CSS. It supports On-Demand-Loading of CSS and SourceMaps.
Questions tagged [mini-css-extract-plugin]
185 questions
1
vote
0 answers
Webpack mini-css-extract-plugin breaks popup js on my chrome extension
I'm working on a chrome extension project.
I'm using MiniCssExtractPlugin to inject CSS into the content script.
It's working perfectly fine actually, but it breaks popup.js now.
It seems that can't access my popup.js
Your file couldn’t be accessed.…

Mingyu Jeon
- 1,755
- 5
- 23
- 40
1
vote
1 answer
How to exclude creation of css chunk files?
I have a project in which I have to build all the modules into one file, and also split it into modules.
But I don't need css files for modules except for one common.
My files:
file 'a.js'
import 'a.css';
import b from 'b.js';
import c from…

Touch of the mind
- 11
- 1
- 2
1
vote
0 answers
MiniCssExtractPlugin loader is loading css to two different files
My webpack contains this:
{
test: /\.css$/i,
exclude: /node_modules/,
use: [MiniCssExtractPlugin.loader,"css-loader"]
}
and I have appLayout.js file that loading css files, that js file is build like this:
import…

Guy Cohen
- 21
- 4
1
vote
0 answers
After upgrading to Angular 13 from 11, images used in LESS files are not loaded to the dist folder
I'm using angular-builders/custom-webpack where I handle compiling of LESS to CSS with the custom webpack. In Angular 11, it works no issue where the images that are referenced in the LESS files are moved to the dist folder. However, after upgrading…

BKoo
- 95
- 3
- 13
1
vote
0 answers
CSS sourceMap with sass-loader, postcss-loader, and MiniCssExtractPlugin in Webpack 5
Seems like I've followed all the instructions to generate CSS source maps, but still not finding them in the output CSS (I expect to see something like /*# sourceMappingURL=base.css.map */ in the output). Here are the relevant bits of my Webpack…

Dmitry Shvedov
- 3,169
- 4
- 39
- 51
1
vote
1 answer
getting ' ajv is not a constructor mini-css-extract-plugin ' error whenever installing package using npm
whenever I'm trying to install a package from npm I'm getting the following error :
ajv is not a constructor , mini-css-extract-plugin
My project is now stopped due to this error I can't download any new package.
This only works if I deleted…

Firas SCMP
- 461
- 4
- 18
1
vote
1 answer
Laravel Mix "npm run dev module build failed, cannot find module ... but all are installed
What I have:
macOS Big Sur
node 14 with nvm ( I have also try the 17 )
npm 8.1.3
Laravel 8
package.json
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "mix",
"watch": "mix watch",
"watch-poll":…

Giampy71
- 137
- 1
- 5
1
vote
1 answer
How to exclude link tags (or more specifically .css files extracted by the mini-css-extract-plugin) from being generated by html-webpack-plugin?
Due to how the (legacy) project is currently set up, I cannot benefit from the caching capabilities of webpack in the standard way, but instead have to generate the scripts in empty files (like main.html5 example) and include those in the project's…

Sirkow
- 63
- 9
1
vote
0 answers
"mini-css-extract-plugin" every time injects a new number in main.js file on each build which changing contenthash number of main.js unnecessarily
I am using webpack 5, and using contenthash for the main.js file. But my main.js file gets a new hash number on every build even if there is nothing changed in my application. When I compared two main.js files from two different builds, then I found…

Sudarshan Tanwar
- 3,537
- 3
- 24
- 39
1
vote
3 answers
Font Awesome commenting out tag after parsing
I'm working on a React application where I want conditional rendering of FontAwesome icons, but at the moment it's not changing when it should.
I inspected elements and found that FontAwesome is commenting out the React component and replacing it…

John James
- 219
- 1
- 8
1
vote
1 answer
Webpack NPM module build failed ValidationError: CSS Loader ...does not match the API schema
I have updated all my packages to the latest versions, but when I run my project script, I get an error that is somehow connected to my css file. I have checked pathfile names and any errors within my css itself, however it all looks exactly like…

Krys
- 819
- 1
- 21
- 38
1
vote
1 answer
Font Awesome loading as boxes with less.js and webpack
I recently tweaked my webpack modules in my React/Electron.js project to compile less files using less-loader, css-loader, and MiniCssExtractPlugin.loader instead of the style-loader since there is no window defined during part of the compilation,…

John James
- 219
- 1
- 8
1
vote
1 answer
when I use mini-css-extract-plugin I get [webpack-cli] Invalid configuration object error
I am trying to use mini css extract plugin but it doesn't work. I couldn't find what should be the correct configuration. I am getting this: [webpack-cli] Invalid configuration object. Webpack has been initialized using a configuration object that…

nagehan
- 37
- 6
1
vote
1 answer
Conflict in order with mini-css-extract-plugin (i know,the question have already been asked several time :-/)
I need your help!
Stack
Electron, electron-webpack, vuejs
CSS are in .vue directly, into a