extract-text-webpack-plugin - 提取scss結果在main.css.map中沒有映射

Question

我已經設法將2個scss文件提取到1個css文件中，但我注意到在main.css.map中的源和映射是空的：

​​

我webpack.config.js：

var autoprefixer = require('autoprefixer'); 
var ExtractTextPlugin = require("extract-text-webpack-plugin"); 

module.exports = { 
    devtool: 'source-map', 
    module: { 
     loaders: [ 
       {test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000'}, 
       { 
        test: /\.scss$/, 
        loader: ExtractTextPlugin.extract(['css', 'sass']) 
       } 
      } 
     ] 
    }, 

    entry: [ 
     './static/js/app.js' 
    ], 

    output: { 
     filename: './static/js/bundle.js' 
    }, 

    watch: false, 

    plugins: [ 
     new ExtractTextPlugin("./main.css") 
    ] 
}; 

我app.js：

var $ = require('jquery'); 
window.jQuery = $; 
window.$ = $; 
require('bootstrap-loader'); 

module.exports = (function() { 
    alert('IT WORKS!'); 
}); 

window.app = module.exports; 

require('./../css/main.scss'); 
require('./../css/main2.scss'); 

從終端

webpack的輸出：

Hash: 28bc2c1ea9d333be2975 
Version: webpack 1.13.3 
Time: 3500ms 
           Asset  Size Chunks    Chunk Names 
89889688147bd7575d6327160d64e760.svg 109 kB   [emitted] 
       ./static/js/bundle.js 666 kB  0 [emitted] main 
          ./main.css 126 kB  0 [emitted] main 
      ./static/js/bundle.js.map 813 kB  0 [emitted] main 
         ./main.css.map 87 bytes  0 [emitted] main 
    [0] multi main 28 bytes {0} [built] 
    [1] ./static/js/app.js 287 bytes {0} [built] 
    + 29 hidden modules 
Child extract-text-webpack-plugin: 
     + 4 hidden modules 
Child extract-text-webpack-plugin: 
     + 4 hidden modules 

正如你可以看到main.map.css一起產生main.css，但在這一點上是很沒用，因爲裏面沒有映射可言。

Answer 1

最後，經過無數組合的努力，我找到了答案。使用這些CSS加載器的語法會讓人頭疼，並且顯然隨着webpack的發展而發生變化，因爲一些較古老的例子對其他人來說很奇怪，並不適合我。

儘管已經有devtools: 'source-map'選項我還需要從改變裝載機：

{ 
    test: /\.scss$/, 
    loader: ExtractTextPlugin.extract(['css', 'sass']) 
} 

到：

{ 
    test: /\.scss$/, 
    loader: ExtractTextPlugin.extract(['css-loader?sourceMap', 'sass-loader?sourceMap']) 
} 

，並感謝這個檢查我的CSS文件中的開發工具的正確指向兩個SCSS文件現在。