Skip to content

Commit

Permalink
fix: source map sources (#1741)
Browse files Browse the repository at this point in the history
* fix: source map sources

* test: Fix build image

* docs: Adding changset
  • Loading branch information
rschristian committed Nov 18, 2022
1 parent 099876b commit 82662af
Show file tree
Hide file tree
Showing 6 changed files with 96 additions and 62 deletions.
5 changes: 5 additions & 0 deletions .changeset/wet-otters-check.md
@@ -0,0 +1,5 @@
---
'preact-cli': patch
---

Fix for source maps containing incorrect paths
1 change: 1 addition & 0 deletions packages/cli/package.json
Expand Up @@ -92,6 +92,7 @@
"sade": "^1.8.1",
"size-plugin": "^3.0.0",
"source-map": "^0.7.2",
"source-map-loader": "^1.1.1",
"stack-trace": "0.0.10",
"style-loader": "^2.0.0",
"terser-webpack-plugin": "^4.2.3",
Expand Down
102 changes: 54 additions & 48 deletions packages/cli/src/lib/webpack/prerender.js
Expand Up @@ -45,63 +45,69 @@ async function handlePrerenderError(err, env, stack, entry) {
let errorMessage = err.toString();
let isReferenceError = errorMessage.startsWith('ReferenceError');
let methodName = stack.getMethodName();
let sourceMapContent, position, sourcePath, sourceLines, sourceCodeHighlight;

try {
sourceMapContent = JSON.parse(readFileSync(`${entry}.map`, 'utf-8'));
} catch (err) {
process.stderr.write(red(`Unable to read sourcemap: ${entry}.map\n`));
}
process.stderr.write('\n');
process.stderr.write(red(`\n${errorMessage}\n`));

if (sourceMapContent) {
await SourceMapConsumer.with(sourceMapContent, null, consumer => {
position = consumer.originalPositionFor({
line: stack.getLineNumber(),
column: stack.getColumnNumber(),
// If a methodName exists, it's likely user code
if (methodName) {
let sourceMapContent,
position,
sourcePath,
sourceLines,
sourceCodeHighlight;
try {
sourceMapContent = JSON.parse(readFileSync(`${entry}.map`, 'utf-8'));
} catch (err) {
process.stderr.write(red(`\n\nUnable to read sourcemap: ${entry}.map\n`));
}

if (sourceMapContent) {
await SourceMapConsumer.with(sourceMapContent, null, consumer => {
position = consumer.originalPositionFor({
line: stack.getLineNumber(),
column: stack.getColumnNumber(),
});
});
});

if (position.source) {
position.source = position.source
.replace('webpack://', '.')
.replace(/^.*~\/((?:@[^/]+\/)?[^/]+)/, (s, name) =>
require
.resolve(name)
.replace(/^(.*?\/node_modules\/(@[^/]+\/)?[^/]+)(\/.*)$/, '$1')
);

sourcePath = resolve(env.src, position.source);
sourceLines;
try {
sourceLines = readFileSync(sourcePath, 'utf-8').split('\n');
} catch (err) {

if (position.source) {
position.source = position.source
.replace('webpack://', '.')
.replace(/^.*~\/((?:@[^/]+\/)?[^/]+)/, (s, name) =>
require
.resolve(name)
.replace(/^(.*?\/node_modules\/(@[^/]+\/)?[^/]+)(\/.*)$/, '$1')
);

sourcePath = resolve(env.src, position.source);
sourceLines;
try {
sourceLines = readFileSync(
require.resolve(position.source),
'utf-8'
).split('\n');
sourceLines = readFileSync(sourcePath, 'utf-8').split('\n');
} catch (err) {
process.stderr.write(red(`Unable to read file: ${sourcePath}\n`));
try {
sourceLines = readFileSync(
require.resolve(position.source),
'utf-8'
).split('\n');
} catch (err) {
process.stderr.write(
red(`\n\nUnable to read file: ${sourcePath}\n`)
);
}
}
// process.stderr.write(red(`Unable to read file: ${sourcePath}\n`));
sourceCodeHighlight = '';
}
sourceCodeHighlight = '';
}

if (sourceLines) {
for (var i = -4; i <= 4; i++) {
let color = i === 0 ? red : yellow;
let line = position.line + i;
let sourceLine = sourceLines[line - 1];
sourceCodeHighlight += sourceLine ? `${color(sourceLine)}\n` : '';
if (sourceLines) {
for (var i = -4; i <= 4; i++) {
let color = i === 0 ? red : yellow;
let line = position.line + i;
let sourceLine = sourceLines[line - 1];
sourceCodeHighlight += sourceLine ? `${color(sourceLine)}\n` : '';
}
}
}
}

process.stderr.write('\n');
process.stderr.write(red(`${errorMessage}\n`));
// check if we have methodName (ie, the error originated in user code)
if (methodName) {
process.stderr.write(`method: ${methodName}\n`);
if (sourceMapContent & sourceCodeHighlight) {
process.stderr.write(
Expand All @@ -119,11 +125,11 @@ async function handlePrerenderError(err, env, stack, entry) {
} else {
process.stderr.write(
yellow(
'Cannot determine error position. This most likely means it originated in node_modules.'
'Cannot determine error position. This most likely means it originated in node_modules.\n\n'
)
);
process.stderr.write('\n\n');
}

process.stderr.write(
`This ${
isReferenceError ? 'is most likely' : 'could be'
Expand Down
17 changes: 11 additions & 6 deletions packages/cli/src/lib/webpack/webpack-base-config.js
Expand Up @@ -172,12 +172,17 @@ module.exports = function createBaseConfig(env) {
test: /\.m?[jt]sx?$/,
resolve: { mainFields: ['module', 'jsnext:main', 'browser', 'main'] },
type: 'javascript/auto',
loader: require.resolve('babel-loader'),
options: Object.assign(
{ babelrc: false },
createBabelConfig(env, { browsers }),
babelrc // intentionally overwrite our settings
),
use: [
{
loader: require.resolve('babel-loader'),
options: Object.assign(
{ babelrc: false },
createBabelConfig(env, { browsers }),
babelrc // intentionally overwrite our settings
),
},
require.resolve('source-map-loader'),
],
},
{
// LESS
Expand Down
14 changes: 7 additions & 7 deletions packages/cli/tests/images/build.js
Expand Up @@ -14,23 +14,23 @@ exports.default = Object.assign({}, common, {
'ssr-build/ssr-bundle.89e23.css': 1281,
'ssr-build/ssr-bundle.89e23.css.map': 2070,
'ssr-build/ssr-bundle.js': 11937,
'ssr-build/ssr-bundle.js.map': 32557,
'ssr-build/ssr-bundle.js.map': 42893,
'ssr-build/asset-manifest.json': 178,
'bundle.259c5.css': 901,
'bundle.fcca3.js': 21429,
'bundle.fcca3.js.map': 111801,
'bundle.f79fb.js': 21429,
'bundle.f79fb.js.map': 111801,
'favicon.ico': 15086,
'index.html': 2034,
'manifest.json': 455,
'preact_prerender_data.json': 11,
'push-manifest.json': 450,
'asset-manifest.json': 1074,
'route-home.chunk.df08e.css': 58,
'route-home.chunk.85051.js': 327,
'route-home.chunk.85051.js.map': 483,
'route-home.chunk.f5172.js': 327,
'route-home.chunk.f5172.js.map': 483,
'route-profile.chunk.7bcae.css': 61,
'route-profile.chunk.6d480.js': 3514,
'route-profile.chunk.6d480.js.map': 15454,
'route-profile.chunk.03a58.js': 3514,
'route-profile.chunk.03a58.js.map': 15454,
});
exports['default-esm'] = Object.assign({}, exports.default, {
'bundle.*.esm.js': 21135,
Expand Down
19 changes: 18 additions & 1 deletion yarn.lock
Expand Up @@ -2055,6 +2055,11 @@ abab@^2.0.0:
resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.5.tgz#c0b678fb32d60fc1219c784d6a826fe385aeb79a"
integrity sha512-9IK9EadsbHo6jLWIpxpR6pL0sazTXV6+SQv25ZB+F7Bj9mJNaOc4nCRabwd5M/JwmUa8idz6Eci6eKfJryPs6Q==

abab@^2.0.5:
version "2.0.6"
resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.6.tgz#41b80f2c871d19686216b82309231cfd3cb3d291"
integrity sha512-j2afSsaIENvHZN2B8GOpF566vZ5WVk5opAiMTvWgaQT8DkbOqsTfvNAvHoRGU2zzP8cPoqys+xHTRDWW8L+/BA==

abbrev@1, abbrev@~1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
Expand Down Expand Up @@ -11932,6 +11937,18 @@ source-map-js@^1.0.2:
resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==

source-map-loader@^1.1.1:
version "1.1.3"
resolved "https://registry.yarnpkg.com/source-map-loader/-/source-map-loader-1.1.3.tgz#7dbc2fe7ea09d3e43c51fd9fc478b7f016c1f820"
integrity sha512-6YHeF+XzDOrT/ycFJNI53cgEsp/tHTMl37hi7uVyqFAlTXW109JazaQCkbc+jjoL2637qkH1amLi+JzrIpt5lA==
dependencies:
abab "^2.0.5"
iconv-lite "^0.6.2"
loader-utils "^2.0.0"
schema-utils "^3.0.0"
source-map "^0.6.1"
whatwg-mimetype "^2.3.0"

source-map-resolve@^0.5.0, source-map-resolve@^0.5.2:
version "0.5.3"
resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.5.3.tgz#190866bece7553e1f8f267a2ee82c606b5509a1a"
Expand Down Expand Up @@ -13528,7 +13545,7 @@ whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3, whatwg-encoding@^1.0.5:
dependencies:
iconv-lite "0.4.24"

whatwg-mimetype@^2.1.0, whatwg-mimetype@^2.2.0:
whatwg-mimetype@^2.1.0, whatwg-mimetype@^2.2.0, whatwg-mimetype@^2.3.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz#3d4b1e0312d2079879f826aff18dbeeca5960fbf"
integrity sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g==
Expand Down

0 comments on commit 82662af

Please sign in to comment.