7

I'm using postcss-import to take care of my imports, and cssnano to minify. In my Webpack config I've been using the following setup for css-loader...

{
  loader: 'css-loader',
  options: {
    url: false,
    import: false,
    minimize: false,
    importLoaders: 1,
    souceMap: true,
  }
}

...but when I remove that everything still seems to load fine, so now I just have post-css before style-loader. Can I safely omit css-loader from my css build, or is there some other functionality it provides that is necessary? I've yet to see a webpack.config.js file that doesn't use css-loader, so I want to be cautious here! :)

RyanZim
  • 6,609
  • 1
  • 27
  • 43
chocobuckle
  • 89
  • 6

1 Answers1

4

css-loader basically enables webpack to build your dependencies tree by following the dependencies declared as @import and url() in you CSS files.

From css-loader docs:

The css-loader interprets @import and url() like import/require() and will resolve them.

Since postcss-import handles CSS @imports, you will still need css-loader to bundle any other static asset imported by your stylesheets like images, fonts, etc...

Andrea Carraro
  • 9,731
  • 5
  • 33
  • 57
  • 1
    "you will still need css-loader to bundle any other static asset imported by your stylesheets like images, fonts, etc" - doesn't "file-loader" handle that? – Gary Green Jul 11 '19 at 20:08