diff --git a/src/components/CssWebpackConfig.js b/src/components/CssWebpackConfig.js index b1aebda82..87ed75870 100644 --- a/src/components/CssWebpackConfig.js +++ b/src/components/CssWebpackConfig.js @@ -108,7 +108,13 @@ class CssWebpackConfig extends AutomaticComponent { { loader: 'css-loader', options: { - url: Config.processCssUrls, + url: (url, resourcePath) => { + if (url.startsWith('/')) { + return false; + } + + return Config.processCssUrls; + }, modules: useCssModules } }, diff --git a/src/components/Preprocessor.js b/src/components/Preprocessor.js index d3c2fea71..305cdf355 100644 --- a/src/components/Preprocessor.js +++ b/src/components/Preprocessor.js @@ -57,7 +57,13 @@ class Preprocessor { { loader: 'css-loader', options: { - url: processUrls, + url: (url, resourcePath) => { + if (url.startsWith('/')) { + return false; + } + + return processUrls; + }, sourceMap: Mix.isUsing('sourcemaps'), importLoaders: 1 } diff --git a/test/features/preprocessors.js b/test/features/preprocessors.js index c7c507835..bc03ea38a 100644 --- a/test/features/preprocessors.js +++ b/test/features/preprocessors.js @@ -7,6 +7,15 @@ import webpack from '../helpers/webpack'; import '../helpers/mix'; +test('it does not process absolute urls', async t => { + mix.postCss(`test/fixtures/app/src/css/app.css`, 'css'); + + await t.notThrowsAsync( + webpack.compile(), + 'CSS failed to compile due to incorrect URL processing.' + ); +}); + test('it compiles PostCSS without JS', async t => { mix.postCss(`test/fixtures/app/src/css/app.css`, 'css'); diff --git a/test/fixtures/app/src/css/app.css b/test/fixtures/app/src/css/app.css index 95a4c1e27..3cac7a4cb 100644 --- a/test/fixtures/app/src/css/app.css +++ b/test/fixtures/app/src/css/app.css @@ -1,3 +1,4 @@ .app { color: red; + background: url('/absolute/image.jpg'); }