fix css-loader to handle ~/ aliases

#1241

lib/builder/webpack/helpers.js

@@ -1,15 +1,40 @@
 import ExtractTextPlugin from 'extract-text-webpack-plugin'
+import { join } from 'path'
 
 export function extractStyles () {
   return !this.options.dev && this.options.build.extractCSS
 }
 
-export function styleLoader (ext, loader = []) {
+export function styleLoader (ext, loaders = []) {
+  // https://github.com/webpack-contrib/css-loader
+  const cssLoader = {
+    loader: 'css-loader',
+    options: {
+      minimize: true,
+      sourceMap: true,
+      // https://github.com/webpack/loader-utils#root-relative-urls
+      root: '~',
+      alias: {
+        '/static': join(this.options.srcDir, 'static'),
+        '/assets': join(this.options.srcDir, 'assets')
+      }
+    }
+  }
+
+  // https://github.com/vuejs/vue-style-loader
+  const vueStyleLoader = {
+    loader: 'vue-style-loader',
+    options: {
+      sourceMap: true
+    }
+  }
+
   if (extractStyles.call(this)) {
     return ExtractTextPlugin.extract({
-      use: ['css-loader?minify&sourceMap'].concat(loader),
+      use: [cssLoader].concat(loaders),
-      fallback: 'vue-style-loader?sourceMap'
+      fallback: vueStyleLoader
     })
   }
-  return ['vue-style-loader?sourceMap', 'css-loader?sourceMap'].concat(loader)
+
+  return [vueStyleLoader, cssLoader].concat(loaders)
 }