Skip to content

Commit 82662af

Browse files
authored
fix: source map sources (#1741)
* fix: source map sources * test: Fix build image * docs: Adding changset
1 parent 099876b commit 82662af

File tree

6 files changed

+96
-62
lines changed

6 files changed

+96
-62
lines changed

.changeset/wet-otters-check.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'preact-cli': patch
3+
---
4+
5+
Fix for source maps containing incorrect paths

packages/cli/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -92,6 +92,7 @@
9292
"sade": "^1.8.1",
9393
"size-plugin": "^3.0.0",
9494
"source-map": "^0.7.2",
95+
"source-map-loader": "^1.1.1",
9596
"stack-trace": "0.0.10",
9697
"style-loader": "^2.0.0",
9798
"terser-webpack-plugin": "^4.2.3",

packages/cli/src/lib/webpack/prerender.js

Lines changed: 54 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -45,63 +45,69 @@ async function handlePrerenderError(err, env, stack, entry) {
4545
let errorMessage = err.toString();
4646
let isReferenceError = errorMessage.startsWith('ReferenceError');
4747
let methodName = stack.getMethodName();
48-
let sourceMapContent, position, sourcePath, sourceLines, sourceCodeHighlight;
4948

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

56-
if (sourceMapContent) {
57-
await SourceMapConsumer.with(sourceMapContent, null, consumer => {
58-
position = consumer.originalPositionFor({
59-
line: stack.getLineNumber(),
60-
column: stack.getColumnNumber(),
52+
// If a methodName exists, it's likely user code
53+
if (methodName) {
54+
let sourceMapContent,
55+
position,
56+
sourcePath,
57+
sourceLines,
58+
sourceCodeHighlight;
59+
try {
60+
sourceMapContent = JSON.parse(readFileSync(`${entry}.map`, 'utf-8'));
61+
} catch (err) {
62+
process.stderr.write(red(`\n\nUnable to read sourcemap: ${entry}.map\n`));
63+
}
64+
65+
if (sourceMapContent) {
66+
await SourceMapConsumer.with(sourceMapContent, null, consumer => {
67+
position = consumer.originalPositionFor({
68+
line: stack.getLineNumber(),
69+
column: stack.getColumnNumber(),
70+
});
6171
});
62-
});
63-
64-
if (position.source) {
65-
position.source = position.source
66-
.replace('webpack://', '.')
67-
.replace(/^.*~\/((?:@[^/]+\/)?[^/]+)/, (s, name) =>
68-
require
69-
.resolve(name)
70-
.replace(/^(.*?\/node_modules\/(@[^/]+\/)?[^/]+)(\/.*)$/, '$1')
71-
);
72-
73-
sourcePath = resolve(env.src, position.source);
74-
sourceLines;
75-
try {
76-
sourceLines = readFileSync(sourcePath, 'utf-8').split('\n');
77-
} catch (err) {
72+
73+
if (position.source) {
74+
position.source = position.source
75+
.replace('webpack://', '.')
76+
.replace(/^.*~\/((?:@[^/]+\/)?[^/]+)/, (s, name) =>
77+
require
78+
.resolve(name)
79+
.replace(/^(.*?\/node_modules\/(@[^/]+\/)?[^/]+)(\/.*)$/, '$1')
80+
);
81+
82+
sourcePath = resolve(env.src, position.source);
83+
sourceLines;
7884
try {
79-
sourceLines = readFileSync(
80-
require.resolve(position.source),
81-
'utf-8'
82-
).split('\n');
85+
sourceLines = readFileSync(sourcePath, 'utf-8').split('\n');
8386
} catch (err) {
84-
process.stderr.write(red(`Unable to read file: ${sourcePath}\n`));
87+
try {
88+
sourceLines = readFileSync(
89+
require.resolve(position.source),
90+
'utf-8'
91+
).split('\n');
92+
} catch (err) {
93+
process.stderr.write(
94+
red(`\n\nUnable to read file: ${sourcePath}\n`)
95+
);
96+
}
8597
}
86-
// process.stderr.write(red(`Unable to read file: ${sourcePath}\n`));
98+
sourceCodeHighlight = '';
8799
}
88-
sourceCodeHighlight = '';
89-
}
90100

91-
if (sourceLines) {
92-
for (var i = -4; i <= 4; i++) {
93-
let color = i === 0 ? red : yellow;
94-
let line = position.line + i;
95-
let sourceLine = sourceLines[line - 1];
96-
sourceCodeHighlight += sourceLine ? `${color(sourceLine)}\n` : '';
101+
if (sourceLines) {
102+
for (var i = -4; i <= 4; i++) {
103+
let color = i === 0 ? red : yellow;
104+
let line = position.line + i;
105+
let sourceLine = sourceLines[line - 1];
106+
sourceCodeHighlight += sourceLine ? `${color(sourceLine)}\n` : '';
107+
}
97108
}
98109
}
99-
}
100110

101-
process.stderr.write('\n');
102-
process.stderr.write(red(`${errorMessage}\n`));
103-
// check if we have methodName (ie, the error originated in user code)
104-
if (methodName) {
105111
process.stderr.write(`method: ${methodName}\n`);
106112
if (sourceMapContent & sourceCodeHighlight) {
107113
process.stderr.write(
@@ -119,11 +125,11 @@ async function handlePrerenderError(err, env, stack, entry) {
119125
} else {
120126
process.stderr.write(
121127
yellow(
122-
'Cannot determine error position. This most likely means it originated in node_modules.'
128+
'Cannot determine error position. This most likely means it originated in node_modules.\n\n'
123129
)
124130
);
125-
process.stderr.write('\n\n');
126131
}
132+
127133
process.stderr.write(
128134
`This ${
129135
isReferenceError ? 'is most likely' : 'could be'

packages/cli/src/lib/webpack/webpack-base-config.js

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -172,12 +172,17 @@ module.exports = function createBaseConfig(env) {
172172
test: /\.m?[jt]sx?$/,
173173
resolve: { mainFields: ['module', 'jsnext:main', 'browser', 'main'] },
174174
type: 'javascript/auto',
175-
loader: require.resolve('babel-loader'),
176-
options: Object.assign(
177-
{ babelrc: false },
178-
createBabelConfig(env, { browsers }),
179-
babelrc // intentionally overwrite our settings
180-
),
175+
use: [
176+
{
177+
loader: require.resolve('babel-loader'),
178+
options: Object.assign(
179+
{ babelrc: false },
180+
createBabelConfig(env, { browsers }),
181+
babelrc // intentionally overwrite our settings
182+
),
183+
},
184+
require.resolve('source-map-loader'),
185+
],
181186
},
182187
{
183188
// LESS

packages/cli/tests/images/build.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -14,23 +14,23 @@ exports.default = Object.assign({}, common, {
1414
'ssr-build/ssr-bundle.89e23.css': 1281,
1515
'ssr-build/ssr-bundle.89e23.css.map': 2070,
1616
'ssr-build/ssr-bundle.js': 11937,
17-
'ssr-build/ssr-bundle.js.map': 32557,
17+
'ssr-build/ssr-bundle.js.map': 42893,
1818
'ssr-build/asset-manifest.json': 178,
1919
'bundle.259c5.css': 901,
20-
'bundle.fcca3.js': 21429,
21-
'bundle.fcca3.js.map': 111801,
20+
'bundle.f79fb.js': 21429,
21+
'bundle.f79fb.js.map': 111801,
2222
'favicon.ico': 15086,
2323
'index.html': 2034,
2424
'manifest.json': 455,
2525
'preact_prerender_data.json': 11,
2626
'push-manifest.json': 450,
2727
'asset-manifest.json': 1074,
2828
'route-home.chunk.df08e.css': 58,
29-
'route-home.chunk.85051.js': 327,
30-
'route-home.chunk.85051.js.map': 483,
29+
'route-home.chunk.f5172.js': 327,
30+
'route-home.chunk.f5172.js.map': 483,
3131
'route-profile.chunk.7bcae.css': 61,
32-
'route-profile.chunk.6d480.js': 3514,
33-
'route-profile.chunk.6d480.js.map': 15454,
32+
'route-profile.chunk.03a58.js': 3514,
33+
'route-profile.chunk.03a58.js.map': 15454,
3434
});
3535
exports['default-esm'] = Object.assign({}, exports.default, {
3636
'bundle.*.esm.js': 21135,

yarn.lock

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2055,6 +2055,11 @@ abab@^2.0.0:
20552055
resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.5.tgz#c0b678fb32d60fc1219c784d6a826fe385aeb79a"
20562056
integrity sha512-9IK9EadsbHo6jLWIpxpR6pL0sazTXV6+SQv25ZB+F7Bj9mJNaOc4nCRabwd5M/JwmUa8idz6Eci6eKfJryPs6Q==
20572057

2058+
abab@^2.0.5:
2059+
version "2.0.6"
2060+
resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.6.tgz#41b80f2c871d19686216b82309231cfd3cb3d291"
2061+
integrity sha512-j2afSsaIENvHZN2B8GOpF566vZ5WVk5opAiMTvWgaQT8DkbOqsTfvNAvHoRGU2zzP8cPoqys+xHTRDWW8L+/BA==
2062+
20582063
abbrev@1, abbrev@~1.1.1:
20592064
version "1.1.1"
20602065
resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
@@ -11932,6 +11937,18 @@ source-map-js@^1.0.2:
1193211937
resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
1193311938
integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
1193411939

11940+
source-map-loader@^1.1.1:
11941+
version "1.1.3"
11942+
resolved "https://registry.yarnpkg.com/source-map-loader/-/source-map-loader-1.1.3.tgz#7dbc2fe7ea09d3e43c51fd9fc478b7f016c1f820"
11943+
integrity sha512-6YHeF+XzDOrT/ycFJNI53cgEsp/tHTMl37hi7uVyqFAlTXW109JazaQCkbc+jjoL2637qkH1amLi+JzrIpt5lA==
11944+
dependencies:
11945+
abab "^2.0.5"
11946+
iconv-lite "^0.6.2"
11947+
loader-utils "^2.0.0"
11948+
schema-utils "^3.0.0"
11949+
source-map "^0.6.1"
11950+
whatwg-mimetype "^2.3.0"
11951+
1193511952
source-map-resolve@^0.5.0, source-map-resolve@^0.5.2:
1193611953
version "0.5.3"
1193711954
resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.5.3.tgz#190866bece7553e1f8f267a2ee82c606b5509a1a"
@@ -13528,7 +13545,7 @@ whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3, whatwg-encoding@^1.0.5:
1352813545
dependencies:
1352913546
iconv-lite "0.4.24"
1353013547

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

0 commit comments

Comments
 (0)