Fix relative URLs in CSS not working in dev mode

Sam A. Horvath-Hunt · Sam A. Horvath-Hunt · commit 60cd76a750a4 · 2016-09-23T12:06:27.000+01:00
diff --git a/generators/app/templates/package.json b/generators/app/templates/package.json
@@ -28,7 +28,7 @@
     "nodemon": "^1.10.2",
     "postcss-loader": "^0.13.0",
     "run-sequence": "^1.2.2",
-    "style-loader": "^0.13.1",
+    "style-loader": "github:bendytree/style-loader",
     "webpack": "2.1.0-beta.24",
     "webpack-dev-middleware": "^1.8.1",
     "webpack-dev-server": "^2.1.0-beta.4",
diff --git a/generators/app/templates/webpack.config.js b/generators/app/templates/webpack.config.js
@@ -89,7 +89,7 @@ module.exports = {
       {
         test: /\.<%= cssExt %>$/,
         loaders: [
-          'style',
+          'style?fixUrls', // This is to fix sourcemaps breaking relative URLs in CSS
           'css?sourceMap',
           'postcss',
           '<%= cssLoader %>?sourceMap'

Original file line number	Diff line number	Diff line change
`@@ -89,7 +89,7 @@ module.exports = {`
`89`	`89`	`{`
`90`	`90`	`test: /\.<%= cssExt %>$/,`
`91`	`91`	`loaders: [`
`92`		`- 'style',`
	`92`	`+ 'style?fixUrls', // This is to fix sourcemaps breaking relative URLs in CSS`
`93`	`93`	`'css?sourceMap',`
`94`	`94`	`'postcss',`
`95`	`95`	`'<%= cssLoader %>?sourceMap'`