傀儡的源地圖？

Question

我木偶（這會是一個動詞？）應用程序與構建和的WebPack在page.on('error')我得到這樣的錯誤：

TypeError: __WEBPACK_IMPORTED_MODULE_0_babel_runtime_core_js_promise___default.a.map is not a function 
    at _default.<anonymous> (....../app.js:23858:89) 
    at Generator.next (<anonymous>) 
    at step (....../app.js:35041:30) 
    at ....../app.js:35052:13 

有沒有一種方法，如果是的話我怎麼能拿這些錯誤正確sourcemapped？

（我肯定知道我產生sourcemaps）

Answer 1

我做到了以下列方式......有點遲，但有人可能會發現它很有用。

一旦你導航到該頁面引發錯誤你注入此lib目錄下：https://github.com/novocaine/sourcemapped-stacktrace

await page.addScriptTag({ 
    url: 'https://cdn.jsdelivr.net/npm/sourcemapped-stacktrace@1.1.8/dist/sourcemapped-stacktrace.js', 
}); 

然後你聽的錯誤事件：

page.on('pageerror', logStackTrace); 
page.on('error', logStackTrace); 

在logStackTrace功能您提取sourcemapped stacktrace如下並記錄它：

const logStackTrace = async (error) => { 
    page.evaluate(stack => new Promise(resolve => 
    window.sourceMappedStackTrace.mapStackTrace(stack, (newStack) => { 
     resolve(newStack); 
    }) 
), typeof error.stack === 'string' ? error.stack : error.stack.join('\n')) 
    .then((result) => { 
    console.log('ERROR:', error.message, result[0]); 
    }); 
}; 

它只爲我準確地映射了堆棧的第一行。仍然無限更有用。