this.node = node}>`. ([@mrscobbler](https://github.com/mrscobbler) in [#529](https://github.com/facebook/create-react-app/pull/529))
+- Temporarily disabled `react-constant-elements` Babel transform because of its bugs. ([@gaearon](https://github.com/gaearon) in [#534](https://github.com/facebook/create-react-app/pull/534))
+- Fixed a permission issue with Docker. ([@gaearon](https://github.com/gaearon) in [73c940](https://github.com/facebook/create-react-app/commit/73c940a73205d761230f8d6bf81ecfd460ba28a9))
+- Fixed an issue with generator syntax in Jest that occurred in an alpha release. ([@gaearon](https://github.com/gaearon) in [#535](https://github.com/facebook/create-react-app/pull/535))
### Global CLI (`create-react-app`)
-* You can now create a project in a folder that already contains an `.idea` folder, which is necessary for future WebStorm integration. ([@denofevil](https://github.com/denofevil) in [#522](https://github.com/facebook/create-react-app/pull/522))
+- You can now create a project in a folder that already contains an `.idea` folder, which is necessary for future WebStorm integration. ([@denofevil](https://github.com/denofevil) in [#522](https://github.com/facebook/create-react-app/pull/522))
### Migrating from 0.2.3 to 0.3.0
@@ -1255,7 +1316,7 @@ Now `favicon.ico` is not treated specially anymore.
If you use it, move it to `src` and add the following line to `` in your HTML: ```html - + ``` #### New Feature @@ -1276,13 +1337,13 @@ Since 0.3.0 added a test runner, we recommend that you add it to the `scripts` s ### Build Dependency (`react-scripts`) -* You can now [proxy requests to an API server](https://github.com/facebook/create-react-app/blob/ef94b0561d5afb9b50b905fa5cd3f94e965c69c0/template/README.md#proxying-api-requests-in-development) without worrying about CORS. ([@gaearon](https://github.com/gaearon) in [#282](https://github.com/facebook/create-react-app/pull/282)) -* You can now [pass custom environment variables](https://github.com/facebook/create-react-app/blob/ef94b0561d5afb9b50b905fa5cd3f94e965c69c0/template/README.md#adding-custom-environment-variables) to your application. ([@eliperelman](https://github.com/eliperelman) in [#342](https://github.com/facebook/create-react-app/pull/342)) -* You can now [use `async` and `await`](https://ponyfoo.com/articles/understanding-javascript-async-await) syntax. ([@gaearon](https://github.com/gaearon) in [#327](https://github.com/facebook/create-react-app/pull/327), [@fson](https://github.com/fson) in [#332](https://github.com/facebook/create-react-app/pull/332)) -* Paths with period in them now load successfully on the development server. ([@mxstbr](https://github.com/mxstbr) in [#422](https://github.com/facebook/create-react-app/pull/422)) -* Images with `.webp` extension are now supported. ([@gafemoyano](https://github.com/gafemoyano) in [#458](https://github.com/facebook/create-react-app/pull/458)) -* The most recent version of React is now added to `package.json`. ([@wdhorton](https://github.com/wdhorton) in [#477](https://github.com/facebook/create-react-app/pull/477)) -* Babel configuration is simplified. ([@kripod](https://github.com/kripod) in [#490](https://github.com/facebook/create-react-app/pull/490)) +- You can now [proxy requests to an API server](https://github.com/facebook/create-react-app/blob/ef94b0561d5afb9b50b905fa5cd3f94e965c69c0/template/README.md#proxying-api-requests-in-development) without worrying about CORS. ([@gaearon](https://github.com/gaearon) in [#282](https://github.com/facebook/create-react-app/pull/282)) +- You can now [pass custom environment variables](https://github.com/facebook/create-react-app/blob/ef94b0561d5afb9b50b905fa5cd3f94e965c69c0/template/README.md#adding-custom-environment-variables) to your application. ([@eliperelman](https://github.com/eliperelman) in [#342](https://github.com/facebook/create-react-app/pull/342)) +- You can now [use `async` and `await`](https://ponyfoo.com/articles/understanding-javascript-async-await) syntax. ([@gaearon](https://github.com/gaearon) in [#327](https://github.com/facebook/create-react-app/pull/327), [@fson](https://github.com/fson) in [#332](https://github.com/facebook/create-react-app/pull/332)) +- Paths with period in them now load successfully on the development server. ([@mxstbr](https://github.com/mxstbr) in [#422](https://github.com/facebook/create-react-app/pull/422)) +- Images with `.webp` extension are now supported. ([@gafemoyano](https://github.com/gafemoyano) in [#458](https://github.com/facebook/create-react-app/pull/458)) +- The most recent version of React is now added to `package.json`. ([@wdhorton](https://github.com/wdhorton) in [#477](https://github.com/facebook/create-react-app/pull/477)) +- Babel configuration is simplified. ([@kripod](https://github.com/kripod) in [#490](https://github.com/facebook/create-react-app/pull/490)) ### Migrating from 0.2.2 to 0.2.3 @@ -1294,15 +1355,15 @@ Newly created projects will use `0.2.3` automatically. You **don’t** need to u ### Build Dependency (`react-scripts`) -* When the bundle size changes, we now display the difference after build. ([@elijahmanor](https://github.com/elijahmanor) in [#340](https://github.com/facebook/create-react-app/pull/340)) -* `npm install`ing a missing dependency now forces a rebuild. ([@gaearon](https://github.com/gaearon) in [#349](https://github.com/facebook/create-react-app/pull/349)) -* Autoprefixer config now includes more commonly supported browsers. ([@kripod](https://github.com/kripod) in [#345](https://github.com/facebook/create-react-app/pull/345)) -* All the configuration is now documented inline so ejecting doesn’t leave you in the dark. ([@gaearon](https://github.com/gaearon) in [#362](https://github.com/facebook/create-react-app/pull/362)) -* `Object.assign()` polyfill is now bundled by default. ([@gaearon](https://github.com/gaearon) in [#399](https://github.com/facebook/create-react-app/pull/399)) -* [React Native Web](https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/) now works out of the box. ([@grigio](https://github.com/grigio) in [#407](https://github.com/facebook/create-react-app/pull/407)) -* Same asset filenames in different folders don’t confuse the server now. ([@arunoda](https://github.com/arunoda) in [#446](https://github.com/facebook/create-react-app/pull/446)) -* The `otf` font format is now supported. ([@A-gambit](https://github.com/A-gambit) in [#434](https://github.com/facebook/create-react-app/pull/434)) -* The `new-cap` linting rule has been disabled thanks to feedback from Immutable.js users. ([@rricard](https://github.com/rricard) in [#470](https://github.com/facebook/create-react-app/pull/470)) +- When the bundle size changes, we now display the difference after build. ([@elijahmanor](https://github.com/elijahmanor) in [#340](https://github.com/facebook/create-react-app/pull/340)) +- `npm install`ing a missing dependency now forces a rebuild. ([@gaearon](https://github.com/gaearon) in [#349](https://github.com/facebook/create-react-app/pull/349)) +- Autoprefixer config now includes more commonly supported browsers. ([@kripod](https://github.com/kripod) in [#345](https://github.com/facebook/create-react-app/pull/345)) +- All the configuration is now documented inline so ejecting doesn’t leave you in the dark. ([@gaearon](https://github.com/gaearon) in [#362](https://github.com/facebook/create-react-app/pull/362)) +- `Object.assign()` polyfill is now bundled by default. ([@gaearon](https://github.com/gaearon) in [#399](https://github.com/facebook/create-react-app/pull/399)) +- [React Native Web](https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/) now works out of the box. ([@grigio](https://github.com/grigio) in [#407](https://github.com/facebook/create-react-app/pull/407)) +- Same asset filenames in different folders don’t confuse the server now. ([@arunoda](https://github.com/arunoda) in [#446](https://github.com/facebook/create-react-app/pull/446)) +- The `otf` font format is now supported. ([@A-gambit](https://github.com/A-gambit) in [#434](https://github.com/facebook/create-react-app/pull/434)) +- The `new-cap` linting rule has been disabled thanks to feedback from Immutable.js users. ([@rricard](https://github.com/rricard) in [#470](https://github.com/facebook/create-react-app/pull/470)) ### Migrating from 0.2.1 to 0.2.2 @@ -1314,12 +1375,12 @@ Newly created projects will use `0.2.2` automatically. You **don’t** need to u ### Build Dependency (`react-scripts`) -* Fixes an issue with `npm start` taking a very long time on OS X with Firewall enabled ([@gaearon](https://github.com/gaearon) in [#319](https://github.com/facebook/create-react-app/pull/319)) -* Fixes an issue with Webpack eating a lot of CPU in some cases ([@dceddia](https://github.com/dceddia) in [#294](https://github.com/facebook/create-react-app/pull/294)) -* We now warn if you import a file with mismatched casing because this breaks the watcher ([@alexzherdev](https://github.com/alexzherdev) in [#266](https://github.com/facebook/create-react-app/pull/266)) -* CSS files specifying `?v=` after asset filenames, such as Font Awesome, now works correctly ([@alexzherdev](https://github.com/alexzherdev) in [#298](https://github.com/facebook/create-react-app/pull/298)) -* Issues with `npm link`ing `react-scripts` have been fixed ([@dallonf](https://github.com/dallonf) in [#277](https://github.com/facebook/create-react-app/pull/277)) -* We now use `/static` prefix for assets both in development and production ([@gaearon](https://github.com/gaearon) in [#278](https://github.com/facebook/create-react-app/pull/278)) +- Fixes an issue with `npm start` taking a very long time on OS X with Firewall enabled ([@gaearon](https://github.com/gaearon) in [#319](https://github.com/facebook/create-react-app/pull/319)) +- Fixes an issue with webpack eating a lot of CPU in some cases ([@dceddia](https://github.com/dceddia) in [#294](https://github.com/facebook/create-react-app/pull/294)) +- We now warn if you import a file with mismatched casing because this breaks the watcher ([@alexzherdev](https://github.com/alexzherdev) in [#266](https://github.com/facebook/create-react-app/pull/266)) +- CSS files specifying `?v=` after asset filenames, such as Font Awesome, now works correctly ([@alexzherdev](https://github.com/alexzherdev) in [#298](https://github.com/facebook/create-react-app/pull/298)) +- Issues with `npm link`ing `react-scripts` have been fixed ([@dallonf](https://github.com/dallonf) in [#277](https://github.com/facebook/create-react-app/pull/277)) +- We now use `/static` prefix for assets both in development and production ([@gaearon](https://github.com/gaearon) in [#278](https://github.com/facebook/create-react-app/pull/278)) ### Migrating from 0.2.0 to 0.2.1 @@ -1331,27 +1392,27 @@ Newly created projects will use `0.2.1` automatically. You **don’t** need to u ### Build Dependency (`react-scripts`) -* You can now enable deployment to GitHub Pages by adding `homepage` field to `package.json` ([@dhruska](https://github.com/dhruska) in [#94](https://github.com/facebook/create-react-app/pull/94)) -* Development server now runs on `0.0.0.0` and works with VirtualBox ([@JWo1F](https://github.com/JWo1F) in [#128](https://github.com/facebook/create-react-app/pull/128)) -* Cloud9 and Nitrous online IDEs are now supported ([@gaearon](http://github.com/gaearon) in [2fe84e](https://github.com/facebook/create-react-app/commit/2fe84ecded55f1d5258d91f9c2c07698ae0d2fb4)) -* When `3000` port is taken, we offer to use another port ([@chocnut](https://github.com/chocnut) in [#101](https://github.com/facebook/create-react-app/pull/101), [2edf21](https://github.com/facebook/create-react-app/commit/2edf2180f2aa6bf647807d0b1fcd95f4cfe4a558)) -* You can now `import` CSS files from npm modules ([@glennreyes](https://github.com/glennreyes) in [#105](https://github.com/facebook/create-react-app/pull/105), [@breaddevil](https://github.com/breaddevil) in [#178](https://github.com/facebook/create-react-app/pull/178)) -* `fetch` and `Promise` polyfills are now always included ([@gaearon](https://github.com/gaearon) in [#235](https://github.com/facebook/create-react-app/pull/235)) -* Regenerator runtime is now included if you use ES6 generators ([@gaearon](https://github.com/gaearon) in [#238](https://github.com/facebook/create-react-app/pull/238)) -* Generated project now contains `.gitignore` ([@npverni](https://github.com/npverni) in [#79](https://github.com/facebook/create-react-app/pull/79), [@chibicode](https://github.com/chibicode) in [#112](https://github.com/facebook/create-react-app/pull/112)) -* ESLint config is now more compatible with Flow ([@gaearon](https://github.com/gaearon) in [#261](https://github.com/facebook/create-react-app/pull/261)) -* A stylistic lint rule about method naming has been removed ([@mxstbr](https://github.com/mxstbr) in [#152](https://github.com/facebook/create-react-app/pull/157)) -* A few unobtrusive accessibility lint rules have been added ([@evcohen](https://github.com/evcohen) in [#175](https://github.com/facebook/create-react-app/pull/175)) -* A `.babelrc` in parent directory no longer causes an error ([@alexzherdev](https://github.com/alexzherdev) in [#236](https://github.com/facebook/create-react-app/pull/236)) -* Files with `.json` extension are now discovered ([@gaearon](https://github.com/gaearon) in [a11d6a](https://github.com/facebook/create-react-app/commit/a11d6a398f487f9163880dd34667b1d3e14b147a)) -* Bug fixes from transitive dependencies are included ([#126](https://github.com/facebook/create-react-app/issues/126)) -* Linting now works with IDEs if you follow [these](https://github.com/facebook/create-react-app/blob/master/template/README.md#display-lint-output-in-the-editor) instructions ([@keyanzhang](https://github.com/keyanzhang) in [#149](https://github.com/facebook/create-react-app/pull/149)) -* After building, we now print gzipped bundle size ([@lvwrence](https://github.com/lvwrence) in [#229](https://github.com/facebook/create-react-app/pull/229)) +- You can now enable deployment to GitHub Pages by adding `homepage` field to `package.json` ([@dhruska](https://github.com/dhruska) in [#94](https://github.com/facebook/create-react-app/pull/94)) +- Development server now runs on `0.0.0.0` and works with VirtualBox ([@JWo1F](https://github.com/JWo1F) in [#128](https://github.com/facebook/create-react-app/pull/128)) +- Cloud9 and Nitrous online IDEs are now supported ([@gaearon](http://github.com/gaearon) in [2fe84e](https://github.com/facebook/create-react-app/commit/2fe84ecded55f1d5258d91f9c2c07698ae0d2fb4)) +- When `3000` port is taken, we offer to use another port ([@chocnut](https://github.com/chocnut) in [#101](https://github.com/facebook/create-react-app/pull/101), [2edf21](https://github.com/facebook/create-react-app/commit/2edf2180f2aa6bf647807d0b1fcd95f4cfe4a558)) +- You can now `import` CSS files from npm modules ([@glennreyes](https://github.com/glennreyes) in [#105](https://github.com/facebook/create-react-app/pull/105), [@breaddevil](https://github.com/breaddevil) in [#178](https://github.com/facebook/create-react-app/pull/178)) +- `fetch` and `Promise` polyfills are now always included ([@gaearon](https://github.com/gaearon) in [#235](https://github.com/facebook/create-react-app/pull/235)) +- Regenerator runtime is now included if you use ES6 generators ([@gaearon](https://github.com/gaearon) in [#238](https://github.com/facebook/create-react-app/pull/238)) +- Generated project now contains `.gitignore` ([@npverni](https://github.com/npverni) in [#79](https://github.com/facebook/create-react-app/pull/79), [@chibicode](https://github.com/chibicode) in [#112](https://github.com/facebook/create-react-app/pull/112)) +- ESLint config is now more compatible with Flow ([@gaearon](https://github.com/gaearon) in [#261](https://github.com/facebook/create-react-app/pull/261)) +- A stylistic lint rule about method naming has been removed ([@mxstbr](https://github.com/mxstbr) in [#152](https://github.com/facebook/create-react-app/pull/157)) +- A few unobtrusive accessibility lint rules have been added ([@evcohen](https://github.com/evcohen) in [#175](https://github.com/facebook/create-react-app/pull/175)) +- A `.babelrc` in parent directory no longer causes an error ([@alexzherdev](https://github.com/alexzherdev) in [#236](https://github.com/facebook/create-react-app/pull/236)) +- Files with `.json` extension are now discovered ([@gaearon](https://github.com/gaearon) in [a11d6a](https://github.com/facebook/create-react-app/commit/a11d6a398f487f9163880dd34667b1d3e14b147a)) +- Bug fixes from transitive dependencies are included ([#126](https://github.com/facebook/create-react-app/issues/126)) +- Linting now works with IDEs if you follow [these](https://github.com/facebook/create-react-app/blob/master/template/README.md#display-lint-output-in-the-editor) instructions ([@keyanzhang](https://github.com/keyanzhang) in [#149](https://github.com/facebook/create-react-app/pull/149)) +- After building, we now print gzipped bundle size ([@lvwrence](https://github.com/lvwrence) in [#229](https://github.com/facebook/create-react-app/pull/229)) ### Global CLI (`create-react-app`) -* It enforces that you have Node >= 4 ([@conorhastings](https://github.com/conorhastings) in [#88](https://github.com/facebook/create-react-app/pull/88)) -* It handles `--version` flag correctly ([@mxstbr](https://github.com/mxstbr) in [#152](https://github.com/facebook/create-react-app/pull/152)) +- It enforces that you have Node >= 4 ([@conorhastings](https://github.com/conorhastings) in [#88](https://github.com/facebook/create-react-app/pull/88)) +- It handles `--version` flag correctly ([@mxstbr](https://github.com/mxstbr) in [#152](https://github.com/facebook/create-react-app/pull/152)) ### Migrating from 0.1.0 to 0.2.0 @@ -1371,4 +1432,4 @@ You may need to fix a few lint warnings about missing `![]()
` tag, but every
## 0.1.0 (July 22, 2016)
-* Initial public release
+- Initial public release
diff --git a/CHANGELOG-1.x.md b/CHANGELOG-1.x.md
index fb1b1cc1d2c..d8b8ee9cb90 100644
--- a/CHANGELOG-1.x.md
+++ b/CHANGELOG-1.x.md
@@ -280,7 +280,7 @@ yarn add --exact react-scripts@1.1.1
- [#3757](https://github.com/facebook/create-react-app/pull/3757) Try updating Flow. ([@gaearon](https://github.com/gaearon))
- [#3414](https://github.com/facebook/create-react-app/pull/3414) Export `dismissRuntimeErrors` function. ([@skidding](https://github.com/skidding))
- [#3036](https://github.com/facebook/create-react-app/pull/3036) Cleaning up `printHostingInstructions` a bit. ([@GreenGremlin](https://github.com/GreenGremlin))
- - [#3514](https://github.com/facebook/create-react-app/pull/3514) Fix `FileSizeReporter` for multi build Webpack setups. ([@iiska](https://github.com/iiska))
+ - [#3514](https://github.com/facebook/create-react-app/pull/3514) Fix `FileSizeReporter` for multi build webpack setups. ([@iiska](https://github.com/iiska))
- [#3362](https://github.com/facebook/create-react-app/pull/3362) Refactor extra watch options regex to `react-dev-utils`. ([@xjlim](https://github.com/xjlim))
#### Committers: 47
@@ -1104,7 +1104,7 @@ or
yarn add --dev --exact react-scripts@1.0.8
```
-**If you previously used `HTTPS=true` environment variable in development**, make sure you aren't affected by a now-fixed vulnerability in Webpack by [visiting this page](http://badcert.mike.works/). You can read more about the vulnerability [here](https://medium.com/@mikenorth/webpack-preact-cli-vulnerability-961572624c54).
+**If you previously used `HTTPS=true` environment variable in development**, make sure you aren't affected by a now-fixed vulnerability in webpack by [visiting this page](http://badcert.mike.works/). You can read more about the vulnerability [here](https://medium.com/@mikenorth/webpack-preact-cli-vulnerability-961572624c54).
You may optionally then move `react-scripts` from `devDependencies` to `dependencies` since that’s how we’ll structure newly created projects. It is not necessary though.
@@ -1724,7 +1724,7 @@ Please [file an issue](https://github.com/facebook/create-react-app/issues/new)
- `react-dev-utils`
- [#2125](https://github.com/facebook/create-react-app/pull/2125) Only show the first compilation error. ([@gaearon](https://github.com/gaearon))
- [#2120](https://github.com/facebook/create-react-app/pull/2120) Omit ESLint warnings when there are ESLint errors. ([@gaearon](https://github.com/gaearon))
- - [#2113](https://github.com/facebook/create-react-app/pull/2113) Prettify errors and warnings for Webpack 2. ([@gaearon](https://github.com/gaearon))
+ - [#2113](https://github.com/facebook/create-react-app/pull/2113) Prettify errors and warnings for webpack 2. ([@gaearon](https://github.com/gaearon))
- [#1842](https://github.com/facebook/create-react-app/pull/1842) Modularize and extract crash overlay to iframe. ([@Timer](https://github.com/Timer))
- `create-react-app`
- [#1811](https://github.com/facebook/create-react-app/pull/1811) Allow creation of apps in empty Mercurial repos. ([@GreenGremlin](https://github.com/GreenGremlin))
@@ -1770,7 +1770,7 @@ Please [file an issue](https://github.com/facebook/create-react-app/issues/new)
- [#1736](https://github.com/facebook/create-react-app/pull/1736) Fix eject for linked react-scripts. ([@tuchk4](https://github.com/tuchk4))
- [#1741](https://github.com/facebook/create-react-app/pull/1741) Fix internal linting setup. ([@gaearon](https://github.com/gaearon))
- [#1730](https://github.com/facebook/create-react-app/pull/1730) Fix Node 4 e2e tests. ([@Timer](https://github.com/Timer))
- - [#1715](https://github.com/facebook/create-react-app/pull/1715) Remove unused `url` import in Webpack config. ([@pd4d10](https://github.com/pd4d10))
+ - [#1715](https://github.com/facebook/create-react-app/pull/1715) Remove unused `url` import in webpack config. ([@pd4d10](https://github.com/pd4d10))
- [#1700](https://github.com/facebook/create-react-app/pull/1700) Update extract-text-webpack-plugin to stable. ([@SimenB](https://github.com/SimenB))
- `react-dev-utils`, `react-scripts`
- [#2209](https://github.com/facebook/create-react-app/pull/2209) Move more logic from react-scripts to react-dev-utils. ([@gaearon](https://github.com/gaearon))
diff --git a/CHANGELOG-2.x.md b/CHANGELOG-2.x.md
index e30c5e63ec0..5080171a165 100644
--- a/CHANGELOG-2.x.md
+++ b/CHANGELOG-2.x.md
@@ -827,7 +827,7 @@ You can read more about [these polyfills here](https://github.com/facebook/creat
### Dynamic `import()` of a CommonJS module now has a `.default` property
-[Webpack 4 changed the behavior of `import()`](https://medium.com/webpack/webpack-4-import-and-commonjs-d619d626b655) to be closer in line with the specification.
+[webpack 4 changed the behavior of `import()`](https://medium.com/webpack/webpack-4-import-and-commonjs-d619d626b655) to be closer in line with the specification.
Previously, importing a CommonJS module did not require you specify the default export. In most cases, this is now required.
If you see errors in your application about `... is not a function`, you likely need to update your dynamic import, e.g.:
@@ -973,7 +973,7 @@ If you used 2.x alphas, please [follow these instructions](https://gist.github.c
- `react-scripts`
- [#5218](https://github.com/facebook/create-react-app/pull/5218) Support globalSetup and globalTeardown Jest options ([@gaearon](https://github.com/gaearon))
- [#5073](https://github.com/facebook/create-react-app/pull/5073) Add user defined proxy via middleware ([@Timer](https://github.com/Timer))
- - [#3945](https://github.com/facebook/create-react-app/pull/3945) Allow bundles to be analyzed with Webpack-specific tools ([@joshwcomeau](https://github.com/joshwcomeau))
+ - [#3945](https://github.com/facebook/create-react-app/pull/3945) Allow bundles to be analyzed with webpack-specific tools ([@joshwcomeau](https://github.com/joshwcomeau))
- [#4195](https://github.com/facebook/create-react-app/pull/4195) Sass loader ([@Fabianopb](https://github.com/Fabianopb))
- [#3909](https://github.com/facebook/create-react-app/pull/3909) Add loader for .graphql files ([@petetnt](https://github.com/petetnt))
- [#1288](https://github.com/facebook/create-react-app/pull/1288) Create git repository with initial commit ([@mauricedb](https://github.com/mauricedb))
@@ -988,7 +988,7 @@ If you used 2.x alphas, please [follow these instructions](https://gist.github.c
- [#3865](https://github.com/facebook/create-react-app/pull/3865) Add opt-out for preset-flow to work with @babel/preset-typescript ([@oieduardorabelo](https://github.com/oieduardorabelo))
- [#3675](https://github.com/facebook/create-react-app/pull/3675) add experimental babel-plugin-macros support ([@kentcdodds](https://github.com/kentcdodds))
- `babel-preset-react-app`, `confusing-browser-globals`, `eslint-config-react-app`, `react-dev-utils`, `react-error-overlay`, `react-scripts`
- - [#4077](https://github.com/facebook/create-react-app/pull/4077) Webpack 4 ([@andriijas](https://github.com/andriijas))
+ - [#4077](https://github.com/facebook/create-react-app/pull/4077) webpack 4 ([@andriijas](https://github.com/andriijas))
- `create-react-app`
- [#4350](https://github.com/facebook/create-react-app/pull/4350) Support package distribution tags ([@miraage](https://github.com/miraage))
- `babel-preset-react-app`, `react-scripts`
@@ -1125,7 +1125,7 @@ If you used 2.x alphas, please [follow these instructions](https://gist.github.c
- [#4846](https://github.com/facebook/create-react-app/pull/4846) Update jest version ([@skoging](https://github.com/skoging))
- [#4362](https://github.com/facebook/create-react-app/pull/4362) Bumped jest version to 22.4.1 ([@CGreenburg](https://github.com/CGreenburg))
- `babel-preset-react-app`, `confusing-browser-globals`, `eslint-config-react-app`, `react-dev-utils`, `react-error-overlay`, `react-scripts`
- - [#4077](https://github.com/facebook/create-react-app/pull/4077) Webpack 4 ([@andriijas](https://github.com/andriijas))
+ - [#4077](https://github.com/facebook/create-react-app/pull/4077) webpack 4 ([@andriijas](https://github.com/andriijas))
- `babel-preset-react-app`
- [#4432](https://github.com/facebook/create-react-app/pull/4432) Update babel-plugin-macros to fix a bug ([@stereobooster](https://github.com/stereobooster))
- [#3818](https://github.com/facebook/create-react-app/pull/3818) Remove PropTypes from production build (#209) ([@iansu](https://github.com/iansu))
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 555028b12c9..e78e28f3f06 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,273 @@
+## 3.4.1 (2020-03-20)
+
+v3.4.1 is a maintenance release that includes minor bug fixes and documentation updates including upgrading Babel to fix a bug in the 7.8 release line. This release also brings support for TypeScript 3.8.
+
+#### :bug: Bug Fix
+
+- `react-scripts`
+ - [#8276](https://github.com/facebook/create-react-app/pull/8276) Use native ESLint behaviour when extending ([@mrmckeb](https://github.com/mrmckeb))
+ - [#7203](https://github.com/facebook/create-react-app/pull/7203) Closes webpack dev server and exits process on "end" stdin ([@kelseyleftwich](https://github.com/kelseyleftwich))
+- `babel-preset-react-app`
+ - [#8526](https://github.com/facebook/create-react-app/pull/8526) Fix optional chaining and nullish coalescing support ([@ianschmitz](https://github.com/ianschmitz))
+- `cra-template`, `eslint-config-react-app`, `react-scripts`
+ - [#7790](https://github.com/facebook/create-react-app/pull/7790) Widen eslint-config-react-app peer dependency versions ([@lukyth](https://github.com/lukyth))
+
+#### :nail_care: Enhancement
+
+- `cra-template-typescript`, `cra-template`
+ - [#8558](https://github.com/facebook/create-react-app/pull/8558) Add React.StrictMode to default templates ([@connkat](https://github.com/connkat))
+- `react-scripts`
+ - [#8539](https://github.com/facebook/create-react-app/pull/8539) allow specification of package.main in template.json ([@EvanBoyle](https://github.com/EvanBoyle))
+
+#### :memo: Documentation
+
+- Other
+ - [#8515](https://github.com/facebook/create-react-app/pull/8515) Fix proxying API request docs ([@hjr3](https://github.com/hjr3))
+ - [#8561](https://github.com/facebook/create-react-app/pull/8561) Indicate that the file structure is the template's ([@Vinnl](https://github.com/Vinnl))
+- `react-scripts`
+ - [#8276](https://github.com/facebook/create-react-app/pull/8276) Use native ESLint behaviour when extending ([@mrmckeb](https://github.com/mrmckeb))
+
+#### :hammer: Underlying Tools
+
+- `babel-preset-react-app`, `create-react-app`, `react-dev-utils`, `react-error-overlay`, `react-scripts`
+ - [#8681](https://github.com/facebook/create-react-app/pull/8681) Update to Babel 7.9 ([@ianschmitz](https://github.com/ianschmitz))
+ - [#8620](https://github.com/facebook/create-react-app/pull/8620) Bump dependencies ([@ianschmitz](https://github.com/ianschmitz))
+- `react-scripts`
+ - [#8509](https://github.com/facebook/create-react-app/pull/8509) Bumps pnp-webpack-plugin ([@arcanis](https://github.com/arcanis))
+
+#### Committers: 9
+
+- Brody McKee ([@mrmckeb](https://github.com/mrmckeb))
+- Evan Boyle ([@EvanBoyle](https://github.com/EvanBoyle))
+- Herman J. Radtke III ([@hjr3](https://github.com/hjr3))
+- Ian Schmitz ([@ianschmitz](https://github.com/ianschmitz))
+- Kanitkorn Sujautra ([@lukyth](https://github.com/lukyth))
+- KatCon ([@connkat](https://github.com/connkat))
+- Kelsey Leftwich ([@kelseyleftwich](https://github.com/kelseyleftwich))
+- Maël Nison ([@arcanis](https://github.com/arcanis))
+- Vincent ([@Vinnl](https://github.com/Vinnl))
+
+### Migrating from 3.4.0 to 3.4.1
+
+Inside any created project that has not been ejected, run:
+
+```sh
+npm install --save --save-exact react-scripts@3.4.1
+```
+
+or
+
+```sh
+yarn add --exact react-scripts@3.4.1
+```
+
+## 3.4.0 (2020-02-14)
+
+v3.4.0 is a minor release that adds new features, including support for SSL and setting `PUBLIC_URL` in development. It also includes a fix for Hot Module Reloading with CSS Modules as well as other bug fixes.
+
+#### :bug: Bug Fix
+
+- `react-scripts`
+ - [#8378](https://github.com/facebook/create-react-app/pull/8378) Downgrade style-loader to v0.23.1 due to CSS modules hot reload not working with v1.0.0 and above ([@chybisov](https://github.com/chybisov))
+- `create-react-app`, `react-dev-utils`, `react-error-overlay`
+ - [#8439](https://github.com/facebook/create-react-app/pull/8439) Downgrade chalk for ie 11 support ([@ianschmitz](https://github.com/ianschmitz))
+- `react-dev-utils`
+ - [#8292](https://github.com/facebook/create-react-app/pull/8292) Fixes unchecked access to 'deploy' script on build ([@renato-bohler](https://github.com/renato-bohler))
+- `cra-template-typescript`, `cra-template`
+ - [#8272](https://github.com/facebook/create-react-app/pull/8272) Handle service worker error in Firefox ([@rosinghal](https://github.com/rosinghal))
+- `cra-template-typescript`
+ - [#8403](https://github.com/facebook/create-react-app/pull/8403) Fix robots.txt for TS ([@Kamahl19](https://github.com/Kamahl19))
+
+#### :nail_care: Enhancement
+
+- `react-dev-utils`, `react-scripts`
+ - [#8442](https://github.com/facebook/create-react-app/pull/8442) fix(react-scripts): do not redirect served path if request may proxy ([@iamandrewluca](https://github.com/iamandrewluca))
+ - [#7259](https://github.com/facebook/create-react-app/pull/7259) feat(react-scripts): allow PUBLIC_URL in develoment mode ([@iamandrewluca](https://github.com/iamandrewluca))
+ - [#7750](https://github.com/facebook/create-react-app/pull/7750) Enable custom sockjs pathname for hot reloading server. ([@heygrady](https://github.com/heygrady))
+- `cra-template-typescript`
+ - [#8412](https://github.com/facebook/create-react-app/pull/8412) Change arrow functions to function declarations ([@lewislbr](https://github.com/lewislbr))
+- `cra-template-typescript`, `cra-template`
+ - [#8272](https://github.com/facebook/create-react-app/pull/8272) Handle service worker error in Firefox ([@rosinghal](https://github.com/rosinghal))
+- `react-scripts`
+ - [#5845](https://github.com/facebook/create-react-app/pull/5845) Add option to provide custom ssl certificates during development ([@alexbrazier](https://github.com/alexbrazier))
+
+#### :memo: Documentation
+
+- `cra-template-typescript`, `cra-template`, `react-dev-utils`, `react-error-overlay`, `react-scripts`
+ - [#8475](https://github.com/facebook/create-react-app/pull/8475) Correct webpack name casing ([@lewislbr](https://github.com/lewislbr))
+- Other
+ - [#8437](https://github.com/facebook/create-react-app/pull/8437) Fix navbar line break in header ([@esvyridov](https://github.com/esvyridov))
+ - [#8299](https://github.com/facebook/create-react-app/pull/8299) Update public folder usage docs to clarify globals ([@keevan](https://github.com/keevan))
+ - [#8390](https://github.com/facebook/create-react-app/pull/8390) setupTestFrameworkScriptFile is deprecated ([@JimmyLv](https://github.com/JimmyLv))
+
+#### :hammer: Underlying Tools
+
+- `react-dev-utils`
+ - [#8459](https://github.com/facebook/create-react-app/pull/8459) update open to v7.0.2 ([@vince1995](https://github.com/vince1995))
+ - [#7948](https://github.com/facebook/create-react-app/pull/7948) Support JetBrains Rider IDE as an editor ([@djpowell](https://github.com/djpowell))
+ - [#8367](https://github.com/facebook/create-react-app/pull/8367) Wider Chromium support for openBrowser ([@handeyeco](https://github.com/handeyeco))
+- `react-scripts`
+ - [#8282](https://github.com/facebook/create-react-app/pull/8282) Run git init before template dependencies are installed ([@lukaszfiszer](https://github.com/lukaszfiszer))
+- Other
+ - [#8402](https://github.com/facebook/create-react-app/pull/8402) fix(test): force install npm in e2e-behaviour ([@iamandrewluca](https://github.com/iamandrewluca))
+
+#### Committers: 18
+
+- Alex Brazier ([@alexbrazier](https://github.com/alexbrazier))
+- Andrew Luca ([@iamandrewluca](https://github.com/iamandrewluca))
+- Cassidy Williams ([@cassidoo](https://github.com/cassidoo))
+- Christopher Button ([@devgeist](https://github.com/devgeist))
+- David Powell ([@djpowell](https://github.com/djpowell))
+- Eugene Chybisov ([@chybisov](https://github.com/chybisov))
+- Eugene Sviridov ([@esvyridov](https://github.com/esvyridov))
+- Grady Kuhnline ([@heygrady](https://github.com/heygrady))
+- Ian Schmitz ([@ianschmitz](https://github.com/ianschmitz))
+- Kevin Pham ([@keevan](https://github.com/keevan))
+- Lewis Llobera ([@lewislbr](https://github.com/lewislbr))
+- Martin Litvaj ([@Kamahl19](https://github.com/Kamahl19))
+- Matthew Curtis ([@handeyeco](https://github.com/handeyeco))
+- Renato Böhler ([@renato-bohler](https://github.com/renato-bohler))
+- Rohit Singhal ([@rosinghal](https://github.com/rosinghal))
+- Vincent Semrau ([@vince1995](https://github.com/vince1995))
+- Łukasz Fiszer ([@lukaszfiszer](https://github.com/lukaszfiszer))
+- 吕立青 ([@JimmyLv](https://github.com/JimmyLv))
+
+### Migrating from 3.3.1 to 3.4.0
+
+Inside any created project that has not been ejected, run:
+
+```sh
+npm install --save --save-exact react-scripts@3.4.0
+```
+
+or
+
+```sh
+yarn add --exact react-scripts@3.4.0
+```
+
+## 3.3.1 (2020-01-31)
+
+v3.3.1 is a maintenance release that includes minor bug fixes and documentation updates.
+
+#### :bug: Bug Fix
+
+- `cra-template`
+ - [#8255](https://github.com/facebook/create-react-app/pull/8255) Add "Disallow:" to robots.txt ([@tomoyaf](https://github.com/tomoyaf))
+- `react-scripts`
+ - [#8281](https://github.com/facebook/create-react-app/pull/8281) Fix sass importLoaders ([@mariusc23](https://github.com/mariusc23))
+ - [#8099](https://github.com/facebook/create-react-app/pull/8099) Add titleProp to SVGR ReactComponent type definition ([@rhnorskov](https://github.com/rhnorskov))
+ - [#8028](https://github.com/facebook/create-react-app/pull/8028) fix(react-scripts): proactively append to .gitignore during generation ([@bmuenzenmeyer](https://github.com/bmuenzenmeyer))
+ - [#8106](https://github.com/facebook/create-react-app/pull/8106) Fix CSS font-face minification ([@sidonaldson](https://github.com/sidonaldson))
+- `babel-preset-react-app`
+ - [#8120](https://github.com/facebook/create-react-app/pull/8120) Sync dependencies babel config ([@ianschmitz](https://github.com/ianschmitz))
+- `react-dev-utils`
+ - [#8116](https://github.com/facebook/create-react-app/pull/8116) Add slashes to WebSocket protocol URL ([@Baael](https://github.com/Baael))
+ - [#8079](https://github.com/facebook/create-react-app/pull/8079) webpackHotDevClient now uses wss when https is used ([@mikecaulley](https://github.com/mikecaulley))
+
+#### :nail_care: Enhancement
+
+- `react-error-overlay`
+ - [#6548](https://github.com/facebook/create-react-app/pull/6548) Add helpful message to the footer ([@pyrogenic](https://github.com/pyrogenic))
+- `cra-template-typescript`
+ - [#8177](https://github.com/facebook/create-react-app/pull/8177) Remove React.FC from Typescript template ([@Retsam](https://github.com/Retsam))
+- `cra-template-typescript`, `cra-template`, `react-scripts`
+ - [#8219](https://github.com/facebook/create-react-app/pull/8219) Add template support for any package.json keys (#8082) ([@tomvalorsa](https://github.com/tomvalorsa))
+- `create-react-app`
+ - [#8298](https://github.com/facebook/create-react-app/pull/8298) Support shorthand scoped templates ([@kevin940726](https://github.com/kevin940726))
+ - [#8168](https://github.com/facebook/create-react-app/pull/8168) Add current version and bin location to --info output ([@heyimalex](https://github.com/heyimalex))
+- `cra-template-typescript`, `cra-template`
+ - [#8194](https://github.com/facebook/create-react-app/pull/8194) Replace favicon in templates ([@heyimalex](https://github.com/heyimalex))
+- `eslint-config-react-app`
+ - [#7803](https://github.com/facebook/create-react-app/pull/7803) Remove error for @typescript-eslint/no-namespace ([@szhu](https://github.com/szhu))
+
+#### :memo: Documentation
+
+- Other
+ - [#8380](https://github.com/facebook/create-react-app/pull/8380) docs: Add troubleshooting documentation on ENOSPC ([@huchenme](https://github.com/huchenme))
+ - [#8394](https://github.com/facebook/create-react-app/pull/8394) Update docs according to lint-staged v10 ([@lukyth](https://github.com/lukyth))
+ - [#8307](https://github.com/facebook/create-react-app/pull/8307) Remove outdated docs regarding vscode eslint extension and typescript autofix ([@alex-vukovity-cko](https://github.com/alex-vukovity-cko))
+ - [#8247](https://github.com/facebook/create-react-app/pull/8247) Update setting-up-your-editor.md ([@dev-xu](https://github.com/dev-xu))
+ - [#8092](https://github.com/facebook/create-react-app/pull/8092) Update custom template docs with instructions for testing custom template locally ([@kevinold](https://github.com/kevinold))
+ - [#8293](https://github.com/facebook/create-react-app/pull/8293) Minor grammatical edit ([@egrim](https://github.com/egrim))
+ - [#8212](https://github.com/facebook/create-react-app/pull/8212) Little typo ([@sonyarianto](https://github.com/sonyarianto))
+ - [#8147](https://github.com/facebook/create-react-app/pull/8147) update PWA docs links to point to template package ([@peet](https://github.com/peet))
+ - [#8132](https://github.com/facebook/create-react-app/pull/8132) Add package-runner note to readme ([@JeromeDeLeon](https://github.com/JeromeDeLeon))
+ - [#8111](https://github.com/facebook/create-react-app/pull/8111) chore: update docusaurus & tweak site ([@endiliey](https://github.com/endiliey))
+ - [#8080](https://github.com/facebook/create-react-app/pull/8080) Fix typo in CHANGELOG.md ([@Trontor](https://github.com/Trontor))
+ - [#8077](https://github.com/facebook/create-react-app/pull/8077) Add custom-templates to docs sidebar ([@ianschmitz](https://github.com/ianschmitz))
+- `babel-preset-react-app`
+ - [#8124](https://github.com/facebook/create-react-app/pull/8124) Fix typo in comment: `?.` is right, `.?` is not ([@vadzim](https://github.com/vadzim))
+
+#### :house: Internal
+
+- `create-react-app`
+ - [#8178](https://github.com/facebook/create-react-app/pull/8178) Minor refactors in create-react-app ([@heyimalex](https://github.com/heyimalex))
+
+#### :hammer: Underlying Tools
+
+- `babel-preset-react-app`, `create-react-app`, `react-dev-utils`, `react-error-overlay`, `react-scripts`
+ - [#8353](https://github.com/facebook/create-react-app/pull/8353) Remove outdated babel plugins ([@ianschmitz](https://github.com/ianschmitz))
+ - [#8324](https://github.com/facebook/create-react-app/pull/8324) Update Dependencies ([@RDIL](https://github.com/RDIL))
+ - [#8122](https://github.com/facebook/create-react-app/pull/8122) Fix CI build ([@ianschmitz](https://github.com/ianschmitz))
+- `react-dev-utils`
+ - [#8364](https://github.com/facebook/create-react-app/pull/8364) Downgrade open from 7.0.0 to 6.4.0 ([@vince1995](https://github.com/vince1995))
+ - [#8163](https://github.com/facebook/create-react-app/pull/8163) Bump pkgUp ([@andriijas](https://github.com/andriijas))
+- `babel-plugin-named-asset-import`
+ - [#8171](https://github.com/facebook/create-react-app/pull/8171) Bump babel-plugin-tester and fix breaking changes ([@andriijas](https://github.com/andriijas))
+- `create-react-app`, `react-app-polyfill`, `react-dev-utils`, `react-error-overlay`, `react-scripts`
+ - [#8176](https://github.com/facebook/create-react-app/pull/8176) Bump internal dependencies ([@andriijas](https://github.com/andriijas))
+- `create-react-app`, `react-dev-utils`, `react-error-overlay`
+ - [#8164](https://github.com/facebook/create-react-app/pull/8164) Bump chalk ([@andriijas](https://github.com/andriijas))
+- `react-error-overlay`, `react-scripts`
+ - [#8102](https://github.com/facebook/create-react-app/pull/8102) [Security] Update terser webpack plugin ([@RDIL](https://github.com/RDIL))
+
+#### Committers: 29
+
+- Alex Guerra ([@heyimalex](https://github.com/heyimalex))
+- Alex James Vukovity ([@alex-vukovity-cko](https://github.com/alex-vukovity-cko))
+- Andreas Cederström ([@andriijas](https://github.com/andriijas))
+- Boyuan Xu ([@dev-xu](https://github.com/dev-xu))
+- Brian Muenzenmeyer ([@bmuenzenmeyer](https://github.com/bmuenzenmeyer))
+- Endi ([@endiliey](https://github.com/endiliey))
+- Evan Grim ([@egrim](https://github.com/egrim))
+- Hu Chen ([@huchenme](https://github.com/huchenme))
+- Ian Schmitz ([@ianschmitz](https://github.com/ianschmitz))
+- Jerome De Leon ([@JeromeDeLeon](https://github.com/JeromeDeLeon))
+- Joshua Pollak ([@pyrogenic](https://github.com/pyrogenic))
+- Kai Hao ([@kevin940726](https://github.com/kevin940726))
+- Kanitkorn Sujautra ([@lukyth](https://github.com/lukyth))
+- Kevin Old ([@kevinold](https://github.com/kevinold))
+- Marius Craciunoiu ([@mariusc23](https://github.com/mariusc23))
+- Mike Caulley ([@mikecaulley](https://github.com/mikecaulley))
+- Peet Goddard ([@peet](https://github.com/peet))
+- Rasmus Nørskov ([@rhnorskov](https://github.com/rhnorskov))
+- Reece Dunham ([@RDIL](https://github.com/RDIL))
+- Sean Zhu ([@szhu](https://github.com/szhu))
+- Simon Donaldson ([@sidonaldson](https://github.com/sidonaldson))
+- Sony AK ([@sonyarianto](https://github.com/sonyarianto))
+- Tom Valorsa ([@tomvalorsa](https://github.com/tomvalorsa))
+- Tomoya Fujita ([@tomoyaf](https://github.com/tomoyaf))
+- Vadzim ([@vadzim](https://github.com/vadzim))
+- Vincent Semrau ([@vince1995](https://github.com/vince1995))
+- Wojciech Zieliński ([@Baael](https://github.com/Baael))
+- [@Retsam](https://github.com/Retsam)
+- [@Trontor](https://github.com/Trontor)
+
+### Migrating from 3.3.0 to 3.3.1
+
+Inside any created project that has not been ejected, run:
+
+```sh
+npm install --save --save-exact react-scripts@3.3.1
+```
+
+or
+
+```sh
+yarn add --exact react-scripts@3.3.1
+```
+
## 3.3.0 (2019-12-04)
v3.3.0 is a minor release that adds new features, including custom templates and support for the new optional chaining and nullish coalescing operators.
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index cf94d0dbdac..bb515bb504f 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -94,7 +94,7 @@ All functionality must be retained (and configuration given to the user) if they
2. Run `yarn` in the root `create-react-app` folder.
-Once it is done, you can modify any file locally and run `yarn start`, `yarn test` or `yarn build` like you can in a generated project.
+Once it is done, you can modify any file locally and run `yarn start`, `yarn test` or `yarn build` like you can in a generated project. It will serve the application from the files located in `packages/cra-template/template`.
If you want to try out the end-to-end flow with the global CLI, you can do this too:
diff --git a/README.md b/README.md
index f9e77827afa..55e8b891f20 100644
--- a/README.md
+++ b/README.md
@@ -16,6 +16,7 @@ npx create-react-app my-app
cd my-app
npm start
```
+
If you've previously installed `create-react-app` globally via `npm install -g create-react-app`, we recommend you uninstall the package using `npm uninstall -g create-react-app` to ensure that npx always uses the latest version.
_([npx](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b) comes with npm 5.2+ and higher, see [instructions for older npm versions](https://gist.github.com/gaearon/4064d3c23a77c74a3614c498a8bb1c5f))_
@@ -29,7 +30,7 @@ When you’re ready to deploy to production, create a minified bundle with `npm
### Get Started Immediately
-You **don’t** need to install or configure tools like Webpack or Babel.
+You **don’t** need to install or configure tools like webpack or Babel.
They are preconfigured and hidden so that you can focus on the code. Create a project, and you’re good to go. @@ -85,6 +86,7 @@ my-app ├── index.js ├── logo.svg └── serviceWorker.js + └── setupTests.js ``` No configuration or complicated folder structures, only the files you need to build your app.
@@ -134,7 +136,7 @@ Please refer to the [User Guide](https://facebook.github.io/create-react-app/doc ## Philosophy -- **One Dependency:** There is only one build dependency. It uses Webpack, Babel, ESLint, and other amazing projects, but provides a cohesive curated experience on top of them. +- **One Dependency:** There is only one build dependency. It uses webpack, Babel, ESLint, and other amazing projects, but provides a cohesive curated experience on top of them. - **No Configuration Required:** You don't need to configure anything. A reasonably good configuration of both development and production builds is handled for you so you can focus on writing code. @@ -169,7 +171,7 @@ Here are a few common cases where you might want to try something else: - If you want to **try React** without hundreds of transitive build tool dependencies, consider [using a single HTML file or an online sandbox instead](https://reactjs.org/docs/try-react.html). -- If you need to **integrate React code with a server-side template framework** like Rails, Django or Symfony, or if you’re **not building a single-page app**, consider using [nwb](https://github.com/insin/nwb), or [Neutrino](https://neutrino.js.org/) which are more flexible. For Rails specifically, you can use [Rails Webpacker](https://github.com/rails/webpacker). For Symfony, try [Symfony's Webpack Encore](https://symfony.com/doc/current/frontend/encore/reactjs.html). +- If you need to **integrate React code with a server-side template framework** like Rails, Django or Symfony, or if you’re **not building a single-page app**, consider using [nwb](https://github.com/insin/nwb), or [Neutrino](https://neutrino.js.org/) which are more flexible. For Rails specifically, you can use [Rails Webpacker](https://github.com/rails/webpacker). For Symfony, try [Symfony's webpack Encore](https://symfony.com/doc/current/frontend/encore/reactjs.html). - If you need to **publish a React component**, [nwb](https://github.com/insin/nwb) can [also do this](https://github.com/insin/nwb#react-components-and-libraries), as well as [Neutrino's react-components preset](https://neutrino.js.org/packages/react-components/). diff --git a/azure-pipelines-test-job.yml b/azure-pipelines-test-job.yml index 7073bf3eab6..e3b9d92b669 100644 --- a/azure-pipelines-test-job.yml +++ b/azure-pipelines-test-job.yml @@ -6,10 +6,10 @@ parameters: name: '' testScript: '' configurations: - LinuxNode8: { vmImage: 'ubuntu-16.04', nodeVersion: 8.x } LinuxNode10: { vmImage: 'ubuntu-16.04', nodeVersion: 10.x } - # WindowsNode8: { vmImage: 'vs2017-win2016', nodeVersion: 8.x } - # WindowsNode10: { vmImage: 'vs2017-win2016', nodeVersion: 10.x } + LinuxNode12: { vmImage: 'ubuntu-16.04', nodeVersion: 12.x } + # WindowsNode10: { vmImage: 'windows-latest', nodeVersion: 10.x } + # WindowsNode12: { vmImage: 'windows-latest', nodeVersion: 12.x } jobs: - job: ${{ parameters.name }} diff --git a/azure-pipelines.yml b/azure-pipelines.yml index 0260b309424..6f9f49df877 100644 --- a/azure-pipelines.yml +++ b/azure-pipelines.yml @@ -57,36 +57,23 @@ jobs: name: Behavior testScript: tasks/e2e-behavior.sh configurations: - LinuxNode8: { vmImage: 'ubuntu-16.04', nodeVersion: 8.x } LinuxNode10: { vmImage: 'ubuntu-16.04', nodeVersion: 10.x } - # WindowsNode8: { vmImage: 'vs2017-win2016', nodeVersion: 8.x } - # WindowsNode10: { vmImage: 'vs2017-win2016', nodeVersion: 10.x } - MacNode8: { vmImage: 'macOS-10.13', nodeVersion: 8.x } - MacNode10: { vmImage: 'macOS-10.13', nodeVersion: 10.x } + LinuxNode12: { vmImage: 'ubuntu-16.04', nodeVersion: 12.x } + # WindowsNode10: { vmImage: 'windows-latest', nodeVersion: 10.x } + # WindowsNode12: { vmImage: 'windows-latest', nodeVersion: 12.x } + MacNode10: { vmImage: 'macOS-latest', nodeVersion: 10.x } + MacNode12: { vmImage: 'macOS-latest', nodeVersion: 12.x } # ****************************************************************************** # Old Node test suite # ****************************************************************************** - job: OldNode pool: - vmImage: ubuntu-16.04 + vmImage: ubuntu-latest steps: - task: NodeTool@0 inputs: - versionSpec: 6.x - displayName: 'Install Node.js 6.x' + versionSpec: 8.x + displayName: 'Install Node.js 8.x' - bash: tasks/e2e-old-node.sh displayName: 'Run tests' - # ****************************************************************************** - # Unsupported Node with TypeScript flag - # ****************************************************************************** - - job: UnsupportedNodeWithTypeScript - pool: - vmImage: ubuntu-16.04 - steps: - - task: NodeTool@0 - inputs: - versionSpec: 8.9.x - displayName: 'Install Node.js 8.9.x' - - bash: tasks/e2e-typescript-unsupported-node.sh - displayName: 'Run unsupported TypeScript test' diff --git a/docusaurus/docs/adding-a-stylesheet.md b/docusaurus/docs/adding-a-stylesheet.md index 2dc27b1ed9d..f1dea111bcb 100644 --- a/docusaurus/docs/adding-a-stylesheet.md +++ b/docusaurus/docs/adding-a-stylesheet.md @@ -4,7 +4,7 @@ title: Adding a Stylesheet sidebar_label: Adding Stylesheets --- -This project setup uses [Webpack](https://webpack.js.org/) for handling all assets. Webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**: +This project setup uses [webpack](https://webpack.js.org/) for handling all assets. webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**: ## `Button.css` @@ -18,7 +18,7 @@ This project setup uses [Webpack](https://webpack.js.org/) for handling all asse ```js import React, { Component } from 'react'; -import './Button.css'; // Tell Webpack that Button.js uses these styles +import './Button.css'; // Tell webpack that Button.js uses these styles class Button extends Component { render() { @@ -28,8 +28,8 @@ class Button extends Component { } ``` -**This is not required for React** but many people find this feature convenient. You can read about the benefits of this approach [here](https://medium.com/seek-blog/block-element-modifying-your-javascript-components-d7f99fcab52b). However you should be aware that this makes your code less portable to other build tools and environments than Webpack. +**This is not required for React** but many people find this feature convenient. You can read about the benefits of this approach [here](https://medium.com/seek-blog/block-element-modifying-your-javascript-components-d7f99fcab52b). However you should be aware that this makes your code less portable to other build tools and environments than webpack. In development, expressing dependencies this way allows your styles to be reloaded on the fly as you edit them. In production, all CSS files will be concatenated into a single minified `.css` file in the build output. -If you are concerned about using Webpack-specific semantics, you can put all your CSS right into `src/index.css`. It would still be imported from `src/index.js`, but you could always remove that import if you later migrate to a different build tool. +If you are concerned about using webpack-specific semantics, you can put all your CSS right into `src/index.css`. It would still be imported from `src/index.js`, but you could always remove that import if you later migrate to a different build tool. diff --git a/docusaurus/docs/adding-css-reset.md b/docusaurus/docs/adding-css-reset.md index 23821829c3e..c08567124af 100644 --- a/docusaurus/docs/adding-css-reset.md +++ b/docusaurus/docs/adding-css-reset.md @@ -16,6 +16,8 @@ To start using it, add `@import-normalize;` anywhere in your CSS file(s). You on /* rest of app styles */ ``` +> **Tip**: If you see an "_Unknown at rule @import-normalize css(unknownAtRules)_" warning in VSCode, change the `css.lint.unknownAtRules` setting to `ignore`. + You can control which parts of [normalize.css] to use via your project's [browserslist]. Results when [browserslist] is `last 3 versions`: diff --git a/docusaurus/docs/adding-images-fonts-and-files.md b/docusaurus/docs/adding-images-fonts-and-files.md index 3489670e705..67cc4b53d22 100644 --- a/docusaurus/docs/adding-images-fonts-and-files.md +++ b/docusaurus/docs/adding-images-fonts-and-files.md @@ -3,9 +3,9 @@ id: adding-images-fonts-and-files title: Adding Images, Fonts, and Files --- -With Webpack, using static assets like images and fonts works similarly to CSS. +With webpack, using static assets like images and fonts works similarly to CSS. -You can **`import` a file right in a JavaScript module**. This tells Webpack to include that file in the bundle. Unlike CSS imports, importing a file gives you a string value. This value is the final path you can reference in your code, e.g. as the `src` attribute of an image or the `href` of a link to a PDF. +You can **`import` a file right in a JavaScript module**. This tells webpack to include that file in the bundle. Unlike CSS imports, importing a file gives you a string value. This value is the final path you can reference in your code, e.g. as the `src` attribute of an image or the `href` of a link to a PDF. To reduce the number of requests to the server, importing images that are less than 10,000 bytes returns a [data URI](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs) instead of a path. This applies to the following file extensions: bmp, gif, jpg, jpeg, and png. SVG files are excluded due to [#1153](https://github.com/facebook/create-react-app/issues/1153). You can control the 10,000 byte threshold by setting the `IMAGE_INLINE_SIZE_LIMIT` environment variable as documented in our [advanced configuration](advanced-configuration.md). @@ -13,7 +13,7 @@ Here is an example: ```js import React from 'react'; -import logo from './logo.png'; // Tell Webpack this JS file uses this image +import logo from './logo.png'; // Tell webpack this JS file uses this image console.log(logo); // /logo.84287d09.png @@ -25,7 +25,7 @@ function Header() { export default Header; ``` -This ensures that when the project is built, Webpack will correctly move the images into the build folder, and provide us with correct paths. +This ensures that when the project is built, webpack will correctly move the images into the build folder, and provide us with correct paths. This works in CSS too: @@ -35,9 +35,9 @@ This works in CSS too: } ``` -Webpack finds all relative module references in CSS (they start with `./`) and replaces them with the final paths from the compiled bundle. If you make a typo or accidentally delete an important file, you will see a compilation error, like when you import a non-existent JavaScript module. The final filenames in the compiled bundle are generated by Webpack from content hashes. If the file content changes in the future, Webpack will give it a different name in production so you don’t need to worry about long-term caching of assets. +webpack finds all relative module references in CSS (they start with `./`) and replaces them with the final paths from the compiled bundle. If you make a typo or accidentally delete an important file, you will see a compilation error, like when you import a non-existent JavaScript module. The final filenames in the compiled bundle are generated by webpack from content hashes. If the file content changes in the future, webpack will give it a different name in production so you don’t need to worry about long-term caching of assets. -Please be advised that this is also a custom feature of Webpack. +Please be advised that this is also a custom feature of webpack. **It is not required for React** but many people enjoy it (and React Native uses a similar mechanism for images). @@ -51,12 +51,15 @@ One way to add SVG files was described in the section above. You can also import ```js import { ReactComponent as Logo } from './logo.svg'; -const App = () => ( -) environment variable points to your editor’s bin folder. You can also set it to `none` to disable it completely. |
| CHOKIDAR_USEPOLLING | ✅ Used | 🚫 Ignored | 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. |
@@ -22,5 +25,6 @@ You can adjust various development and production settings by setting environmen
| NODE_PATH | ✅ Used | ✅ Used | Same as [`NODE_PATH` in Node.js](https://nodejs.org/api/modules.html#modules_loading_from_the_global_folders), but only relative folders are allowed. Can be handy for emulating a monorepo setup by setting `NODE_PATH=src`. |
| INLINE_RUNTIME_CHUNK | 🚫 Ignored | ✅ Used | By default, Create React App will embed the runtime script into `index.html` during the production build. When set to `false`, the script will not be embedded and will be imported as usual. This is normally required when dealing with CSP. |
| IMAGE_INLINE_SIZE_LIMIT | 🚫 Ignored | ✅ Used | By default, images smaller than 10,000 bytes are encoded as a data URI in base64 and inlined in the CSS or JS build artifact. Set this to control the size limit in bytes. Setting it to 0 will disable the inlining of images. |
-| EXTEND_ESLINT | ✅ Used | ✅ Used | When set to `true`, ESLint configs that extend `eslint-config-react-app` will be used by `eslint-loader`. Any rules that are set to `"error"` will stop the application from building. |
+| EXTEND_ESLINT | ✅ Used | ✅ Used | When set to `true`, user provided ESLint configs will be used by `eslint-loader`. Note that any rules set to `"error"` will stop the application from building. |
+| FAST_REFRESH | ✅ Used | 🚫 Ignored | When set to `true`, enables experimental support for fast refresh to allow you to tweak your components in real time without reloading the page. |
| TSC_COMPILE_ON_ERROR | ✅ Used | ✅ Used | When set to `true`, you can run and properly build TypeScript projects even if there are TypeScript type check errors. These errors are printed as warnings in the terminal and/or browser console. |
diff --git a/docusaurus/docs/available-scripts.md b/docusaurus/docs/available-scripts.md
index effdc2b7936..808d3d92005 100644
--- a/docusaurus/docs/available-scripts.md
+++ b/docusaurus/docs/available-scripts.md
@@ -30,7 +30,7 @@ Your app is ready to be deployed! See the section about [deployment](deployment.
If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
-Instead, it will copy all the configuration files and the transitive dependencies (Webpack, Babel, ESLint, etc.) into your project as dependencies in `package.json`. Technically, the distinction between dependencies and development dependencies is pretty arbitrary for front-end apps that produce static bundles.
+Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc.) into your project as dependencies in `package.json`. Technically, the distinction between dependencies and development dependencies is pretty arbitrary for front-end apps that produce static bundles.
In addition, it used to cause problems with some hosting platforms that didn't install development dependencies (and thus weren't able to build the project on the server or test it right before deployment). You are free to rearrange your dependencies in `package.json` as you see fit.
diff --git a/docusaurus/docs/custom-templates.md b/docusaurus/docs/custom-templates.md
index 06dd3492350..9ae4ae69741 100644
--- a/docusaurus/docs/custom-templates.md
+++ b/docusaurus/docs/custom-templates.md
@@ -11,16 +11,8 @@ You'll notice that Custom Templates are always named in the format `cra-template
Scoped templates are also supported, under the name `@[scope-name]/cra-template` or `@[scope-name]/cra-template-[template-name]`, which can be installed via `@[scope]` and `@[scope]/[template-name]` respectively.
-### npm
-
-```sh
-npm init react-app my-app --template [template-name]
-```
-
-### Yarn
-
```sh
-yarn create react-app my-app --template [template-name]
+npx create-react-app my-app --template [template-name]
```
## Finding custom templates
@@ -39,7 +31,7 @@ If you're interested in building a custom template, first take a look at how we'
A template must have the following structure:
```
-my-app/
+cra-template-[template-name]/
README.md (for npm)
template.json
package.json
@@ -52,6 +44,14 @@ my-app/
index.js (or index.tsx)
```
+### Testing a template
+
+To test a template locally, pass the file path to the directory of your template source using the `file:` prefix.
+
+```sh
+npx create-react-app my-app --template file:../path/to/your/template/cra-template-[template-name]
+```
+
### The `template` folder
This folder is copied to the user's app directory as Create React App installs. During this process, the file `gitignore` is renamed to `.gitignore`.
@@ -62,7 +62,7 @@ You can add whatever files you want in here, but you must have at least the file
This is the configuration file for your template. As this is a new feature, more options will be added over time. For now, only a `package` key is supported.
-The `package` key lets you provide any keys/values that you want added to the new project's `package.json`, such as dependencies (only dependencies are supported for now) and any custom scripts that your template relies on.
+The `package` key lets you provide any keys/values that you want added to the new project's `package.json`, such as dependencies and any custom scripts that your template relies on.
Below is an example `template.json` file:
diff --git a/docusaurus/docs/folder-structure.md b/docusaurus/docs/folder-structure.md
index 3701132d9f9..f135b635164 100644
--- a/docusaurus/docs/folder-structure.md
+++ b/docusaurus/docs/folder-structure.md
@@ -29,7 +29,7 @@ For the project to build, **these files must exist with exact filenames**:
You can delete or rename the other files.
-You may create subdirectories inside `src`. For faster rebuilds, only files inside `src` are processed by Webpack. You need to **put any JS and CSS files inside `src`**, otherwise Webpack won’t see them.
+You may create subdirectories inside `src`. For faster rebuilds, only files inside `src` are processed by webpack. You need to **put any JS and CSS files inside `src`**, otherwise webpack won’t see them.
Only files inside `public` can be used from `public/index.html`. Read instructions below for using assets from JavaScript and HTML.
diff --git a/docusaurus/docs/getting-started.md b/docusaurus/docs/getting-started.md
index fdd942786bc..9418ca03c07 100644
--- a/docusaurus/docs/getting-started.md
+++ b/docusaurus/docs/getting-started.md
@@ -28,13 +28,13 @@ When you’re ready to deploy to production, create a minified bundle with `npm
### Get Started Immediately
-You **don’t** need to install or configure tools like Webpack or Babel. They are preconfigured and hidden so that you can focus on the code.
+You **don’t** need to install or configure tools like webpack or Babel. They are preconfigured and hidden so that you can focus on the code.
Create a project, and you’re good to go.
## Creating an App
-**You’ll need to have Node >= 8.10 on your local development machine** (but it’s not required on the server). You can use [nvm](https://github.com/creationix/nvm#installation) (macOS/Linux) or [nvm-windows](https://github.com/coreybutler/nvm-windows#node-version-manager-nvm-for-windows) to switch Node versions between different projects.
+**You’ll need to have Node >= 10 on your local development machine** (but it’s not required on the server). You can use [nvm](https://github.com/creationix/nvm#installation) (macOS/Linux) or [nvm-windows](https://github.com/coreybutler/nvm-windows#node-version-manager-nvm-for-windows) to switch Node versions between different projects.
To create a new app, you may choose one of the following methods:
diff --git a/docusaurus/docs/importing-a-component.md b/docusaurus/docs/importing-a-component.md
index 61fc9b0d492..2f4a4c56a69 100644
--- a/docusaurus/docs/importing-a-component.md
+++ b/docusaurus/docs/importing-a-component.md
@@ -3,7 +3,7 @@ id: importing-a-component
title: Importing a Component
---
-This project setup supports ES6 modules thanks to Webpack.
+This project setup supports ES6 modules thanks to webpack.
While you can still use `require()` and `module.exports`, we encourage you to use [`import` and `export`](http://exploringjs.com/es6/ch_modules.html) instead.
diff --git a/docusaurus/docs/integrating-with-an-api-backend.md b/docusaurus/docs/integrating-with-an-api-backend.md
index 60b9b1f43cd..af4da848481 100644
--- a/docusaurus/docs/integrating-with-an-api-backend.md
+++ b/docusaurus/docs/integrating-with-an-api-backend.md
@@ -24,7 +24,6 @@ It allows creating hypermedia and GraphQL APIs in minutes.
It is shipped with an official Progressive Web App generator as well as a dynamic administration interface, both built for Create React App.
Check out [this tutorial](https://api-platform.com/docs/distribution).
-
## C# (ASP.NET Core)
ASP.NET Core has a React project template that uses Create React App. Check out [their documentation](https://docs.microsoft.com/en-us/aspnet/core/client-side/spa/react).
diff --git a/docusaurus/docs/making-a-progressive-web-app.md b/docusaurus/docs/making-a-progressive-web-app.md
index 227b21eb4e6..ba9802e6088 100644
--- a/docusaurus/docs/making-a-progressive-web-app.md
+++ b/docusaurus/docs/making-a-progressive-web-app.md
@@ -15,7 +15,7 @@ following in their [`src/index.js`](https://github.com/facebook/create-react-app
```js
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
-// Learn more about service workers: https://bit.ly/CRA-PWA
+// Learn more about service workers: https://cra.link/PWA
serviceWorker.unregister();
```
diff --git a/docusaurus/docs/proxying-api-requests-in-development.md b/docusaurus/docs/proxying-api-requests-in-development.md
index 3fdfb778069..66563e25e45 100644
--- a/docusaurus/docs/proxying-api-requests-in-development.md
+++ b/docusaurus/docs/proxying-api-requests-in-development.md
@@ -85,7 +85,7 @@ $ yarn add http-proxy-middleware
Next, create `src/setupProxy.js` and place the following contents in it:
```js
-const proxy = require('http-proxy-middleware');
+const { createProxyMiddleware } = require('http-proxy-middleware');
module.exports = function(app) {
// ...
@@ -95,12 +95,12 @@ module.exports = function(app) {
You can now register proxies as you wish! Here's an example using the above `http-proxy-middleware`:
```js
-const proxy = require('http-proxy-middleware');
+const { createProxyMiddleware } = require('http-proxy-middleware');
module.exports = function(app) {
app.use(
'/api',
- proxy({
+ createProxyMiddleware({
target: 'http://localhost:5000',
changeOrigin: true,
})
diff --git a/docusaurus/docs/running-tests.md b/docusaurus/docs/running-tests.md
index f416b64d33f..a757355e018 100644
--- a/docusaurus/docs/running-tests.md
+++ b/docusaurus/docs/running-tests.md
@@ -194,7 +194,7 @@ Similar to `enzyme` you can create a `src/setupTests.js` file to avoid boilerpla
```js
// react-testing-library renders your components to document.body,
// this adds jest-dom's custom assertions
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
```
Here's an example of using `react-testing-library` and `jest-dom` for testing that the `/src/setupTests.js"
+> "setupFilesAfterEnv": ["/src/setupTests.js"]
> }
> ```
diff --git a/docusaurus/docs/setting-up-your-editor.md b/docusaurus/docs/setting-up-your-editor.md
index 95dbaa598b6..4c99126a420 100644
--- a/docusaurus/docs/setting-up-your-editor.md
+++ b/docusaurus/docs/setting-up-your-editor.md
@@ -22,21 +22,6 @@ Some editors, including Sublime Text, Atom, and Visual Studio Code, provide plug
They are not required for linting. You should see the linter output right in your terminal as well as the browser console. If you prefer the lint results to appear right in your editor, please make sure you install an ESLint plugin/extension.
-If you're using TypeScript and Visual Studio Code, the [ESLint Visual Studio Code extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint#overview) currently [doesn't have TypeScript support enabled by default](https://github.com/Microsoft/vscode-eslint/issues/609). To enable TypeScript support in the ESLint extension, add the following to your project's Visual Studio Code settings file, located at `.vscode/settings.json` (you can create this file if it doesn't already exist):
-
-```json
-{
- "eslint.validate": [
- "javascript",
- "javascriptreact",
- { "language": "typescript", "autoFix": true },
- { "language": "typescriptreact", "autoFix": true }
- ]
-}
-```
-
-Now your editor should report the linting warnings.
-
Note that even if you customise your ESLint config, these changes will **only affect the editor integration**. They won’t affect the terminal and in-browser lint output. This is because Create React App intentionally provides a minimal set of rules that find common mistakes.
If you want to enforce a coding style for your project, consider using [Prettier](https://github.com/jlongster/prettier) instead of ESLint style rules.
@@ -50,7 +35,6 @@ Note that any rules set to `"error"` will stop the project from building.
There are a few things to remember:
1. We highly recommend extending the base config, as removing it could introduce hard-to-find issues.
-1. `.eslintignore` files will be respected
1. When working with TypeScript, you'll need to provide an `overrides` object for rules that should _only_ target TypeScript files.
In the below example:
@@ -86,7 +70,7 @@ Visual Studio Code and WebStorm support debugging out of the box with Create Rea
### 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.
+You 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.
Then add the block below to your `launch.json` file and put it inside the `.vscode` folder in your app’s root directory.
@@ -116,7 +100,7 @@ Having problems with VS Code Debugging? Please see their [troubleshooting guide]
### 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.
+You 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.
@@ -128,7 +112,7 @@ The same way you can debug your application in IntelliJ IDEA Ultimate, PhpStorm,
## 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/).
+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.io/playground/).
To format our code whenever we make a commit in git, we need to install the following dependencies:
@@ -166,8 +150,7 @@ Next we add a 'lint-staged' field to the `package.json`, for example:
},
+ "lint-staged": {
+ "src/**/*.{js,jsx,ts,tsx,json,css,scss,md}": [
-+ "prettier --write",
-+ "git add"
++ "prettier --write"
+ ]
+ },
"scripts": {
diff --git a/docusaurus/docs/troubleshooting.md b/docusaurus/docs/troubleshooting.md
index 38892e77a78..0d0b247b2b7 100644
--- a/docusaurus/docs/troubleshooting.md
+++ b/docusaurus/docs/troubleshooting.md
@@ -12,14 +12,32 @@ If this doesn’t happen, try one of the following workarounds:
- Check that your file is imported by your entrypoint. TypeScript will show errors on any of your source files, but webpack only reloads your files if they are directly or indirectly imported by one of your entrypoints.
- If your project is in a Dropbox folder, try moving it out.
-- If the watcher doesn’t see a file called `index.js` and you’re referencing it by the folder name, you [need to restart the watcher](https://github.com/facebook/create-react-app/issues/1164) due to a Webpack bug.
+- If the watcher doesn’t see a file called `index.js` and you’re referencing it by the folder name, you [need to restart the watcher](https://github.com/facebook/create-react-app/issues/1164) due to a webpack bug.
- Some editors like Vim and IntelliJ have a “safe write” feature that currently breaks the watcher. You will need to disable it. Follow the instructions in [“Adjusting Your Text Editor”](https://webpack.js.org/guides/development/#adjusting-your-text-editor).
-- If your project path contains parentheses, try moving the project to a path without them. This is caused by a [Webpack watcher bug](https://github.com/webpack/watchpack/issues/42).
+- If your project path contains parentheses, try moving the project to a path without them. This is caused by a [webpack watcher bug](https://github.com/webpack/watchpack/issues/42).
- On Linux and macOS, you might need to [tweak system settings](https://github.com/webpack/docs/wiki/troubleshooting#not-enough-watchers) to allow more watchers.
- If the project runs inside a virtual machine such as (a Vagrant provisioned) VirtualBox, create an `.env` file in your project directory if it doesn’t exist, and add `CHOKIDAR_USEPOLLING=true` to it. This ensures that the next time you run `npm start`, the watcher uses the polling mode, as necessary inside a VM.
If none of these solutions help please leave a comment [in this thread](https://github.com/facebook/create-react-app/issues/659).
+## `npm start` fail due to watch error
+
+If you are using a Linux operating system and see an error similar to: `ENOSPC: System limit for number of file watchers reached`, you can fix the issue by increasing the `fs.inotify.max_user_watches` setting of your operating system.
+
+If you are running Debian, RedHat, or another similar Linux distribution, run the following in a terminal:
+
+```sh
+echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
+```
+
+If you are running ArchLinux, run the following command instead:
+
+```sh
+echo fs.inotify.max_user_watches=524288 | sudo tee /etc/sysctl.d/40-max-user-watches.conf && sudo sysctl --system
+```
+
+Then paste it in your terminal and press on enter to run it. You could find more information [here](https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers#the-technical-details).
+
## `npm test` hangs or crashes on macOS Sierra
If you run `npm test` and the console gets stuck after printing `react-scripts test` to the console there might be a problem with your [Watchman](https://facebook.github.io/watchman/) installation as described in [facebook/create-react-app#713](https://github.com/facebook/create-react-app/issues/713).
diff --git a/docusaurus/docs/using-https-in-development.md b/docusaurus/docs/using-https-in-development.md
index 3541e356b8e..1d921532d05 100644
--- a/docusaurus/docs/using-https-in-development.md
+++ b/docusaurus/docs/using-https-in-development.md
@@ -32,6 +32,16 @@ HTTPS=true npm start
Note that the server will use a self-signed certificate, so your web browser will almost definitely display a warning upon accessing the page.
+## Custom SSL certificate
+
+To set a custom certificate, set the `SSL_CRT_FILE` and `SSL_KEY_FILE` environment variables to the path of the certificate and key files in the same way you do for `HTTPS` above. Note that you will also need to set `HTTPS=true`.
+
+### Linux, macOS (Bash)
+
+```bash
+HTTPS=true SSL_CRT_FILE=cert.crt SSL_KEY_FILE=cert.key npm start
+```
+
To avoid having to set the environment variable each time, you can either include in the `npm start` script like so:
```json
diff --git a/docusaurus/docs/using-the-public-folder.md b/docusaurus/docs/using-the-public-folder.md
index 378bdb604c3..b2b6874346e 100644
--- a/docusaurus/docs/using-the-public-folder.md
+++ b/docusaurus/docs/using-the-public-folder.md
@@ -24,7 +24,7 @@ This mechanism provides a number of benefits:
However there is an **escape hatch** that you can use to add an asset outside of the module system.
-If you put a file into the `public` folder, it will **not** be processed by Webpack. Instead it will be copied into the build folder untouched. To reference assets in the `public` folder, you need to use an environment variable called `PUBLIC_URL`.
+If you put a file into the `public` folder, it will **not** be processed by webpack. Instead it will be copied into the build folder untouched. To reference assets in the `public` folder, you need to use an environment variable called `PUBLIC_URL`.
Inside `index.html`, you can use it like this:
@@ -61,6 +61,6 @@ The `public` folder is useful as a workaround for a number of less common cases:
- You need a file with a specific name in the build output, such as [`manifest.webmanifest`](https://developer.mozilla.org/en-US/docs/Web/Manifest).
- You have thousands of images and need to dynamically reference their paths.
- You want to include a small script like [`pace.js`](https://github.hubspot.com/pace/docs/welcome/) outside of the bundled code.
-- Some library may be incompatible with Webpack and you have no other option but to include it as a `
If you use it, move it to `src` and add the following line to `` in your HTML: ```html - + ``` #### New Feature @@ -1276,13 +1337,13 @@ Since 0.3.0 added a test runner, we recommend that you add it to the `scripts` s ### Build Dependency (`react-scripts`) -* You can now [proxy requests to an API server](https://github.com/facebook/create-react-app/blob/ef94b0561d5afb9b50b905fa5cd3f94e965c69c0/template/README.md#proxying-api-requests-in-development) without worrying about CORS. ([@gaearon](https://github.com/gaearon) in [#282](https://github.com/facebook/create-react-app/pull/282)) -* You can now [pass custom environment variables](https://github.com/facebook/create-react-app/blob/ef94b0561d5afb9b50b905fa5cd3f94e965c69c0/template/README.md#adding-custom-environment-variables) to your application. ([@eliperelman](https://github.com/eliperelman) in [#342](https://github.com/facebook/create-react-app/pull/342)) -* You can now [use `async` and `await`](https://ponyfoo.com/articles/understanding-javascript-async-await) syntax. ([@gaearon](https://github.com/gaearon) in [#327](https://github.com/facebook/create-react-app/pull/327), [@fson](https://github.com/fson) in [#332](https://github.com/facebook/create-react-app/pull/332)) -* Paths with period in them now load successfully on the development server. ([@mxstbr](https://github.com/mxstbr) in [#422](https://github.com/facebook/create-react-app/pull/422)) -* Images with `.webp` extension are now supported. ([@gafemoyano](https://github.com/gafemoyano) in [#458](https://github.com/facebook/create-react-app/pull/458)) -* The most recent version of React is now added to `package.json`. ([@wdhorton](https://github.com/wdhorton) in [#477](https://github.com/facebook/create-react-app/pull/477)) -* Babel configuration is simplified. ([@kripod](https://github.com/kripod) in [#490](https://github.com/facebook/create-react-app/pull/490)) +- You can now [proxy requests to an API server](https://github.com/facebook/create-react-app/blob/ef94b0561d5afb9b50b905fa5cd3f94e965c69c0/template/README.md#proxying-api-requests-in-development) without worrying about CORS. ([@gaearon](https://github.com/gaearon) in [#282](https://github.com/facebook/create-react-app/pull/282)) +- You can now [pass custom environment variables](https://github.com/facebook/create-react-app/blob/ef94b0561d5afb9b50b905fa5cd3f94e965c69c0/template/README.md#adding-custom-environment-variables) to your application. ([@eliperelman](https://github.com/eliperelman) in [#342](https://github.com/facebook/create-react-app/pull/342)) +- You can now [use `async` and `await`](https://ponyfoo.com/articles/understanding-javascript-async-await) syntax. ([@gaearon](https://github.com/gaearon) in [#327](https://github.com/facebook/create-react-app/pull/327), [@fson](https://github.com/fson) in [#332](https://github.com/facebook/create-react-app/pull/332)) +- Paths with period in them now load successfully on the development server. ([@mxstbr](https://github.com/mxstbr) in [#422](https://github.com/facebook/create-react-app/pull/422)) +- Images with `.webp` extension are now supported. ([@gafemoyano](https://github.com/gafemoyano) in [#458](https://github.com/facebook/create-react-app/pull/458)) +- The most recent version of React is now added to `package.json`. ([@wdhorton](https://github.com/wdhorton) in [#477](https://github.com/facebook/create-react-app/pull/477)) +- Babel configuration is simplified. ([@kripod](https://github.com/kripod) in [#490](https://github.com/facebook/create-react-app/pull/490)) ### Migrating from 0.2.2 to 0.2.3 @@ -1294,15 +1355,15 @@ Newly created projects will use `0.2.3` automatically. You **don’t** need to u ### Build Dependency (`react-scripts`) -* When the bundle size changes, we now display the difference after build. ([@elijahmanor](https://github.com/elijahmanor) in [#340](https://github.com/facebook/create-react-app/pull/340)) -* `npm install`ing a missing dependency now forces a rebuild. ([@gaearon](https://github.com/gaearon) in [#349](https://github.com/facebook/create-react-app/pull/349)) -* Autoprefixer config now includes more commonly supported browsers. ([@kripod](https://github.com/kripod) in [#345](https://github.com/facebook/create-react-app/pull/345)) -* All the configuration is now documented inline so ejecting doesn’t leave you in the dark. ([@gaearon](https://github.com/gaearon) in [#362](https://github.com/facebook/create-react-app/pull/362)) -* `Object.assign()` polyfill is now bundled by default. ([@gaearon](https://github.com/gaearon) in [#399](https://github.com/facebook/create-react-app/pull/399)) -* [React Native Web](https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/) now works out of the box. ([@grigio](https://github.com/grigio) in [#407](https://github.com/facebook/create-react-app/pull/407)) -* Same asset filenames in different folders don’t confuse the server now. ([@arunoda](https://github.com/arunoda) in [#446](https://github.com/facebook/create-react-app/pull/446)) -* The `otf` font format is now supported. ([@A-gambit](https://github.com/A-gambit) in [#434](https://github.com/facebook/create-react-app/pull/434)) -* The `new-cap` linting rule has been disabled thanks to feedback from Immutable.js users. ([@rricard](https://github.com/rricard) in [#470](https://github.com/facebook/create-react-app/pull/470)) +- When the bundle size changes, we now display the difference after build. ([@elijahmanor](https://github.com/elijahmanor) in [#340](https://github.com/facebook/create-react-app/pull/340)) +- `npm install`ing a missing dependency now forces a rebuild. ([@gaearon](https://github.com/gaearon) in [#349](https://github.com/facebook/create-react-app/pull/349)) +- Autoprefixer config now includes more commonly supported browsers. ([@kripod](https://github.com/kripod) in [#345](https://github.com/facebook/create-react-app/pull/345)) +- All the configuration is now documented inline so ejecting doesn’t leave you in the dark. ([@gaearon](https://github.com/gaearon) in [#362](https://github.com/facebook/create-react-app/pull/362)) +- `Object.assign()` polyfill is now bundled by default. ([@gaearon](https://github.com/gaearon) in [#399](https://github.com/facebook/create-react-app/pull/399)) +- [React Native Web](https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/) now works out of the box. ([@grigio](https://github.com/grigio) in [#407](https://github.com/facebook/create-react-app/pull/407)) +- Same asset filenames in different folders don’t confuse the server now. ([@arunoda](https://github.com/arunoda) in [#446](https://github.com/facebook/create-react-app/pull/446)) +- The `otf` font format is now supported. ([@A-gambit](https://github.com/A-gambit) in [#434](https://github.com/facebook/create-react-app/pull/434)) +- The `new-cap` linting rule has been disabled thanks to feedback from Immutable.js users. ([@rricard](https://github.com/rricard) in [#470](https://github.com/facebook/create-react-app/pull/470)) ### Migrating from 0.2.1 to 0.2.2 @@ -1314,12 +1375,12 @@ Newly created projects will use `0.2.2` automatically. You **don’t** need to u ### Build Dependency (`react-scripts`) -* Fixes an issue with `npm start` taking a very long time on OS X with Firewall enabled ([@gaearon](https://github.com/gaearon) in [#319](https://github.com/facebook/create-react-app/pull/319)) -* Fixes an issue with Webpack eating a lot of CPU in some cases ([@dceddia](https://github.com/dceddia) in [#294](https://github.com/facebook/create-react-app/pull/294)) -* We now warn if you import a file with mismatched casing because this breaks the watcher ([@alexzherdev](https://github.com/alexzherdev) in [#266](https://github.com/facebook/create-react-app/pull/266)) -* CSS files specifying `?v=` after asset filenames, such as Font Awesome, now works correctly ([@alexzherdev](https://github.com/alexzherdev) in [#298](https://github.com/facebook/create-react-app/pull/298)) -* Issues with `npm link`ing `react-scripts` have been fixed ([@dallonf](https://github.com/dallonf) in [#277](https://github.com/facebook/create-react-app/pull/277)) -* We now use `/static` prefix for assets both in development and production ([@gaearon](https://github.com/gaearon) in [#278](https://github.com/facebook/create-react-app/pull/278)) +- Fixes an issue with `npm start` taking a very long time on OS X with Firewall enabled ([@gaearon](https://github.com/gaearon) in [#319](https://github.com/facebook/create-react-app/pull/319)) +- Fixes an issue with webpack eating a lot of CPU in some cases ([@dceddia](https://github.com/dceddia) in [#294](https://github.com/facebook/create-react-app/pull/294)) +- We now warn if you import a file with mismatched casing because this breaks the watcher ([@alexzherdev](https://github.com/alexzherdev) in [#266](https://github.com/facebook/create-react-app/pull/266)) +- CSS files specifying `?v=` after asset filenames, such as Font Awesome, now works correctly ([@alexzherdev](https://github.com/alexzherdev) in [#298](https://github.com/facebook/create-react-app/pull/298)) +- Issues with `npm link`ing `react-scripts` have been fixed ([@dallonf](https://github.com/dallonf) in [#277](https://github.com/facebook/create-react-app/pull/277)) +- We now use `/static` prefix for assets both in development and production ([@gaearon](https://github.com/gaearon) in [#278](https://github.com/facebook/create-react-app/pull/278)) ### Migrating from 0.2.0 to 0.2.1 @@ -1331,27 +1392,27 @@ Newly created projects will use `0.2.1` automatically. You **don’t** need to u ### Build Dependency (`react-scripts`) -* You can now enable deployment to GitHub Pages by adding `homepage` field to `package.json` ([@dhruska](https://github.com/dhruska) in [#94](https://github.com/facebook/create-react-app/pull/94)) -* Development server now runs on `0.0.0.0` and works with VirtualBox ([@JWo1F](https://github.com/JWo1F) in [#128](https://github.com/facebook/create-react-app/pull/128)) -* Cloud9 and Nitrous online IDEs are now supported ([@gaearon](http://github.com/gaearon) in [2fe84e](https://github.com/facebook/create-react-app/commit/2fe84ecded55f1d5258d91f9c2c07698ae0d2fb4)) -* When `3000` port is taken, we offer to use another port ([@chocnut](https://github.com/chocnut) in [#101](https://github.com/facebook/create-react-app/pull/101), [2edf21](https://github.com/facebook/create-react-app/commit/2edf2180f2aa6bf647807d0b1fcd95f4cfe4a558)) -* You can now `import` CSS files from npm modules ([@glennreyes](https://github.com/glennreyes) in [#105](https://github.com/facebook/create-react-app/pull/105), [@breaddevil](https://github.com/breaddevil) in [#178](https://github.com/facebook/create-react-app/pull/178)) -* `fetch` and `Promise` polyfills are now always included ([@gaearon](https://github.com/gaearon) in [#235](https://github.com/facebook/create-react-app/pull/235)) -* Regenerator runtime is now included if you use ES6 generators ([@gaearon](https://github.com/gaearon) in [#238](https://github.com/facebook/create-react-app/pull/238)) -* Generated project now contains `.gitignore` ([@npverni](https://github.com/npverni) in [#79](https://github.com/facebook/create-react-app/pull/79), [@chibicode](https://github.com/chibicode) in [#112](https://github.com/facebook/create-react-app/pull/112)) -* ESLint config is now more compatible with Flow ([@gaearon](https://github.com/gaearon) in [#261](https://github.com/facebook/create-react-app/pull/261)) -* A stylistic lint rule about method naming has been removed ([@mxstbr](https://github.com/mxstbr) in [#152](https://github.com/facebook/create-react-app/pull/157)) -* A few unobtrusive accessibility lint rules have been added ([@evcohen](https://github.com/evcohen) in [#175](https://github.com/facebook/create-react-app/pull/175)) -* A `.babelrc` in parent directory no longer causes an error ([@alexzherdev](https://github.com/alexzherdev) in [#236](https://github.com/facebook/create-react-app/pull/236)) -* Files with `.json` extension are now discovered ([@gaearon](https://github.com/gaearon) in [a11d6a](https://github.com/facebook/create-react-app/commit/a11d6a398f487f9163880dd34667b1d3e14b147a)) -* Bug fixes from transitive dependencies are included ([#126](https://github.com/facebook/create-react-app/issues/126)) -* Linting now works with IDEs if you follow [these](https://github.com/facebook/create-react-app/blob/master/template/README.md#display-lint-output-in-the-editor) instructions ([@keyanzhang](https://github.com/keyanzhang) in [#149](https://github.com/facebook/create-react-app/pull/149)) -* After building, we now print gzipped bundle size ([@lvwrence](https://github.com/lvwrence) in [#229](https://github.com/facebook/create-react-app/pull/229)) +- You can now enable deployment to GitHub Pages by adding `homepage` field to `package.json` ([@dhruska](https://github.com/dhruska) in [#94](https://github.com/facebook/create-react-app/pull/94)) +- Development server now runs on `0.0.0.0` and works with VirtualBox ([@JWo1F](https://github.com/JWo1F) in [#128](https://github.com/facebook/create-react-app/pull/128)) +- Cloud9 and Nitrous online IDEs are now supported ([@gaearon](http://github.com/gaearon) in [2fe84e](https://github.com/facebook/create-react-app/commit/2fe84ecded55f1d5258d91f9c2c07698ae0d2fb4)) +- When `3000` port is taken, we offer to use another port ([@chocnut](https://github.com/chocnut) in [#101](https://github.com/facebook/create-react-app/pull/101), [2edf21](https://github.com/facebook/create-react-app/commit/2edf2180f2aa6bf647807d0b1fcd95f4cfe4a558)) +- You can now `import` CSS files from npm modules ([@glennreyes](https://github.com/glennreyes) in [#105](https://github.com/facebook/create-react-app/pull/105), [@breaddevil](https://github.com/breaddevil) in [#178](https://github.com/facebook/create-react-app/pull/178)) +- `fetch` and `Promise` polyfills are now always included ([@gaearon](https://github.com/gaearon) in [#235](https://github.com/facebook/create-react-app/pull/235)) +- Regenerator runtime is now included if you use ES6 generators ([@gaearon](https://github.com/gaearon) in [#238](https://github.com/facebook/create-react-app/pull/238)) +- Generated project now contains `.gitignore` ([@npverni](https://github.com/npverni) in [#79](https://github.com/facebook/create-react-app/pull/79), [@chibicode](https://github.com/chibicode) in [#112](https://github.com/facebook/create-react-app/pull/112)) +- ESLint config is now more compatible with Flow ([@gaearon](https://github.com/gaearon) in [#261](https://github.com/facebook/create-react-app/pull/261)) +- A stylistic lint rule about method naming has been removed ([@mxstbr](https://github.com/mxstbr) in [#152](https://github.com/facebook/create-react-app/pull/157)) +- A few unobtrusive accessibility lint rules have been added ([@evcohen](https://github.com/evcohen) in [#175](https://github.com/facebook/create-react-app/pull/175)) +- A `.babelrc` in parent directory no longer causes an error ([@alexzherdev](https://github.com/alexzherdev) in [#236](https://github.com/facebook/create-react-app/pull/236)) +- Files with `.json` extension are now discovered ([@gaearon](https://github.com/gaearon) in [a11d6a](https://github.com/facebook/create-react-app/commit/a11d6a398f487f9163880dd34667b1d3e14b147a)) +- Bug fixes from transitive dependencies are included ([#126](https://github.com/facebook/create-react-app/issues/126)) +- Linting now works with IDEs if you follow [these](https://github.com/facebook/create-react-app/blob/master/template/README.md#display-lint-output-in-the-editor) instructions ([@keyanzhang](https://github.com/keyanzhang) in [#149](https://github.com/facebook/create-react-app/pull/149)) +- After building, we now print gzipped bundle size ([@lvwrence](https://github.com/lvwrence) in [#229](https://github.com/facebook/create-react-app/pull/229)) ### Global CLI (`create-react-app`) -* It enforces that you have Node >= 4 ([@conorhastings](https://github.com/conorhastings) in [#88](https://github.com/facebook/create-react-app/pull/88)) -* It handles `--version` flag correctly ([@mxstbr](https://github.com/mxstbr) in [#152](https://github.com/facebook/create-react-app/pull/152)) +- It enforces that you have Node >= 4 ([@conorhastings](https://github.com/conorhastings) in [#88](https://github.com/facebook/create-react-app/pull/88)) +- It handles `--version` flag correctly ([@mxstbr](https://github.com/mxstbr) in [#152](https://github.com/facebook/create-react-app/pull/152)) ### Migrating from 0.1.0 to 0.2.0 @@ -1371,4 +1432,4 @@ You may need to fix a few lint warnings about missing `
+You **don’t** need to install or configure tools like webpack or Babel.
They are preconfigured and hidden so that you can focus on the code. Create a project, and you’re good to go. @@ -85,6 +86,7 @@ my-app ├── index.js ├── logo.svg └── serviceWorker.js + └── setupTests.js ``` No configuration or complicated folder structures, only the files you need to build your app.
@@ -134,7 +136,7 @@ Please refer to the [User Guide](https://facebook.github.io/create-react-app/doc ## Philosophy -- **One Dependency:** There is only one build dependency. It uses Webpack, Babel, ESLint, and other amazing projects, but provides a cohesive curated experience on top of them. +- **One Dependency:** There is only one build dependency. It uses webpack, Babel, ESLint, and other amazing projects, but provides a cohesive curated experience on top of them. - **No Configuration Required:** You don't need to configure anything. A reasonably good configuration of both development and production builds is handled for you so you can focus on writing code. @@ -169,7 +171,7 @@ Here are a few common cases where you might want to try something else: - If you want to **try React** without hundreds of transitive build tool dependencies, consider [using a single HTML file or an online sandbox instead](https://reactjs.org/docs/try-react.html). -- If you need to **integrate React code with a server-side template framework** like Rails, Django or Symfony, or if you’re **not building a single-page app**, consider using [nwb](https://github.com/insin/nwb), or [Neutrino](https://neutrino.js.org/) which are more flexible. For Rails specifically, you can use [Rails Webpacker](https://github.com/rails/webpacker). For Symfony, try [Symfony's Webpack Encore](https://symfony.com/doc/current/frontend/encore/reactjs.html). +- If you need to **integrate React code with a server-side template framework** like Rails, Django or Symfony, or if you’re **not building a single-page app**, consider using [nwb](https://github.com/insin/nwb), or [Neutrino](https://neutrino.js.org/) which are more flexible. For Rails specifically, you can use [Rails Webpacker](https://github.com/rails/webpacker). For Symfony, try [Symfony's webpack Encore](https://symfony.com/doc/current/frontend/encore/reactjs.html). - If you need to **publish a React component**, [nwb](https://github.com/insin/nwb) can [also do this](https://github.com/insin/nwb#react-components-and-libraries), as well as [Neutrino's react-components preset](https://neutrino.js.org/packages/react-components/). diff --git a/azure-pipelines-test-job.yml b/azure-pipelines-test-job.yml index 7073bf3eab6..e3b9d92b669 100644 --- a/azure-pipelines-test-job.yml +++ b/azure-pipelines-test-job.yml @@ -6,10 +6,10 @@ parameters: name: '' testScript: '' configurations: - LinuxNode8: { vmImage: 'ubuntu-16.04', nodeVersion: 8.x } LinuxNode10: { vmImage: 'ubuntu-16.04', nodeVersion: 10.x } - # WindowsNode8: { vmImage: 'vs2017-win2016', nodeVersion: 8.x } - # WindowsNode10: { vmImage: 'vs2017-win2016', nodeVersion: 10.x } + LinuxNode12: { vmImage: 'ubuntu-16.04', nodeVersion: 12.x } + # WindowsNode10: { vmImage: 'windows-latest', nodeVersion: 10.x } + # WindowsNode12: { vmImage: 'windows-latest', nodeVersion: 12.x } jobs: - job: ${{ parameters.name }} diff --git a/azure-pipelines.yml b/azure-pipelines.yml index 0260b309424..6f9f49df877 100644 --- a/azure-pipelines.yml +++ b/azure-pipelines.yml @@ -57,36 +57,23 @@ jobs: name: Behavior testScript: tasks/e2e-behavior.sh configurations: - LinuxNode8: { vmImage: 'ubuntu-16.04', nodeVersion: 8.x } LinuxNode10: { vmImage: 'ubuntu-16.04', nodeVersion: 10.x } - # WindowsNode8: { vmImage: 'vs2017-win2016', nodeVersion: 8.x } - # WindowsNode10: { vmImage: 'vs2017-win2016', nodeVersion: 10.x } - MacNode8: { vmImage: 'macOS-10.13', nodeVersion: 8.x } - MacNode10: { vmImage: 'macOS-10.13', nodeVersion: 10.x } + LinuxNode12: { vmImage: 'ubuntu-16.04', nodeVersion: 12.x } + # WindowsNode10: { vmImage: 'windows-latest', nodeVersion: 10.x } + # WindowsNode12: { vmImage: 'windows-latest', nodeVersion: 12.x } + MacNode10: { vmImage: 'macOS-latest', nodeVersion: 10.x } + MacNode12: { vmImage: 'macOS-latest', nodeVersion: 12.x } # ****************************************************************************** # Old Node test suite # ****************************************************************************** - job: OldNode pool: - vmImage: ubuntu-16.04 + vmImage: ubuntu-latest steps: - task: NodeTool@0 inputs: - versionSpec: 6.x - displayName: 'Install Node.js 6.x' + versionSpec: 8.x + displayName: 'Install Node.js 8.x' - bash: tasks/e2e-old-node.sh displayName: 'Run tests' - # ****************************************************************************** - # Unsupported Node with TypeScript flag - # ****************************************************************************** - - job: UnsupportedNodeWithTypeScript - pool: - vmImage: ubuntu-16.04 - steps: - - task: NodeTool@0 - inputs: - versionSpec: 8.9.x - displayName: 'Install Node.js 8.9.x' - - bash: tasks/e2e-typescript-unsupported-node.sh - displayName: 'Run unsupported TypeScript test' diff --git a/docusaurus/docs/adding-a-stylesheet.md b/docusaurus/docs/adding-a-stylesheet.md index 2dc27b1ed9d..f1dea111bcb 100644 --- a/docusaurus/docs/adding-a-stylesheet.md +++ b/docusaurus/docs/adding-a-stylesheet.md @@ -4,7 +4,7 @@ title: Adding a Stylesheet sidebar_label: Adding Stylesheets --- -This project setup uses [Webpack](https://webpack.js.org/) for handling all assets. Webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**: +This project setup uses [webpack](https://webpack.js.org/) for handling all assets. webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**: ## `Button.css` @@ -18,7 +18,7 @@ This project setup uses [Webpack](https://webpack.js.org/) for handling all asse ```js import React, { Component } from 'react'; -import './Button.css'; // Tell Webpack that Button.js uses these styles +import './Button.css'; // Tell webpack that Button.js uses these styles class Button extends Component { render() { @@ -28,8 +28,8 @@ class Button extends Component { } ``` -**This is not required for React** but many people find this feature convenient. You can read about the benefits of this approach [here](https://medium.com/seek-blog/block-element-modifying-your-javascript-components-d7f99fcab52b). However you should be aware that this makes your code less portable to other build tools and environments than Webpack. +**This is not required for React** but many people find this feature convenient. You can read about the benefits of this approach [here](https://medium.com/seek-blog/block-element-modifying-your-javascript-components-d7f99fcab52b). However you should be aware that this makes your code less portable to other build tools and environments than webpack. In development, expressing dependencies this way allows your styles to be reloaded on the fly as you edit them. In production, all CSS files will be concatenated into a single minified `.css` file in the build output. -If you are concerned about using Webpack-specific semantics, you can put all your CSS right into `src/index.css`. It would still be imported from `src/index.js`, but you could always remove that import if you later migrate to a different build tool. +If you are concerned about using webpack-specific semantics, you can put all your CSS right into `src/index.css`. It would still be imported from `src/index.js`, but you could always remove that import if you later migrate to a different build tool. diff --git a/docusaurus/docs/adding-css-reset.md b/docusaurus/docs/adding-css-reset.md index 23821829c3e..c08567124af 100644 --- a/docusaurus/docs/adding-css-reset.md +++ b/docusaurus/docs/adding-css-reset.md @@ -16,6 +16,8 @@ To start using it, add `@import-normalize;` anywhere in your CSS file(s). You on /* rest of app styles */ ``` +> **Tip**: If you see an "_Unknown at rule @import-normalize css(unknownAtRules)_" warning in VSCode, change the `css.lint.unknownAtRules` setting to `ignore`. + You can control which parts of [normalize.css] to use via your project's [browserslist]. Results when [browserslist] is `last 3 versions`: diff --git a/docusaurus/docs/adding-images-fonts-and-files.md b/docusaurus/docs/adding-images-fonts-and-files.md index 3489670e705..67cc4b53d22 100644 --- a/docusaurus/docs/adding-images-fonts-and-files.md +++ b/docusaurus/docs/adding-images-fonts-and-files.md @@ -3,9 +3,9 @@ id: adding-images-fonts-and-files title: Adding Images, Fonts, and Files --- -With Webpack, using static assets like images and fonts works similarly to CSS. +With webpack, using static assets like images and fonts works similarly to CSS. -You can **`import` a file right in a JavaScript module**. This tells Webpack to include that file in the bundle. Unlike CSS imports, importing a file gives you a string value. This value is the final path you can reference in your code, e.g. as the `src` attribute of an image or the `href` of a link to a PDF. +You can **`import` a file right in a JavaScript module**. This tells webpack to include that file in the bundle. Unlike CSS imports, importing a file gives you a string value. This value is the final path you can reference in your code, e.g. as the `src` attribute of an image or the `href` of a link to a PDF. To reduce the number of requests to the server, importing images that are less than 10,000 bytes returns a [data URI](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs) instead of a path. This applies to the following file extensions: bmp, gif, jpg, jpeg, and png. SVG files are excluded due to [#1153](https://github.com/facebook/create-react-app/issues/1153). You can control the 10,000 byte threshold by setting the `IMAGE_INLINE_SIZE_LIMIT` environment variable as documented in our [advanced configuration](advanced-configuration.md). @@ -13,7 +13,7 @@ Here is an example: ```js import React from 'react'; -import logo from './logo.png'; // Tell Webpack this JS file uses this image +import logo from './logo.png'; // Tell webpack this JS file uses this image console.log(logo); // /logo.84287d09.png @@ -25,7 +25,7 @@ function Header() { export default Header; ``` -This ensures that when the project is built, Webpack will correctly move the images into the build folder, and provide us with correct paths. +This ensures that when the project is built, webpack will correctly move the images into the build folder, and provide us with correct paths. This works in CSS too: @@ -35,9 +35,9 @@ This works in CSS too: } ``` -Webpack finds all relative module references in CSS (they start with `./`) and replaces them with the final paths from the compiled bundle. If you make a typo or accidentally delete an important file, you will see a compilation error, like when you import a non-existent JavaScript module. The final filenames in the compiled bundle are generated by Webpack from content hashes. If the file content changes in the future, Webpack will give it a different name in production so you don’t need to worry about long-term caching of assets. +webpack finds all relative module references in CSS (they start with `./`) and replaces them with the final paths from the compiled bundle. If you make a typo or accidentally delete an important file, you will see a compilation error, like when you import a non-existent JavaScript module. The final filenames in the compiled bundle are generated by webpack from content hashes. If the file content changes in the future, webpack will give it a different name in production so you don’t need to worry about long-term caching of assets. -Please be advised that this is also a custom feature of Webpack. +Please be advised that this is also a custom feature of webpack. **It is not required for React** but many people enjoy it (and React Native uses a similar mechanism for images). @@ -51,12 +51,15 @@ One way to add SVG files was described in the section above. You can also import ```js import { ReactComponent as Logo } from './logo.svg'; -const App = () => ( -
- {/* Logo is an actual React component */}
-
-);
+
+function App() {
+ return (
+
+ {/* Logo is an actual React component */}
+
+ );
+}
```
This is handy if you don't want to load SVG as a separate file. Don't forget the curly braces in the import! The `ReactComponent` import name is significant and tells Create React App that you want a React component that renders an SVG, rather than its filename.
diff --git a/docusaurus/docs/advanced-configuration.md b/docusaurus/docs/advanced-configuration.md
index 871edd2f49d..fb71df0e231 100644
--- a/docusaurus/docs/advanced-configuration.md
+++ b/docusaurus/docs/advanced-configuration.md
@@ -14,7 +14,10 @@ You can adjust various development and production settings by setting environmen
| HOST | ✅ Used | 🚫 Ignored | By default, the development web server binds to all hostnames on the device (`localhost`, LAN network address, etc.). You may use this variable to specify a different host. |
| PORT | ✅ Used | 🚫 Ignored | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. |
| HTTPS | ✅ Used | 🚫 Ignored | When set to `true`, Create React App will run the development server in `https` mode. |
-| PUBLIC_URL | 🚫 Ignored | ✅ Used | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](deployment#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. |
+| WDS_SOCKET_HOST | ✅ Used | 🚫 Ignored | When set, Create React App will run the development server with a custom websocket hostname for hot module reloading. Normally, `webpack-dev-server` defaults to `window.location.hostname` for the SockJS hostname. You may use this variable to start local development on more than one Create React App project at a time. See [webpack-dev-server documentation](https://webpack.js.org/configuration/dev-server/#devserversockhost) for more details. |
+| WDS_SOCKET_PATH | ✅ Used | 🚫 Ignored | When set, Create React App will run the development server with a custom websocket path for hot module reloading. Normally, `webpack-dev-server` defaults to `/sockjs-node` for the SockJS pathname. You may use this variable to start local development on more than one Create React App project at a time. See [webpack-dev-server documentation](https://webpack.js.org/configuration/dev-server/#devserversockpath) for more details. |
+| WDS_SOCKET_PORT | ✅ Used | 🚫 Ignored | When set, Create React App will run the development server with a custom websocket port for hot module reloading. Normally, `webpack-dev-server` defaults to `window.location.port` for the SockJS port. You may use this variable to start local development on more than one Create React App project at a time. See [webpack-dev-server documentation](https://webpack.js.org/configuration/dev-server/#devserversockport) for more details. |
+| PUBLIC_URL | ✅ Used | ✅ Used | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](deployment#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 | ✅ Used | ✅ Used | 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 | ✅ Used | 🚫 Ignored | 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/facebook/create-react-app/issues/2636). Setting this environment variable overrides the automatic detection. If you do it, make sure your systems [PATH](