3

When building SASS/SCSS files directly with webpack 4 in combination with the MiniCssExtractPlugin 2 files are emitted: the expected CSS output but also a JavaScript file.

I use the CSS files as entry points (not importing them from JS source). I'm not sure what part of the chain is responsible for this behavior because especially for SASS quite some loaders must be used. In order to reproduce the problem, I created this repo: https://github.com/jneuendorf/webpack4-mini-css-extract-plugin

According to some other stackoverflow questions one should import the CSS file from within JavaScript but these answers may not be up to date anymore. See

Is this still the recommended or is there also a clean webpack-style version to solve the problem for CSS entry points?

Improve this question
2
  • 1
    I recommend reading the documentation for what it is webpack.js.org/concepts If you don't want to click, I'll give it here "At its core, webpack is a static module bundler for modern JavaScript applications. ..." I do not see there information about compiling scss or other things is a tool for js. If you want to compile only scss to css use only node-sass. Just use the command line in this way: node-sass style.scss style.css. I recommend going to github and looking for webpack boilerplate there. You have many bugs in your code, like old dependencies, the entry should contain a js. Commented Mar 19, 2020 at 14:46
  • 2
    Hey @GrzegorzT. thanks for the quick reply. What kind of bugs do you mean - what are old dependencies? Feel free to add issues to the repo. I am aware that webpack is a JS build tool but the repo is only a minimal example to reproduce the problem. In reality there are lots of JS and CSS entries. After some research I found github.com/fqborges/webpack-fix-style-only-entries which addresses the problem and links 2 issues from webpack and the mini-css-extract-plugin. So apparently lots of people have that problem but the community is aware and will get rid of the problem with webpack 5 Commented Mar 19, 2020 at 19:22
Related questions
1
Webpack and MiniCssExtractPlugin does not bundle CSS files
3
How do I generate a css file using webpack 4 and mini-css-extract-plugin?
3
Error in using the webpack mini-css-extract-plugin plugin
Load 7 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.