diff --git a/packages/cli/lib/lib/babel-config.js b/packages/cli/lib/lib/babel-config.js index b9a60a9ee..f49c98eaf 100644 --- a/packages/cli/lib/lib/babel-config.js +++ b/packages/cli/lib/lib/babel-config.js @@ -25,7 +25,10 @@ module.exports = function(env, options = {}) { require.resolve('@babel/plugin-syntax-dynamic-import'), require.resolve('@babel/plugin-transform-object-assign'), [require.resolve('@babel/plugin-proposal-decorators'), { legacy: true }], - [require.resolve('@babel/plugin-proposal-class-properties'), { loose: true }], + [ + require.resolve('@babel/plugin-proposal-class-properties'), + { loose: true }, + ], require.resolve('@babel/plugin-proposal-object-rest-spread'), isProd && require.resolve('babel-plugin-transform-react-remove-prop-types'), diff --git a/packages/cli/lib/lib/webpack/prerender.js b/packages/cli/lib/lib/webpack/prerender.js index c7ae75680..63974fb85 100644 --- a/packages/cli/lib/lib/webpack/prerender.js +++ b/packages/cli/lib/lib/webpack/prerender.js @@ -1,10 +1,11 @@ -const { red, gray } = require('kleur'); +const { red } = require('kleur'); const { resolve } = require('path'); const { readFileSync } = require('fs'); const stackTrace = require('stack-trace'); const { SourceMapConsumer } = require('source-map'); const { error, info } = require('../../util'); const outdent = require('outdent'); +const { codeFrameColumns } = require('@babel/code-frame'); module.exports = function prerender(env, params) { params = params || {}; @@ -95,7 +96,7 @@ async function handlePrerenderError(err, env, stack, entry) { } if (position) { - info(position.source); + info(JSON.stringify(position)); position.source = position.source .replace('webpack://', '.') .replace(/^.*~\/((?:@[^/]+\/)?[^/]+)/, (s, name) => @@ -103,7 +104,6 @@ async function handlePrerenderError(err, env, stack, entry) { .resolve(name) .replace(/^(.*?\/node_modules\/(@[^/]+\/)?[^/]+)(\/.*)$/, '$1') ); - info(position.source); } else { position = { source: stack.getFileName(), @@ -114,24 +114,13 @@ async function handlePrerenderError(err, env, stack, entry) { const sourceLines = getLines(env, position); - let sourceCodeHighlight = ''; - if (sourceLines) { - const lnrl = position.line.toString().length + 2; - const line = position.line; - const un = undefined; - - const pad = l => - (l === undefined ? '' : (line + l || '') + '').padStart(lnrl); - - sourceCodeHighlight = gray(outdent` - ${pad(-2)} | ${sourceLines[line - 3] || ''} - ${pad(-1)} | ${sourceLines[line - 2] || ''} - ${pad(-0)} | ${sourceLines[line - 1] || ''} - ${pad(un)} | ${red('^'.padStart(position.column + 1))} - ${pad(+1)} | ${sourceLines[line + 0] || ''} - ${pad(+2)} | ${sourceLines[line + 1] || ''} - `); - } + let sourceCodeHighlight = sourceLines + ? codeFrameColumns( + sourceLines.join('\n'), + { start: { line: position.line, column: position.column } }, + { highlightCode: true } + ) + : ''; const stderr = process.stderr.write.bind(process.stderr); diff --git a/packages/cli/package.json b/packages/cli/package.json index 829c5653a..a2aed0f3e 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -64,6 +64,7 @@ "preact-render-to-string": "*" }, "dependencies": { + "@babel/code-frame": "^7.5.5", "@babel/core": "^7.4.5", "@babel/plugin-proposal-class-properties": "^7.4.4", "@babel/plugin-proposal-decorators": "^7.4.4", diff --git a/yarn.lock b/yarn.lock index 63172bde4..fec1342bd 100644 --- a/yarn.lock +++ b/yarn.lock @@ -44,6 +44,13 @@ dependencies: "@babel/highlight" "^7.0.0" +"@babel/code-frame@^7.5.5": + version "7.5.5" + resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.5.5.tgz#bc0782f6d69f7b7d49531219699b988f669a8f9d" + integrity sha512-27d4lZoomVyo51VegxI20xZPuSHusqbQag/ztrBC7wegWoQ1nLREPVSKSW8byhTlzTKyNE4ifaTA6lCp7JjpFw== + dependencies: + "@babel/highlight" "^7.0.0" + "@babel/core@^7.1.0", "@babel/core@^7.4.0", "@babel/core@^7.4.5": version "7.5.4" resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.5.4.tgz#4c32df7ad5a58e9ea27ad025c11276324e0b4ddd" @@ -10216,7 +10223,7 @@ postcss-discard-overridden@^4.0.1: dependencies: postcss "^7.0.0" -postcss-load-config@^2.0.0: +postcss-load-config@^2.0.0, postcss-load-config@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-2.1.0.tgz#c84d692b7bb7b41ddced94ee62e8ab31b417b003" integrity sha512-4pV3JJVPLd5+RueiVVB+gFOAa7GWc25XQcMp86Zexzke69mKf6Nx9LRcQywdz7yZI9n1udOxmLuAwTBypypF8Q==