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 66ffdc0a167..4dfc72aa8a5 100644
--- a/README.md
+++ b/README.md
@@ -56,4 +56,4 @@ to:
#### 3. SCSS and CSS Modules, WTF?
With this approach we can benefit from what is best from those two worlds. We can use SCSS syntax for mixins, variables etc. and still have our rules scoped to the component ;)
-How to use it? Since there is no global scope we need to implicitly import our variables/mixins etc. Check the `src/Components/App/style.scss` file. On the first line it imports the shared styles with variables and mixins.
\ No newline at end of file
+How to use it? Since there is no global scope we need to implicitly import our variables/mixins etc. Check the `src/Components/App/style.scss` file. On the first line it imports the shared styles with variables and mixins.
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 e09e990d0b7..0e4e135f89f 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",
"recursive-readdir": "2.2.1",
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-dev-utils/webpackHotDevClient.js b/packages/react-dev-utils/webpackHotDevClient.js
index 78002b28efb..f2f206a5cd2 100644
--- a/packages/react-dev-utils/webpackHotDevClient.js
+++ b/packages/react-dev-utils/webpackHotDevClient.js
@@ -22,9 +22,7 @@ var SockJS = require('sockjs-client');
var stripAnsi = require('strip-ansi');
var url = require('url');
var formatWebpackMessages = require('./formatWebpackMessages');
-var Entities = require('html-entities').AllHtmlEntities;
var ansiHTML = require('./ansiHTML');
-var entities = new Entities();
function createOverlayIframe(onIframeLoad) {
var iframe = document.createElement('iframe');
@@ -138,7 +136,7 @@ function showErrorOverlay(message) {
'margin-bottom: 0.5em; overflow-x: auto; white-space: pre-wrap; ' +
'border-radius: 0.25rem; background-color: rgba(206, 17, 38, 0.05)">' +
'' +
- ansiHTML(entities.encode(message)) +
+ ansiHTML(message) +
'' +
'
+ 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 +25,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 982105d0f7b..7882125a875 100644
--- a/packages/react-scripts/config/webpack.config.dev.js
+++ b/packages/react-scripts/config/webpack.config.dev.js
@@ -119,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: {
diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js
index c653399e7e2..eb20d4a9778 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: {
@@ -200,7 +202,7 @@ module.exports = {
options: {
importLoaders: 2,
minimize: true,
- sourceMap: true,
+ sourceMap: shouldUseSourceMap,
modules: process.env.CSS_MODULES ? process.env.CSS_MODULES == 'true' : true,
camelCase: true,
localIdentName: '[path][name]__[local]--[hash:base64:5]',
@@ -305,7 +307,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 49ac07fec6c..0bffe0dbef6 100644
--- a/packages/react-scripts/package.json
+++ b/packages/react-scripts/package.json
@@ -21,7 +21,7 @@
"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",
@@ -47,7 +47,7 @@
"stylelint-declaration-use-variable": "^1.6.0",
"stylelint-order": "^0.5.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",
@@ -57,16 +57,16 @@
"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": "8.0.1",
- "react-dev-utils": "^3.0.2",
- "react-error-overlay": "^1.0.9",
+ "react-dev-utils": "^3.1.0",
+ "react-error-overlay": "^1.0.10",
"style-loader": "0.18.2",
"sw-precache-webpack-plugin": "0.11.4",
"url-loader": "0.5.9",
- "webpack": "3.4.0",
- "webpack-dev-server": "2.6.1",
+ "webpack": "3.5.1",
+ "webpack-dev-server": "2.7.1",
"webpack-manifest-plugin": "1.2.1",
"whatwg-fetch": "2.0.3"
},
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 55960e2b905..c55ccdf949f 100644
--- a/packages/react-scripts/template/README.md
+++ b/packages/react-scripts/template/README.md
@@ -81,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)
@@ -92,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)
@@ -243,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.
@@ -267,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/).
@@ -1575,7 +1590,7 @@ 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. Note that depending on how `/service-worker.js` is served,
-it make take up to 24 hours for the cache to be invalidated.
+it may take up to 24 hours for the cache to be invalidated.
### Offline-First Considerations
@@ -1974,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:**
@@ -2056,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
@@ -2136,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)