2015-11-18 30 views
6

hiện tại của tôi webpack.config tập tinCách tạo bản đồ nguồn cho WebPack?

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" } 
     ] 
    }, 
}; 

Tôi đã đọc ở đây https://webpack.github.io/docs/configuration.html và thấy như sau:

output.sourceMapFilename

[file] được thay thế bằng tên tập tin của tập tin JavaScript.

[id] được thay thế bằng id của đoạn.

[băm] được thay thế bằng băm của trình biên dịch.

Tôi đã thêm nó ở trên như bạn có thể thấy, nhưng khi xem webpack của tôi chạy, tôi không thấy tệp bản đồ?

Điều này được thực hiện như thế nào?

Trả lời

10

Có hai lựa chọn ở đây:

Sử dụng CLI development shortcut cùng với tùy chọn --watch của bạn:

webpack -d --watch 

hoặc sử dụng các tùy chọn cấu hình devtool trong webpack.config.js của bạn:

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" } 
     ] 
    }, 
}; 
+0

Ah cảm ơn! Điều này làm việc 'webpack -d --watch' công cụ cấu hình đã không làm bất cứ điều gì cho đến khi tôi sử dụng lệnh đó. –

+0

@LeonGaban Tùy chọn '-d' chỉ là một phím tắt bao gồm, trong số những người khác, một' devtool'. Tùy chọn cấu hình sẽ hoạt động với 'webpack --watch'. – dreyescat

+0

Tôi nghĩ đây không phải là một trong hai tình huống. bạn cần có tham số lệnh cả hai - '-d' và bao gồm khai báo devtool cùng với định nghĩa sourceMapFilename trong webpack.config.js –

Các vấn đề liên quan