Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

format UglifyJs error #2650

Merged
merged 8 commits into from
Aug 2, 2017
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 11 additions & 1 deletion packages/react-dev-utils/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -187,7 +187,7 @@ measureFileSizesBeforeBuild(buildFolder).then(previousFileSizes => {
});
```

#### `formatWebpackMessages({errors: Array<string>, warnings: Array<string>}): {errors: Array<string>, warnings: Array<string>}`
#### `formatwebpackmessages({errors: Array<string>, warnings: Array<string>}): {errors: Array<string>, warnings: Array<string>}`
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whoops


Extracts and prettifies warning and error messages from webpack [stats](https://github.com/webpack/docs/wiki/node.js-api#stats) object.

Expand Down Expand Up @@ -220,6 +220,16 @@ compiler.plugin('done', function(stats) {
});
```

#### `formatBuildError(error: Object): String`

Prettify some known build errors.
Pass an Error object to log a prettified error message in the console
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: missing period at end


```

```


#### `getProcessForPort(port: number): string`

Finds the currently running process on `port`.
Expand Down
40 changes: 40 additions & 0 deletions packages/react-dev-utils/formatBuildError.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/

'use strict';

const get = require('lodash/get');
const chalk = require('chalk');

module.exports = function formatBuildError(err) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm really not fond of this name since it does more than just formatting the error message.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

any suggestion? haven't got anything better pops up...

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How about printBuildError?

const message = get(err, 'message');

// Add more helpful message for UglifyJs error
if (typeof message === 'string' && message.indexOf('from UglifyJs') !== -1) {
try {
console.log(
'Failed to minify the code from \n\n',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How about a colon?

chalk.yellow(
err.stack.split('\n')[1].split('[')[1].split('][')[0].replace(']', '')
),
'\n'
);
} catch (e) {
console.log('Failed to minify the code.', err);
}
console.log(
'Please check your dependencies for any untranspiled es6 code and raise an issue with \n' +
'the author. \n' +
'\nIf you need to use the module right now, you can try placing the source in ./src \n' +
'and we will transpile it for you.'
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not a huge fan of this message. Can we add an entry for this into the User Guide and link to it instead?

);
} else {
console.log((message || err) + '\n');
}
};
3 changes: 2 additions & 1 deletion packages/react-dev-utils/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -18,13 +18,14 @@
"crossSpawn.js",
"eslintFormatter.js",
"FileSizeReporter.js",
"formatBuildError.js",
"formatWebpackMessages.js",
"getProcessForPort.js",
"inquirer.js",
"InterpolateHtmlPlugin.js",
"launchEditor.js",
"noopServiceWorkerMiddleware.js",
"ModuleScopePlugin.js",
"noopServiceWorkerMiddleware.js",
"openBrowser.js",
"openChrome.applescript",
"printHostingInstructions.js",
Expand Down
31 changes: 2 additions & 29 deletions packages/react-scripts/scripts/build.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ const checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
const printHostingInstructions = require('react-dev-utils/printHostingInstructions');
const FileSizeReporter = require('react-dev-utils/FileSizeReporter');
const get = require('lodash/get');
const formatBuildError = require('react-dev-utils/formatBuildError');

const measureFileSizesBeforeBuild = FileSizeReporter.measureFileSizesBeforeBuild;
const printFileSizesAfterBuild = FileSizeReporter.printFileSizesAfterBuild;
Expand Down Expand Up @@ -94,7 +94,7 @@ measureFileSizesBeforeBuild(paths.appBuild)
},
err => {
console.log(chalk.red('Failed to compile.\n'));
formatError(err);
formatBuildError(err);
process.exit(1);
}
);
Expand Down Expand Up @@ -142,30 +142,3 @@ function copyPublicFolder() {
filter: file => file !== paths.appHtml,
});
}

function formatError(err) {
const message = get(err, 'message');

// Add more helpful message for UglifyJs error
if (typeof message === 'string' && message.indexOf('from UglifyJs') !== -1) {
try {
console.log(
'UglifyJs could not parse the code from \n\n',
chalk.yellow(
err.stack.split('\n')[1].split('[')[1].split('][')[0].replace(']', '')
),
'\n'
);
} catch (e) {
console.log('UglifyJs could not process the code.', err);
}
console.log(
'Please check your dependencies for any untranspiled es6 code and raise an issue with \n' +
'the author. \n' +
'\nIf you need to use the module right now, you can try placing the source in ./src \n' +
'and we will transpile it for you.'
);
} else {
console.log((message || err) + '\n');
}
}