Wie erstellt man eine Quellkarte für WebPack?

Question

Meine aktuelle webpack.config Datei

module.exports = { 
    entry: "./entry.js", 
    output: { 
     devtoolLineToLine: true, 
     sourceMapFilename: "./bundle.js.map", 
     pathinfo: true, 
     path: __dirname, 
     filename: "bundle.js" 
    }, 
    module: { 
     loaders: [ 
      { test: /\.css$/, loader: "style!css" } 
     ] 
    }, 
}; 

Ich war hier https://webpack.github.io/docs/configuration.html und fand die Lektüre folgenden:

output.sourceMapFilename

[file] wird durch die Dateinamen der Datei JavaScript ersetzt.

[ID] wird durch die ID des Chunks ersetzt.

[Hash] wird durch den Hash der Kompilierung ersetzt.

Ich habe es oben hinzugefügt, wie Sie sehen können, aber wenn meine Webpack-Uhr läuft, sehe ich keine Map-Datei?

Wie wird das gemacht?

Answer 1

Es gibt zwei Möglichkeiten:

die CLI development shortcut zusammen mit Ihrer --watch Option verwenden:

webpack -d --watch 

oder die Konfiguration devtool Option in Ihrem webpack.config.js mit:

module.exports = { 
    devtool: "source-map", 
    entry: "./entry.js", 
    output: { 
     devtoolLineToLine: true, 
     sourceMapFilename: "./bundle.js.map", 
     pathinfo: true, 
     path: __dirname, 
     filename: "bundle.js" 
    }, 
    module: { 
     loaders: [ 
      { test: /\.css$/, loader: "style!css" } 
     ] 
    }, 
};