diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0e2c349eb22..b8230403216 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,114 @@
+## 1.0.11 (2017-08-09)
+
+#### :bug: Bug Fix
+* `create-react-app`
+ * [#2884](https://github.com/facebookincubator/create-react-app/pull/2884) Improve offline heuristic for proxied environments. ([@bsyk](https://github.com/bsyk))
+
+ When a Yarn proxy is set, we will check its connectivity if we cannot reach Yarn's registry. This is often the case when DNS lookups must be made through the proxy.
+
+ * [#2853](https://github.com/facebookincubator/create-react-app/pull/2853) Allow use of scoped packages with a pinned version. ([@wileybenet](https://github.com/wileybenet))
+* `react-dev-utils`
+ * [#2796](https://github.com/facebookincubator/create-react-app/pull/2796) Properly escape HTML tags in error overlay. ([@ccloli](https://github.com/ccloli))
+
+ Elements printed in their entirety would sometimes render as HTML. This should no longer happen and should properly render as text.
+
+* `react-dev-utils`, `react-scripts`
+ * [#2834](https://github.com/facebookincubator/create-react-app/pull/2834) Make `formatWebpackMessages` return all messages ([@onigoetz](https://github.com/onigoetz))
+* `react-scripts`
+ * [#2806](https://github.com/facebookincubator/create-react-app/pull/2806) Fix SockJS version compatibility. ([@christianbundy](https://github.com/christianbundy))
+ * [#2738](https://github.com/facebookincubator/create-react-app/pull/2738) Fix Jest `node` file resolution. ([@mostafah](https://github.com/mostafah))
+
+#### :nail_care: Enhancement
+* `react-scripts`
+ * [#2818](https://github.com/facebookincubator/create-react-app/pull/2818) Allow sourcemaps to be disabled. ([@viankakrisna](https://github.com/viankakrisna))
+
+ As applications grow more complex, it is possible webpack may run out of memory while generating source maps. They may now be disabled by setting `GENERATE_SOURCEMAP=false`.
+
+ * [#2913](https://github.com/facebookincubator/create-react-app/pull/2913) Allow flags to be passed to node when running `react-scripts`. ([@koistya](https://github.com/koistya))
+ * [#2574](https://github.com/facebookincubator/create-react-app/pull/2574) Upgrade to `webpack@3`. ([@themre](https://github.com/themre))
+ * [#2747](https://github.com/facebookincubator/create-react-app/pull/2747) Simplify webpack configuration using `Rule.oneOf`. ([@Furizaa](https://github.com/Furizaa))
+* `react-dev-utils`, `react-scripts`
+ * [#2468](https://github.com/facebookincubator/create-react-app/pull/2468) Allow importing `package.json`. ([@iamdoron](https://github.com/iamdoron))
+ * [#2650](https://github.com/facebookincubator/create-react-app/pull/2650) Make UglifyJS error friendlier. ([@viankakrisna](https://github.com/viankakrisna))
+* `create-react-app`
+ * [#2785](https://github.com/facebookincubator/create-react-app/pull/2785) Change error wording and list conflicting files when initializing app. ([@OwenFlood](https://github.com/OwenFlood))
+* `react-dev-utils`
+ * [#2761](https://github.com/facebookincubator/create-react-app/pull/2761) Don't prompt to install serve if already installed. ([@OwenFlood](https://github.com/OwenFlood))
+ * [#2754](https://github.com/facebookincubator/create-react-app/pull/2754) Auto-detect JetBrains IDEs. ([@danrr](https://github.com/danrr))
+ * [#2740](https://github.com/facebookincubator/create-react-app/pull/2740) Support PyCharm in `launchEditor`. ([@danrr](https://github.com/danrr))
+ * [#2723](https://github.com/facebookincubator/create-react-app/pull/2723) Reorder vim arguments in `launchEditor` so `--remote` works. ([@trygveaa](https://github.com/trygveaa))
+* `eslint-config-react-app`, `react-scripts`
+ * [#2735](https://github.com/facebookincubator/create-react-app/pull/2735) Upgrade to `eslint@4`. ([@trungdq88](https://github.com/trungdq88))
+* `eslint-config-react-app`
+ * [#2701](https://github.com/facebookincubator/create-react-app/pull/2701) Set `allowTaggedTemplates` to true (eslint). ([@denkristoffer](https://github.com/denkristoffer))
+
+#### :memo: Documentation
+* Other
+ * [#2728](https://github.com/facebookincubator/create-react-app/pull/2728) Add Electrode to alternatives. ([@animesh10](https://github.com/animesh10))
+ * [#2788](https://github.com/facebookincubator/create-react-app/pull/2788) Update link for motion. ([@viankakrisna](https://github.com/viankakrisna))
+ * [#2697](https://github.com/facebookincubator/create-react-app/pull/2697) Fix env list ordering. ([@alexeyraspopov](https://github.com/alexeyraspopov))
+* `react-dev-utils`
+ * [#2798](https://github.com/facebookincubator/create-react-app/pull/2798) Update note about `webpackHotDevClient` support. ([@ForbesLindesay](https://github.com/ForbesLindesay))
+* `react-scripts`
+ * [#2822](https://github.com/facebookincubator/create-react-app/pull/2822) Add explicit "Opting Out of Caching" header. ([@gaearon](https://github.com/gaearon))
+ * [#2725](https://github.com/facebookincubator/create-react-app/pull/2725) Fixed typo. ([@zeel](https://github.com/zeel))
+ * [#2668](https://github.com/facebookincubator/create-react-app/pull/2668) Document `basename` feature in `react-router`. ([@viankakrisna](https://github.com/viankakrisna))
+ * [#2719](https://github.com/facebookincubator/create-react-app/pull/2719) Remove Windows note for `source-map-explorer`. ([@hodanny](https://github.com/hodanny))
+* `babel-preset-react-app`
+ * [#2732](https://github.com/facebookincubator/create-react-app/pull/2732) Update link to issue blocking JSX hoisting. ([@ForbesLindesay](https://github.com/ForbesLindesay))
+
+#### :house: Internal
+* `create-react-app`, `eslint-config-react-app`, `react-dev-utils`, `react-error-overlay`, `react-scripts`
+ * [#2923](https://github.com/facebookincubator/create-react-app/pull/2923) Update deps. ([@Timer](https://github.com/Timer))
+* `eslint-config-react-app`
+ * [#2718](https://github.com/facebookincubator/create-react-app/pull/2718) Re-enable flowtype warning. ([@oskarkook](https://github.com/oskarkook))
+* Other
+ * [#2700](https://github.com/facebookincubator/create-react-app/pull/2700) Unstage `yarn.lock` pre-commit. ([@jdcrensh](https://github.com/jdcrensh))
+* `react-scripts`
+ * [#2873](https://github.com/facebookincubator/create-react-app/pull/2873) Use template strings. ([@monkindey](https://github.com/monkindey))
+
+#### Committers: 26
+- 864907600cc ([ccloli](https://github.com/ccloli))
+- Ade Viankakrisna Fadlil ([viankakrisna](https://github.com/viankakrisna))
+- Alexey Raspopov ([alexeyraspopov](https://github.com/alexeyraspopov))
+- Andreas Hoffmann ([Furizaa](https://github.com/Furizaa))
+- Animesh Dutta ([animesh10](https://github.com/animesh10))
+- Ben Sykes ([bsyk](https://github.com/bsyk))
+- Christian Bundy ([christianbundy](https://github.com/christianbundy))
+- Dan Abramov ([gaearon](https://github.com/gaearon))
+- Dan Ristea ([danrr](https://github.com/danrr))
+- Danny Ho ([hodanny](https://github.com/hodanny))
+- Forbes Lindesay ([ForbesLindesay](https://github.com/ForbesLindesay))
+- Joe Haddad ([Timer](https://github.com/Timer))
+- Jon Crenshaw ([jdcrensh](https://github.com/jdcrensh))
+- Kiho · Cham ([monkindey](https://github.com/monkindey))
+- Konstantin Tarkus ([koistya](https://github.com/koistya))
+- Kristoffer ([denkristoffer](https://github.com/denkristoffer))
+- Mostafa Hajizadeh ([mostafah](https://github.com/mostafah))
+- Oskar Köök ([oskarkook](https://github.com/oskarkook))
+- Owen Flood ([OwenFlood](https://github.com/OwenFlood))
+- Stéphane Goetz ([onigoetz](https://github.com/onigoetz))
+- Trygve Aaberge ([trygveaa](https://github.com/trygveaa))
+- Wiley Bennett ([wileybenet](https://github.com/wileybenet))
+- [iamdoron](https://github.com/iamdoron)
+- [themre](https://github.com/themre)
+- zeel ([zeel](https://github.com/zeel))
+- Đinh Quang Trung ([trungdq88](https://github.com/trungdq88))
+
+### Migrating from 1.0.10 to 1.0.11
+
+Inside any created project that has not been ejected, run:
+
+```
+npm install --save --save-exact react-scripts@1.0.11
+```
+
+or
+
+```
+yarn add --exact react-scripts@1.0.11
+```
+
## 1.0.10 (June 29, 2017)
#### :bug: Bug Fix
@@ -110,7 +221,7 @@ yarn add --exact react-scripts@1.0.9
* [#2600](https://github.com/facebookincubator/create-react-app/pull/2600) Add empty mock for `dgram` Node module. ([@micopiira](https://github.com/micopiira))
* [#2458](https://github.com/facebookincubator/create-react-app/pull/2458) Add names to module factories in development. ([@Zaccc123](https://github.com/Zaccc123))
* [#2551](https://github.com/facebookincubator/create-react-app/pull/2551) In new projects, unregister service worker and force reload if `service-worker.js` is not found. ([@ro-savage](https://github.com/ro-savage))
-
+
* `babel-preset-react-app`, `react-dev-utils`, `react-scripts`
* [#2658](https://github.com/facebookincubator/create-react-app/pull/2658) Bump dependencies. ([@gaearon](https://github.com/gaearon))
@@ -119,7 +230,7 @@ yarn add --exact react-scripts@1.0.9
* [#2657](https://github.com/facebookincubator/create-react-app/pull/2657) Put `react-scripts` in `dependencies`, not `devDependencies`. ([@gaearon](https://github.com/gaearon))
* [#2635](https://github.com/facebookincubator/create-react-app/pull/2635) Silence unhelpful npm warnings. ([@gaearon](https://github.com/gaearon))
-
+
* `react-dev-utils`
* [#2637](https://github.com/facebookincubator/create-react-app/pull/2637) Auto-detect Brackets editor from error overlay. ([@petetnt](https://github.com/petetnt))
@@ -176,7 +287,7 @@ yarn add --exact react-scripts@1.0.9
* [#2397](https://github.com/facebookincubator/create-react-app/pull/2397) Fix command in e2e-kitchensink.sh cleanup. ([@ro-savage](https://github.com/ro-savage))
* [#2388](https://github.com/facebookincubator/create-react-app/pull/2388) Fix wrong path expansion in end-to-end test. ([@gaearon](https://github.com/gaearon))
* [#2387](https://github.com/facebookincubator/create-react-app/pull/2387) Catch "No tests found" during CI. ([@EnoahNetzach](https://github.com/EnoahNetzach))
-
+
* `react-scripts`
* [#2408](https://github.com/facebookincubator/create-react-app/pull/2408) E2E testing enhancements. ([@EnoahNetzach](https://github.com/EnoahNetzach))
@@ -573,7 +684,7 @@ yarn add --dev --exact react-scripts@1.0.1
We’ve been working on this release for the past few months, and there are many big impovements, from migrating to webpack 2 to a brand new runtime error overlay and built-in support for Progressive Web Apps.
-So instead of just enumerating them here, we decided to write a blog post about all the new features.
+So instead of just enumerating them here, we decided to write a blog post about all the new features.
Check it out: **[What’s New in Create React App](https://facebook.github.io/react/blog/2017/05/18/whats-new-in-create-react-app.html)**.
Have you read it? Now let's see how to update your app to the latest version.
diff --git a/README.md b/README.md
index 5d525e077e7..8f38e73c7d1 100644
--- a/README.md
+++ b/README.md
@@ -239,6 +239,7 @@ Some of the more popular and actively maintained ones are:
* [NYTimes/kyt](https://github.com/NYTimes/kyt)
* [zeit/next.js](https://github.com/zeit/next.js)
* [gatsbyjs/gatsby](https://github.com/gatsbyjs/gatsby)
+* [electrode-io/electrode](https://github.com/electrode-io/electrode)
Notable alternatives also include:
diff --git a/lerna.json b/lerna.json
index 7ca916a8569..1673f8a3187 100644
--- a/lerna.json
+++ b/lerna.json
@@ -1,5 +1,5 @@
{
- "lerna": "2.0.0-rc.5",
+ "lerna": "2.0.0",
"version": "independent",
"changelog": {
"repo": "facebookincubator/create-react-app",
diff --git a/package.json b/package.json
index b9abb1ce865..c3dd6404b5e 100644
--- a/package.json
+++ b/package.json
@@ -14,10 +14,10 @@
"precommit": "lint-staged"
},
"devDependencies": {
- "eslint": "3.19.0",
+ "eslint": "^4.4.1",
"husky": "^0.13.2",
- "lerna": "2.0.0-rc.5",
- "lerna-changelog": "^0.2.3",
+ "lerna": "^2.0.0",
+ "lerna-changelog": "^0.6.0",
"lint-staged": "^3.3.1",
"prettier": "^1.5.2"
},
@@ -25,6 +25,9 @@
"*.js": [
"prettier --trailing-comma es5 --single-quote --write",
"git add"
+ ],
+ "yarn.lock": [
+ "git rm --cached"
]
}
}
diff --git a/packages/babel-preset-react-app/package.json b/packages/babel-preset-react-app/package.json
index d10188fda02..dce6742985f 100644
--- a/packages/babel-preset-react-app/package.json
+++ b/packages/babel-preset-react-app/package.json
@@ -1,6 +1,6 @@
{
"name": "babel-preset-react-app",
- "version": "3.0.1",
+ "version": "3.0.2",
"description": "Babel preset used by Create React App",
"repository": "facebookincubator/create-react-app",
"license": "BSD-3-Clause",
diff --git a/packages/create-react-app/createReactApp.js b/packages/create-react-app/createReactApp.js
index 07b083a5f62..4a1b7901dc4 100755
--- a/packages/create-react-app/createReactApp.js
+++ b/packages/create-react-app/createReactApp.js
@@ -47,6 +47,7 @@ const semver = require('semver');
const dns = require('dns');
const tmp = require('tmp');
const unpack = require('tar-pack').unpack;
+const url = require('url');
const hyperquest = require('hyperquest');
const packageJson = require('./package.json');
@@ -440,8 +441,8 @@ function getPackageName(installPackage) {
// Pull package name out of git urls e.g:
// git+https://github.com/mycompany/react-scripts.git
// git+ssh://github.com/mycompany/react-scripts.git#v1.2.3
- return Promise.resolve(installPackage.match(/([^\/]+)\.git(#.*)?$/)[1]);
- } else if (installPackage.indexOf('@') > 0) {
+ return Promise.resolve(installPackage.match(/([^/]+)\.git(#.*)?$/)[1]);
+ } else if (installPackage.match(/.+@/)) {
// Do not match @scope/ when stripping off @version or @tag
return Promise.resolve(
installPackage.charAt(0) + installPackage.substr(1).split('@')[0]
@@ -614,7 +615,15 @@ function checkIfOnline(useYarn) {
return new Promise(resolve => {
dns.lookup('registry.yarnpkg.com', err => {
- resolve(err === null);
+ if (err != null && process.env.https_proxy) {
+ // If a proxy is defined, we likely can't resolve external hostnames.
+ // Try to resolve the proxy name as an indication of a connection.
+ dns.lookup(url.parse(process.env.https_proxy).hostname, proxyErr => {
+ resolve(proxyErr == null);
+ });
+ } else {
+ resolve(err == null);
+ }
});
});
}
diff --git a/packages/create-react-app/package.json b/packages/create-react-app/package.json
index 28502ca077a..42ee3497ea5 100644
--- a/packages/create-react-app/package.json
+++ b/packages/create-react-app/package.json
@@ -1,6 +1,6 @@
{
"name": "create-react-app",
- "version": "1.3.3",
+ "version": "1.4.0",
"keywords": [
"react"
],
diff --git a/packages/eslint-config-react-app/index.js b/packages/eslint-config-react-app/index.js
index a8b900f940d..4e94e650c38 100644
--- a/packages/eslint-config-react-app/index.js
+++ b/packages/eslint-config-react-app/index.js
@@ -291,8 +291,7 @@ module.exports = {
// https://github.com/gajus/eslint-plugin-flowtype
'flowtype/define-flow-type': 'warn',
- // TODO: Reenable once https://github.com/gajus/eslint-plugin-flowtype/issues/165 is fixed
- //'flowtype/require-valid-file-annotation': 'warn',
+ 'flowtype/require-valid-file-annotation': 'warn',
'flowtype/use-flow-type': 'warn',
},
};
diff --git a/packages/eslint-config-react-app/package.json b/packages/eslint-config-react-app/package.json
index 559e78b256b..375c9f54b87 100644
--- a/packages/eslint-config-react-app/package.json
+++ b/packages/eslint-config-react-app/package.json
@@ -1,6 +1,6 @@
{
"name": "eslint-config-react-app",
- "version": "1.0.5",
+ "version": "2.0.0",
"description": "ESLint configuration used by Create React App",
"repository": "facebookincubator/create-react-app",
"license": "BSD-3-Clause",
@@ -13,9 +13,9 @@
"peerDependencies": {
"babel-eslint": "^7.2.3",
"eslint": "^4.1.1",
- "eslint-plugin-flowtype": "^2.33.0",
- "eslint-plugin-import": "^2.2.0",
- "eslint-plugin-jsx-a11y": "^5.0.3",
- "eslint-plugin-react": "^7.0.1"
+ "eslint-plugin-flowtype": "^2.34.1",
+ "eslint-plugin-import": "^2.6.0",
+ "eslint-plugin-jsx-a11y": "^5.1.1",
+ "eslint-plugin-react": "^7.1.0"
}
}
diff --git a/packages/react-dev-utils/ModuleScopePlugin.js b/packages/react-dev-utils/ModuleScopePlugin.js
index f630a0279f5..3a10904d36b 100644
--- a/packages/react-dev-utils/ModuleScopePlugin.js
+++ b/packages/react-dev-utils/ModuleScopePlugin.js
@@ -13,8 +13,9 @@ const chalk = require('chalk');
const path = require('path');
class ModuleScopePlugin {
- constructor(appSrc) {
+ constructor(appSrc, allowedFiles = []) {
this.appSrc = appSrc;
+ this.allowedFiles = new Set(allowedFiles);
}
apply(resolver) {
@@ -40,15 +41,16 @@ class ModuleScopePlugin {
if (relative.startsWith('../') || relative.startsWith('..\\')) {
return callback();
}
- // Find path from src to the requested file
- const requestRelative = path.relative(
- appSrc,
- path.resolve(
- path.dirname(request.context.issuer),
- request.__innerRequest_request
- )
+ const requestFullPath = path.resolve(
+ path.dirname(request.context.issuer),
+ request.__innerRequest_request
);
+ if (this.allowedFiles.has(requestFullPath)) {
+ return callback();
+ }
+ // Find path from src to the requested file
// Error if in a parent directory of src/
+ const requestRelative = path.relative(appSrc, requestFullPath);
if (
requestRelative.startsWith('../') ||
requestRelative.startsWith('..\\')
diff --git a/packages/react-dev-utils/README.md b/packages/react-dev-utils/README.md
index 166e1bfaea3..034790c2288 100644
--- a/packages/react-dev-utils/README.md
+++ b/packages/react-dev-utils/README.md
@@ -57,7 +57,7 @@ module.exports = {
```
-#### `new ModuleScopePlugin(appSrc: string)`
+#### `new ModuleScopePlugin(appSrc: string, allowedFiles?: string[])`
This Webpack plugin ensures that relative imports from app's source directory don't reach outside of it.
@@ -71,7 +71,7 @@ module.exports = {
resolve: {
// ...
plugins: [
- new ModuleScopePlugin(paths.appSrc),
+ new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
// ...
],
// ...
@@ -170,9 +170,9 @@ module: {
Captures JS and CSS asset sizes inside the passed `buildFolder`. Save the result value to compare it after the build.
-##### `printFileSizesAfterBuild(webpackStats: WebpackStats, previousFileSizes: OpaqueFileSizes)`
+##### `printFileSizesAfterBuild(webpackStats: WebpackStats, previousFileSizes: OpaqueFileSizes, buildFolder: string, maxBundleGzipSize?: number, maxChunkGzipSize?: number)`
-Prints the JS and CSS asset sizes after the build, and includes a size comparison with `previousFileSizes` that were captured earlier using `measureFileSizesBeforeBuild()`.
+Prints the JS and CSS asset sizes after the build, and includes a size comparison with `previousFileSizes` that were captured earlier using `measureFileSizesBeforeBuild()`. `maxBundleGzipSize` and `maxChunkGzipSizemay` may optionally be specified to display a warning when the main bundle or a chunk exceeds the specified size (in bytes).
```js
var {
@@ -182,7 +182,7 @@ var {
measureFileSizesBeforeBuild(buildFolder).then(previousFileSizes => {
return cleanAndRebuild().then(webpackStats => {
- printFileSizesAfterBuild(webpackStats, previousFileSizes);
+ printFileSizesAfterBuild(webpackStats, previousFileSizes, buildFolder);
});
});
```
@@ -220,6 +220,20 @@ compiler.plugin('done', function(stats) {
});
```
+#### `printBuildError(error: Object): void`
+
+Prettify some known build errors.
+Pass an Error object to log a prettified error message in the console.
+
+```
+ const printBuildError = require('react-dev-utils/printBuildError')
+ try {
+ build()
+ } catch(e) {
+ printBuildError(e) // logs prettified message
+ }
+```
+
#### `getProcessForPort(port: number): string`
Finds the currently running process on `port`.
@@ -295,7 +309,7 @@ Returns an object with local and remote URLs for the development server. Pass th
This is an alternative client for [WebpackDevServer](https://github.com/webpack/webpack-dev-server) that shows a syntax error overlay.
-It currently supports only Webpack 1.x.
+It currently supports only Webpack 3.x.
```js
// Webpack development config
diff --git a/packages/react-dev-utils/WebpackDevServerUtils.js b/packages/react-dev-utils/WebpackDevServerUtils.js
index 8a66b15ec0c..1cd060592f9 100644
--- a/packages/react-dev-utils/WebpackDevServerUtils.js
+++ b/packages/react-dev-utils/WebpackDevServerUtils.js
@@ -164,6 +164,11 @@ function createCompiler(webpack, config, appName, urls, useYarn) {
// If errors exist, only show errors.
if (messages.errors.length) {
+ // Only keep the first error. Others are often indicative
+ // of the same problem, but confuse the reader with noise.
+ if (messages.errors.length > 1) {
+ messages.errors.length = 1;
+ }
console.log(chalk.red('Failed to compile.\n'));
console.log(messages.errors.join('\n\n'));
return;
diff --git a/packages/react-dev-utils/ansiHTML.js b/packages/react-dev-utils/ansiHTML.js
index 9f53cea67a3..90bf70374ee 100644
--- a/packages/react-dev-utils/ansiHTML.js
+++ b/packages/react-dev-utils/ansiHTML.js
@@ -10,6 +10,8 @@
'use strict';
var Anser = require('anser');
+var Entities = require('html-entities').AllHtmlEntities;
+var entities = new Entities();
// Color scheme inspired by https://chriskempson.github.io/base16/css/base16-github.css
// var base00 = 'ffffff'; // Default Background
@@ -61,7 +63,7 @@ var anserMap = {
};
function ansiHTML(txt) {
- var arr = new Anser().ansiToJson(txt, {
+ var arr = new Anser().ansiToJson(entities.encode(txt), {
use_classes: true,
});
diff --git a/packages/react-dev-utils/formatWebpackMessages.js b/packages/react-dev-utils/formatWebpackMessages.js
index 5dfd099c65c..1f22a0059a5 100644
--- a/packages/react-dev-utils/formatWebpackMessages.js
+++ b/packages/react-dev-utils/formatWebpackMessages.js
@@ -97,7 +97,7 @@ function formatMessage(message, isError) {
// from user code generated by WebPack. For more information see
// https://github.com/facebookincubator/create-react-app/pull/1050
message = message.replace(
- /^\s*at\s((?!webpack:).)*:\d+:\d+[\s\)]*(\n|$)/gm,
+ /^\s*at\s((?!webpack:).)*:\d+:\d+[\s)]*(\n|$)/gm,
''
); // at ... ...:x:y
@@ -121,11 +121,6 @@ function formatWebpackMessages(json) {
// preceding a much more useful Babel syntax error.
result.errors = result.errors.filter(isLikelyASyntaxError);
}
- // Only keep the first error. Others are often indicative
- // of the same problem, but confuse the reader with noise.
- if (result.errors.length > 1) {
- result.errors.length = 1;
- }
return result;
}
diff --git a/packages/react-dev-utils/package.json b/packages/react-dev-utils/package.json
index e15f9ec553b..3072c7d790a 100644
--- a/packages/react-dev-utils/package.json
+++ b/packages/react-dev-utils/package.json
@@ -1,6 +1,6 @@
{
"name": "react-dev-utils",
- "version": "3.0.2",
+ "version": "3.1.0",
"description": "Webpack utilities used by Create React App",
"repository": "facebookincubator/create-react-app",
"license": "BSD-3-Clause",
@@ -18,13 +18,14 @@
"crossSpawn.js",
"eslintFormatter.js",
"FileSizeReporter.js",
+ "printBuildError.js",
"formatWebpackMessages.js",
"getProcessForPort.js",
"inquirer.js",
"InterpolateHtmlPlugin.js",
"launchEditor.js",
- "noopServiceWorkerMiddleware.js",
"ModuleScopePlugin.js",
+ "noopServiceWorkerMiddleware.js",
"openBrowser.js",
"openChrome.applescript",
"printHostingInstructions.js",
@@ -37,14 +38,14 @@
"anser": "1.4.1",
"babel-code-frame": "6.22.0",
"chalk": "1.1.3",
- "cross-spawn": "4.0.2",
+ "cross-spawn": "5.1.0",
"detect-port-alt": "1.1.3",
"escape-string-regexp": "1.0.5",
- "filesize": "3.3.0",
+ "filesize": "3.5.10",
"global-modules": "1.0.0",
"gzip-size": "3.0.0",
"html-entities": "1.2.1",
- "inquirer": "3.1.1",
+ "inquirer": "3.2.1",
"is-root": "1.0.0",
"opn": "5.1.0",
"react-error-overlay": "^1.0.9",
diff --git a/packages/react-dev-utils/printBuildError.js b/packages/react-dev-utils/printBuildError.js
new file mode 100644
index 00000000000..eadfff471b9
--- /dev/null
+++ b/packages/react-dev-utils/printBuildError.js
@@ -0,0 +1,47 @@
+/**
+ * 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 chalk = require('chalk');
+
+module.exports = function printBuildError(err) {
+ const message = err != null && err.message;
+ const stack = err != null && err.stack;
+
+ // Add more helpful message for UglifyJs error
+ if (
+ stack &&
+ typeof message === 'string' &&
+ message.indexOf('from UglifyJs') !== -1
+ ) {
+ try {
+ const matched = /(.+)\[(.+):(.+),(.+)\]\[.+\]/.exec(stack);
+ if (!matched) {
+ throw new Error('Using errors for control flow is bad.');
+ }
+ const problemPath = matched[2];
+ const line = matched[3];
+ const column = matched[4];
+ console.log(
+ 'Failed to minify the code from this file: \n\n',
+ chalk.yellow(
+ `\t${problemPath}:${line}${column !== '0' ? ':' + column : ''}`
+ ),
+ '\n'
+ );
+ } catch (ignored) {
+ console.log('Failed to minify the bundle.', err);
+ }
+ console.log('Read more here: http://bit.ly/2tRViJ9');
+ } else {
+ console.log((message || err) + '\n');
+ }
+ console.log();
+};
diff --git a/packages/react-error-overlay/package.json b/packages/react-error-overlay/package.json
index f9e3ed20ffd..a6f14ec315e 100644
--- a/packages/react-error-overlay/package.json
+++ b/packages/react-error-overlay/package.json
@@ -1,6 +1,6 @@
{
"name": "react-error-overlay",
- "version": "1.0.9",
+ "version": "1.0.10",
"description": "An overlay for displaying stack frames.",
"main": "lib/index.js",
"scripts": {
@@ -31,12 +31,12 @@
"middleware.js"
],
"dependencies": {
- "anser": "1.2.5",
+ "anser": "1.4.1",
"babel-code-frame": "6.22.0",
"babel-runtime": "6.23.0",
"html-entities": "^1.2.1",
"react": "^15.5.4",
- "react-dev-utils": "^3.0.2",
+ "react-dev-utils": "^3.1.0",
"react-dom": "^15.5.4",
"settle-promise": "1.0.0",
"source-map": "0.5.6"
@@ -44,17 +44,17 @@
"devDependencies": {
"babel-cli": "6.24.1",
"babel-eslint": "7.2.3",
- "babel-preset-react-app": "^3.0.1",
- "cross-env": "5.0.0",
- "eslint": "3.19.0",
- "eslint-config-react-app": "^1.0.5",
- "eslint-plugin-flowtype": "2.33.0",
- "eslint-plugin-import": "2.2.0",
- "eslint-plugin-jsx-a11y": "5.0.3",
- "eslint-plugin-react": "7.0.1",
- "flow-bin": "0.49.1",
- "jest": "20.0.1",
- "jest-fetch-mock": "1.1.1"
+ "babel-preset-react-app": "^3.0.2",
+ "cross-env": "5.0.5",
+ "eslint": "4.4.1",
+ "eslint-config-react-app": "^2.0.0",
+ "eslint-plugin-flowtype": "2.35.0",
+ "eslint-plugin-import": "2.7.0",
+ "eslint-plugin-jsx-a11y": "5.1.1",
+ "eslint-plugin-react": "7.1.0",
+ "flow-bin": "0.52.0",
+ "jest": "20.0.4",
+ "jest-fetch-mock": "1.2.1"
},
"jest": {
"setupFiles": [
diff --git a/packages/react-error-overlay/src/containers/CompileErrorContainer.js b/packages/react-error-overlay/src/containers/CompileErrorContainer.js
index 78303df3a0c..d8727f26d14 100644
--- a/packages/react-error-overlay/src/containers/CompileErrorContainer.js
+++ b/packages/react-error-overlay/src/containers/CompileErrorContainer.js
@@ -13,18 +13,15 @@ import Overlay from '../components/Overlay';
import Footer from '../components/Footer';
import Header from '../components/Header';
import CodeBlock from '../components/CodeBlock';
-import { AllHtmlEntities as Entities } from 'html-entities';
import ansiHTML from 'react-dev-utils/ansiHTML';
-const entities = new Entities();
-
class CompileErrorContainer extends PureComponent {
render() {
const { error } = this.props;
return (
-
+
);
diff --git a/packages/react-scripts/bin/react-scripts.js b/packages/react-scripts/bin/react-scripts.js
index cb52fe71b09..a8f37e813ed 100755
--- a/packages/react-scripts/bin/react-scripts.js
+++ b/packages/react-scripts/bin/react-scripts.js
@@ -11,8 +11,13 @@
'use strict';
const spawn = require('react-dev-utils/crossSpawn');
-const script = process.argv[2];
-const args = process.argv.slice(3);
+const args = process.argv.slice(2);
+
+const scriptIndex = args.findIndex(
+ x => x === 'build' || x === 'eject' || x === 'start' || x === 'test'
+);
+const script = scriptIndex === -1 ? args[0] : args[scriptIndex];
+const nodeArgs = scriptIndex > 0 ? args.slice(0, scriptIndex) : [];
switch (script) {
case 'build':
@@ -21,7 +26,9 @@ switch (script) {
case 'test': {
const result = spawn.sync(
'node',
- [require.resolve('../scripts/' + script)].concat(args),
+ nodeArgs
+ .concat(require.resolve('../scripts/' + script))
+ .concat(args.slice(scriptIndex + 1)),
{ stdio: 'inherit' }
);
if (result.signal) {
diff --git a/packages/react-scripts/config/webpack.config.dev.js b/packages/react-scripts/config/webpack.config.dev.js
index 253bc34f062..e9f985909da 100644
--- a/packages/react-scripts/config/webpack.config.dev.js
+++ b/packages/react-scripts/config/webpack.config.dev.js
@@ -117,7 +117,7 @@ module.exports = {
// To fix this, we prevent you from importing files out of src/ -- if you'd like to,
// please link the files into your node_modules/ and let module-resolution kick in.
// Make sure your source files are compiled, as they will not be processed in any way.
- new ModuleScopePlugin(paths.appSrc),
+ new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
],
},
module: {
diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js
index 0077c34a3f6..44964346107 100644
--- a/packages/react-scripts/config/webpack.config.prod.js
+++ b/packages/react-scripts/config/webpack.config.prod.js
@@ -29,6 +29,8 @@ const publicPath = paths.servedPath;
// Some apps do not use client-side routing with pushState.
// For these, "homepage" can be set to "." to enable relative asset paths.
const shouldUseRelativeAssetPaths = publicPath === './';
+// Source maps are resource heavy and can cause out of memory issue for large source files.
+const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== 'false';
// `publicUrl` is just like `publicPath`, but we will provide it to our app
// as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript.
// Omit trailing slash as %PUBLIC_URL%/xyz looks better than %PUBLIC_URL%xyz.
@@ -62,7 +64,7 @@ module.exports = {
bail: true,
// We generate sourcemaps in production. This is slow but gives good results.
// You can exclude the *.map files from the build during deployment.
- devtool: 'source-map',
+ devtool: shouldUseSourceMap ? 'source-map' : false,
// In production, we only want to load the polyfills and the app code.
entry: [require.resolve('./polyfills'), paths.appIndexJs],
output: {
@@ -117,7 +119,7 @@ module.exports = {
// To fix this, we prevent you from importing files out of src/ -- if you'd like to,
// please link the files into your node_modules/ and let module-resolution kick in.
// Make sure your source files are compiled, as they will not be processed in any way.
- new ModuleScopePlugin(paths.appSrc),
+ new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
],
},
module: {
@@ -204,7 +206,7 @@ module.exports = {
options: {
importLoaders: 1,
minimize: true,
- sourceMap: true,
+ sourceMap: shouldUseSourceMap,
},
},
{
@@ -300,7 +302,7 @@ module.exports = {
// https://github.com/facebookincubator/create-react-app/issues/2488
ascii_only: true,
},
- sourceMap: true,
+ sourceMap: shouldUseSourceMap,
}),
// Note: this won't work without ExtractTextPlugin.extract(..) in `loaders`.
new ExtractTextPlugin({
diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json
index d0eddad69e5..bf6c6be48f2 100644
--- a/packages/react-scripts/package.json
+++ b/packages/react-scripts/package.json
@@ -1,6 +1,6 @@
{
"name": "react-scripts",
- "version": "1.0.10",
+ "version": "1.0.11",
"description": "Configuration and scripts for Create React App.",
"repository": "facebookincubator/create-react-app",
"license": "BSD-3-Clause",
@@ -21,41 +21,41 @@
"react-scripts": "./bin/react-scripts.js"
},
"dependencies": {
- "autoprefixer": "7.1.1",
+ "autoprefixer": "7.1.2",
"babel-core": "6.25.0",
"babel-eslint": "7.2.3",
"babel-jest": "20.0.3",
- "babel-loader": "7.0.0",
- "babel-preset-react-app": "^3.0.1",
+ "babel-loader": "7.1.1",
+ "babel-preset-react-app": "^3.0.2",
"babel-runtime": "6.23.0",
"case-sensitive-paths-webpack-plugin": "2.1.1",
"chalk": "1.1.3",
"css-loader": "0.28.4",
"dotenv": "4.0.0",
- "eslint": "4.1.1",
- "eslint-config-react-app": "^1.0.5",
+ "eslint": "4.4.1",
+ "eslint-config-react-app": "^2.0.0",
"eslint-loader": "1.9.0",
- "eslint-plugin-flowtype": "2.34.0",
+ "eslint-plugin-flowtype": "2.35.0",
"eslint-plugin-import": "2.7.0",
"eslint-plugin-jsx-a11y": "5.1.1",
"eslint-plugin-react": "7.1.0",
- "extract-text-webpack-plugin": "2.1.2",
+ "extract-text-webpack-plugin": "3.0.0",
"file-loader": "0.11.2",
"fs-extra": "3.0.1",
"html-webpack-plugin": "2.29.0",
"jest": "20.0.4",
"object-assign": "4.1.1",
- "postcss-flexbugs-fixes": "3.0.0",
+ "postcss-flexbugs-fixes": "3.2.0",
"postcss-loader": "2.0.6",
- "promise": "7.1.1",
- "react-dev-utils": "^3.0.2",
- "react-error-overlay": "^1.0.9",
+ "promise": "8.0.1",
+ "react-dev-utils": "^3.1.0",
+ "react-error-overlay": "^1.0.10",
"style-loader": "0.18.2",
- "sw-precache-webpack-plugin": "0.11.3",
+ "sw-precache-webpack-plugin": "0.11.4",
"url-loader": "0.5.9",
- "webpack": "2.6.1",
- "webpack-dev-server": "2.5.0",
- "webpack-manifest-plugin": "1.1.0",
+ "webpack": "3.5.1",
+ "webpack-dev-server": "2.7.1",
+ "webpack-manifest-plugin": "1.2.1",
"whatwg-fetch": "2.0.3"
},
"devDependencies": {
diff --git a/packages/react-scripts/scripts/build.js b/packages/react-scripts/scripts/build.js
index b9b65f5313d..7691bfd5282 100644
--- a/packages/react-scripts/scripts/build.js
+++ b/packages/react-scripts/scripts/build.js
@@ -34,6 +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 printBuildError = require('react-dev-utils/printBuildError');
const measureFileSizesBeforeBuild =
FileSizeReporter.measureFileSizesBeforeBuild;
@@ -104,7 +105,7 @@ measureFileSizesBeforeBuild(paths.appBuild)
},
err => {
console.log(chalk.red('Failed to compile.\n'));
- console.log((err.message || err) + '\n');
+ printBuildError(err);
process.exit(1);
}
);
@@ -121,6 +122,11 @@ function build(previousFileSizes) {
}
const messages = formatWebpackMessages(stats.toJson({}, true));
if (messages.errors.length) {
+ // Only keep the first error. Others are often indicative
+ // of the same problem, but confuse the reader with noise.
+ if (messages.errors.length > 1) {
+ messages.errors.length = 1;
+ }
return reject(new Error(messages.errors.join('\n\n')));
}
if (
diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md
index 82642ca3a8e..c55ccdf949f 100644
--- a/packages/react-scripts/template/README.md
+++ b/packages/react-scripts/template/README.md
@@ -68,6 +68,7 @@ You can find the most recent version of this guide [here](https://github.com/fac
- [Getting Started with Storybook](#getting-started-with-storybook)
- [Getting Started with Styleguidist](#getting-started-with-styleguidist)
- [Making a Progressive Web App](#making-a-progressive-web-app)
+ - [Opting Out of Caching](#opting-out-of-caching)
- [Offline-First Considerations](#offline-first-considerations)
- [Progressive Web App Metadata](#progressive-web-app-metadata)
- [Analyzing the Bundle Size](#analyzing-the-bundle-size)
@@ -80,7 +81,6 @@ You can find the most recent version of this guide [here](https://github.com/fac
- [Firebase](#firebase)
- [GitHub Pages](#github-pages)
- [Heroku](#heroku)
- - [Modulus](#modulus)
- [Netlify](#netlify)
- [Now](#now)
- [S3 and CloudFront](#s3-and-cloudfront)
@@ -91,6 +91,7 @@ You can find the most recent version of this guide [here](https://github.com/fac
- [`npm test` hangs on macOS Sierra](#npm-test-hangs-on-macos-sierra)
- [`npm run build` exits too early](#npm-run-build-exits-too-early)
- [`npm run build` fails on Heroku](#npm-run-build-fails-on-heroku)
+ - [`npm run build` fails to minify](#npm-run-build-fails-to-minify)
- [Moment.js locales are missing](#momentjs-locales-are-missing)
- [Something Missing?](#something-missing)
@@ -242,9 +243,11 @@ If you want to enforce a coding style for your project, consider using [Prettier
## Debugging in the Editor
-**This feature is currently only supported by [Visual Studio Code](https://code.visualstudio.com) editor.**
+**This feature is currently only supported by [Visual Studio Code](https://code.visualstudio.com) and [WebStorm](https://www.jetbrains.com/webstorm/).**
-Visual Studio Code supports debugging out of the box with Create React App. This enables you as a developer to write and debug your React code without leaving the editor, and most importantly it enables you to have a continuous development workflow, where context switching is minimal, as you don’t have to switch between tools.
+Visual Studio Code and WebStorm support debugging out of the box with Create React App. This enables you as a developer to write and debug your React code without leaving the editor, and most importantly it enables you to have a continuous development workflow, where context switching is minimal, as you don’t have to switch between tools.
+
+### Visual Studio Code
You would need to have the latest version of [VS Code](https://code.visualstudio.com) and VS Code [Chrome Debugger Extension](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) installed.
@@ -266,9 +269,22 @@ Then add the block below to your `launch.json` file and put it inside the `.vsco
}]
}
```
+>Note: the URL may be different if you've made adjustments via the [HOST or PORT environment variables](#advanced-configuration).
Start your app by running `npm start`, and start debugging in VS Code by pressing `F5` or by clicking the green debug icon. You can now write code, set breakpoints, make changes to the code, and debug your newly modified code—all from your editor.
+### WebStorm
+
+You would need to have [WebStorm](https://www.jetbrains.com/webstorm/) and [JetBrains IDE Support](https://chrome.google.com/webstore/detail/jetbrains-ide-support/hmhgeddbohgjknpmjagkdomcpobmllji) Chrome extension installed.
+
+In the WebStorm menu `Run` select `Edit Configurations...`. Then click `+` and select `JavaScript Debug`. Paste `http://localhost:3000` into the URL field and save the configuration.
+
+>Note: the URL may be different if you've made adjustments via the [HOST or PORT environment variables](#advanced-configuration).
+
+Start your app by running `npm start`, then press `^D` on macOS or `F9` on Windows and Linux or click the green debug icon to start debugging in WebStorm.
+
+The same way you can debug your application in IntelliJ IDEA Ultimate, PhpStorm, PyCharm Pro, and RubyMine.
+
## Formatting Code Automatically
Prettier is an opinionated code formatter with support for JavaScript, CSS and JSON. With Prettier you can format the code you write automatically to ensure a code style within your project. See the [Prettier's GitHub page](https://github.com/prettier/prettier) for more information, and look at this [page to see it in action](https://prettier.github.io/prettier/).
@@ -1562,6 +1578,8 @@ The service worker will use a [cache-first strategy](https://developers.google.c
for handling all requests for local assets, including the initial HTML, ensuring
that your web app is reliably fast, even on a slow or unreliable network.
+### Opting Out of Caching
+
If you would prefer not to enable service workers prior to your initial
production deployment, then remove the call to `serviceWorkerRegistration.register()`
from [`src/index.js`](src/index.js).
@@ -1571,7 +1589,8 @@ have decided that you would like to disable them for all your existing users,
you can swap out the call to `serviceWorkerRegistration.register()` in
[`src/index.js`](src/index.js) with a call to `serviceWorkerRegistration.unregister()`.
After the user visits a page that has `serviceWorkerRegistration.unregister()`,
-the service worker will be uninstalled.
+the service worker will be uninstalled. Note that depending on how `/service-worker.js` is served,
+it may take up to 24 hours for the cache to be invalidated.
### Offline-First Considerations
@@ -1970,10 +1989,6 @@ remote: npm ERR! argv "/tmp/build_a2875fc163b209225122d68916f1d4df/.heroku/node/
In this case, ensure that the file is there with the proper lettercase and that’s not ignored on your local `.gitignore` or `~/.gitignore_global`.
-### Modulus
-
-See the [Modulus blog post](http://blog.modulus.io/deploying-react-apps-on-modulus) on how to deploy your react app to Modulus.
-
### Netlify
**To do a manual deploy to Netlify’s CDN:**
@@ -2052,6 +2067,8 @@ HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run
PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](#building-for-relative-paths). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application.
CI | :large_orange_diamond: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. It also makes the test runner non-watching. Most CIs set this flag by default.
REACT_EDITOR | :white_check_mark: | :x: | When an app crashes in development, you will see an error overlay with clickable stack trace. When you click on it, Create React App will try to determine the editor you are using based on currently running processes, and open the relevant source file. You can [send a pull request to detect your editor of choice](https://github.com/facebookincubator/create-react-app/issues/2636). Setting this environment variable overrides the automatic detection. If you do it, make sure your systems [PATH](https://en.wikipedia.org/wiki/PATH_(variable)) environment variable points to your editor’s bin folder.
+CHOKIDAR_USEPOLLING | :white_check_mark: | :x: | When set to `true`, the watcher runs in polling mode, as necessary inside a VM. Use this option if `npm start` isn't detecting changes.
+GENERATE_SOURCEMAP | :x: | :white_check_mark: | When set to `false`, source maps are not generated for a production build. This solves OOM issues on some smaller machines.
## Troubleshooting
@@ -2132,6 +2149,16 @@ moment.locale('fr');
This will only work for locales that have been explicitly imported before.
+### `npm run build` fails to minify
+
+You may occasionally find a package you depend on needs compiled or ships code for a non-browser environment.
+This is considered poor practice in the ecosystem and does not have an escape hatch in Create React App.
+
+To resolve this:
+1. Open an issue on the dependency's issue tracker and ask that the package be published pre-compiled (retaining ES6 Modules).
+2. Fork the package and publish a corrected version yourself.
+3. If the dependency is small enough, copy it to your `src/` folder and treat it as application code.
+
## Something Missing?
If you have ideas for more “How To” recipes that should be on this page, [let us know](https://github.com/facebookincubator/create-react-app/issues) or [contribute some!](https://github.com/facebookincubator/create-react-app/edit/master/packages/react-scripts/template/README.md)