Description
Feature request
What is the expected behavior?
Given:
./package.json
(all latest versions):
{
"dependencies": {
"source-map-support": "^0.5.13",
"webpack": "^4.39.2",
"webpack-cli": "^3.3.7"
}
}
./webpack.config.js
:
const pathHelpers = require("path");
// Expect `__dirname` to be `/config/target/`.
const ROOT_PATH = __dirname;
const TARGET_PATH = pathHelpers.join(ROOT_PATH, "./target/");
const SRC_PATH = pathHelpers.join(ROOT_PATH, "./src/");
const ENTRY_FILENAME = "index.js";
const OUTPUT_FILENAME = "index.js";
const config = {
mode: "development",
target: "node",
devtool: "source-map",
entry: pathHelpers.resolve(SRC_PATH, ENTRY_FILENAME),
output: {
path: TARGET_PATH,
filename: OUTPUT_FILENAME
}
};
module.exports = config;
./src/index.js
(entry file):
const fn = () => {
throw new Error("foo");
};
fn();
When running:
webpack
node --require source-map-support/register ./target/index.js
The error stack trace looks like this:
/Users/oliverash/Development/webpack-source-map-test/target/webpack:/src/index.js:2
throw new Error('foo')
^
Error: foo
at fn (/Users/oliverash/Development/webpack-source-map-test/target/webpack:/src/index.js:2:1)
Observe how the path to the source file where the error originated is resolved against the source map, but only partially so. This makes it difficult to interact with the stack trace. E.g. in iTerm, it's usually possibly to Command + click a path to open it, but this is not possible here because the path is invalid. Ideally the original file path would be shown.
IIUC, we can fix this using devtoolModuleFilenameTemplate
/moduleFilenameTemplate
:
output: {
path: TARGET_PATH,
filename: OUTPUT_FILENAME,
+ devtoolModuleFilenameTemplate: "[absolute-resource-path]"
}
Now the error stack trace looks like this:
/Users/oliverash/Development/webpack-source-map-test/src/index.js:2
throw new Error('foo')
^
Error: foo
at fn (/Users/oliverash/Development/webpack-source-map-test/src/index.js:2:1)
However, I would like to suggest that we make this behaviour the default when using webpack to build code that will be ran by Node (i.e. when target: 'node'
as in this example).
Secondly, when using eval-source-map
instead of source-map
(used above), devtoolModuleFilenameTemplate
does not help. The error stack trace always looks like this:
webpack-internal:///./src/index.js:2
throw new Error('foo')
^
Error: foo
at fn (webpack-internal:///./src/index.js:2:11)
Again, this path is difficult to interact with—ideally the original file path would be shown. What is the recommended fix in this case?
Are you willing to work on this yourself?
yes