如何使用的WebPack改變`sourceMappingURL`

我生產的WebPack配置爲：如何使用的WebPack改變`sourceMappingURL`

{ 
    output: { 
    publicPath: "https://cdn.example.com/sub-directory/", 
    filename: '[name]-[chunkhash].min.js' 
    }, 

    devtool: 'source-map', 

    plugins: [ 
    new webpack.optimize.UglifyJsPlugin() 
    ] 
}

現在我有兩個文件app-12345.min.js和app-12345.min.js.map。

我還爲主腳本自動生成了CDN URL https://cdn.example.com/sub-directory/app-12345.min.js。

但是sourceMappingURL仍然是相對路徑//# sourceMappingURL=app-12345.min.js.map而不能直接在瀏覽器中訪問。

我的問題是如何設置sourceMappingURL作爲絕對自動生成的路徑？

來源

2016-08-16 Ky6uk

你發現了一個解決方案，即時通訊面臨同樣的問題 – jamescharlesworth

最後這是可能在使用從@omj的響應指南和以下的WebPack 3配置

devtool: 'hidden-source-map', // SourceMap without reference in original file 

    new webpack.SourceMapDevToolPlugin({ 
    filename: '[file].map', 
    append: `\n//# sourceMappingURL=${path}[url]` 
    })

更新（的WebPack v3.10.0）：

自Webpack v3.10.0以來增加了一個新選項。該選項稱爲publicPath：

new webpack.SourceMapDevToolPlugin({ 
    filename: '[file].map', 
    publicPath: 'https://example.com/dev/' 
});

來源

2017-06-30 20:22:10 Ky6uk

SourceMapDevToolPlugin插件是一個選項。

new webpack.SourceMapDevToolPlugin({ 
    filename: '[file].map', 
    append: '\n//# sourceMappingURL=' + path + '[url]' 
});

來源

2016-10-24 20:51:39 ornj

在這種情況下，結果文件將包含兩個'sourceMappingURL'字符串。 '//＃sourceMappingURL = https：// example.com/app.js.map' and'//＃sourceMappingURL = app.js.map' – Ky6uk

to fix this use'config.devtool ='hidden-source- map''然後是'append：...' – daviestar

用的WebPack 2，您可以使用隱藏源地圖devtool和https://github.com/lcxfs1991/banner-webpack-plugin 橫幅的WebPack-插件和設置是這樣的：

new banner({ 
    chunks: { 
     "main": { 
      afterContent: "\n//# sourceMappingURL=custom/url/to/map\n" 
     } 
    } 
})

來源

2017-07-20 12:09:55

如何使用的WebPack改變`sourceMappingURL`

回答

相關問題