ソースマップはクロムで検出されますが、元のソースはロードされません.Webpack-2を使用します。

Question

webpack 2を使用して構築されたアプリケーションを実行すると、ソースマップはクロムで検出されますが、 私はwebpack beta21を使用しています。

これらのファイルは自動的に検出されました。つまり、ブレークポイントがwebpack jsファイルの出力に置かれたとき、ソースビューはwebpackの元のソース入力にジャンプします。しかし、今、私は、この画面にこだわっています：

設定：

var path = require("path"); 
var webpack = require("webpack"); 
var WebpackBuildNotifierPlugin = require('webpack-build-notifier'); 


const PATHS = { 
    app: path.join(__dirname, '../client'), 
    build: path.join(__dirname, '../public') 
}; 

module.exports = { 


    entry: { 
    app: PATHS.app + '/app.js' 
    }, 
    output: { 
    path: PATHS.build, 
    filename: '[name].js' 
    }, 


    devtool: "source-map", 
    module: { 
    loaders: [ 
     { 
     test: /\.js?$/, 
     loader: 'babel-loader', 
     include: [ 
      path.resolve(__dirname, 'client'), 
     ], 
     exclude: /node_modules/ 

     }, 

     { 
     test: /\.css/, 
     loader: "style!css" 
     } 
    ] 
    }, 
    resolve: { 
    // you can now require('file') instead of require('file.js') 
    extensions: ['', '.js', '.json'] 
    } , 
    plugins: [ 
    new WebpackBuildNotifierPlugin() 
    ] 

}; 

Answer 1

外部ソースマップの問題がクローム52で修正されましたが、あなたはあなたのdevtoolが鉱山から異なる設定持っているように見え、私は以下を使用します：

devtool: '#source-maps' 

あなたのソースをどのように構築していますか？ -dを実行している場合は、インラインソースマップに切り替わります

Answer 2

作業領域にマッピングしている場合は、既にソースコードがあることを意味します。あなたのソースマップにソースコードを含めることは、不必要な冗長性を作り出しています。

代わりにnosources-source-mapを使用してください。