Webpack + Babel Falsche Zeilennummern im Stapel Trace

Question

Ich baue eine Anwendung mit Webpack und Babel. Wenn in der Anwendung ein Fehler auftritt, wird die Zeilennummer für den ersten Fehler korrekt aufgelistet. Anschließend wird die Zeilennummer für den verkleinerten Code für jeden weiteren Schritt angezeigt.

Meine Webpack Config ist wie folgt,

const webpack = require('webpack'); 
const path = require('path'); 
module.exports = { 
    module: { 
     loaders: [ 
      { 
       loader: "babel-loader", 
       exclude: [ 
        /(node_modules)/, 
       ], 
       query: { 
        presets: ['es2015','react'], 
        plugins: ['transform-object-rest-spread'] 
       } 
      }, 
      { 
       test:/\.less$/, 
       exclude:'/node_modules', 
       loader:"style!css!less" 
      } 
     ] 
    }, 
    entry: { 
     "index": ["./src/main"] 
    }, 
    output: { 
     path: path.resolve(__dirname, "public"), 
     publicPath: "/assets", 
     filename: "[name].bundle.js" 
    }, 
    resolve: { 
     extensions: ['', '.js', '.jsx'], 
    }, 
    devServer: { inline: true }, 
    devtool: 'source-map' 
}; 

Answer 1

Um von webpack zu debuggen erzeugt baut, müssen Sie etwas mehr über 'DevTool' verstehen in webpack Einstellung. Hier ist der Link zur offiziellen Dokumentation. Webpack Devtool Configuration

Nun zu Ihrem Problem, können Sie eine der folgenden Möglichkeiten nutzen, um zu Ihrem ursprünglichen Code zu navigieren, der das Problem verursacht hat. Dies ist nur mit Quellkarten möglich.

eval-Inline-source-Karte // Für DEV

oder

billig-Inline-Modul-Source-Karte baut // Für ART baut

ZB

{ 
    'devtool': 'cheap-inline-module-source-map' 
}