fix css extraction and pre-processors in vue-loader

Author: yyx990803

packages/@vue/cli-service-global/__tests__/globalService.spec.js

@@ -23,6 +23,9 @@ const entryVue = `
     data: () => ({ msg: 'hi' })
   }
 </script>
+<style>
+h1 { color: red }
+</style>
 `.trim()
 
 const entryJs = `
@@ -62,6 +65,7 @@ test('global build', async () => {
   const hasFile = file => fs.existsSync(path.join(distDir, file))
   expect(hasFile('index.html')).toBe(true)
   expect(hasFile('static/js')).toBe(true)
+  expect(hasFile('static/css')).toBe(true)
 
   const port = await portfinder.getPortPromise()
   server = createServer({ root: distDir })

packages/@vue/cli-service-global/lib/createConfigPlugin.js

@@ -39,14 +39,13 @@ module.exports = function createConfigPlugin (context, entry) {
           .rule('vue')
             .use('vue-loader')
               .tap(options => {
-                return Object.assign({
-                  loaders: {
-                    js: {
-                      loader: 'babel-loader',
-                      options: babelOptions
-                    }
+                options.loaders = Object.assign({
+                  js: {
+                    loader: 'babel-loader',
+                    options: babelOptions
                   }
-                }, options)
+                }, options.loaders)
+                return options
               })
 
         // set inline babel options

packages/@vue/cli-service/__tests__/build.spec.js

@@ -25,6 +25,7 @@ test('serve', async () => {
   expect(hasFile('index.html')).toBe(true)
   expect(hasFile('favicon.ico')).toBe(true)
   expect(hasFile('static/js')).toBe(true)
+  expect(hasFile('static/css')).toBe(true)
   expect(hasFile('foo.js')).toBe(true)
 
   const port = await portfinder.getPortPromise()

packages/@vue/cli-service/lib/config/css.js

@@ -19,6 +19,8 @@ module.exports = (api, options) => {
         .tap(options => {
           // ensure user injected vueLoaderOptions take higher priority
           options.loaders = Object.assign(resolver.vue(), options.loaders)
+          options.cssSourceMap = !!options.cssSourceMap
+          return options
         })
 
     // apply css loaders for standalone style files outside vue-loader
@@ -70,7 +72,7 @@ module.exports = (api, options) => {
       webpackConfig
         .plugin('extract-css')
           .use(ExtractTextPlugin, [Object.assign({
-            filename: '[name].[contenthash:8].css',
+            filename: `${options.staticDir}/css/[name].[contenthash:8].css`,
             allChunks: true
           }, userOptions)])
     }

packages/@vue/cli-service/lib/util/CSSLoaderResolver.js

@@ -183,7 +183,7 @@ module.exports = class CSSLoaderResolver {
    * })
    */
   vue (options = {}) {
-    this.postcssOptions = false
+    this.postcss = false
     this.cssModules = false
     const loaders = {}
     for (const lang of ['css', 'sass', 'scss', 'less', 'stylus', 'styl']) {