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.
Custom Templates
You can now create a new app using custom templates.
We’ve published our existing templates ascra-template
andcra-template-typescript
, but we expect to see many great templates from the community over the coming weeks.
The below command shows how you can create a new app withcra-template-typescript
.
npx create-react-app my-app --template typescript
Note that you can omit the prefixcra-template -
when specifying which template you would like. For TypeScript users, we’re deprecating- typescript
in favor of- template typescript
.
If you don’t set a template, we’ll create your new app withcra-template
– which is just a new name for our base template.
Optional Chaining and Nullish Coalescing Operators
We now support theoptional chainingandnullish coalescingoperators!
//Optional chaininga?. ();//undefined if `a` is null / undefinedB?.c;//undefined if `b` is null / undefined//Nullish coalescingundefined??'some other default';//result: 'some other default'null??'some other default';//result: 'some other default'''''??'some other default';//result: ''0??300;//result: 0false??true;//result: false
If your’re using TypeScript, you will need to upgrade yourtypescript
dependency to3.7.0
or later if you wish to use the new operators.
If you’re using Visual Studio Code 1. 40 (the latest as of this release) or earlier, you will need to configure your editor if you want it to understand the new operators.
If you’re using TypeScript in your project and have already upgrade its version as described above, then you canconfigure VS Code toUse Workspace Version
of TypeScript. If your project isn’t using TypeScript, you can use theJavaScript and TypeScript Nightly extensionuntil VS Code releases a newer version including TypeScript3.7.0
or newer.
Numeric Separators
We’ve added support fornumeric separatorsto improve readability of numeric literals.
1000000000;//Is this a billion? a hundred millions? Ten millions?101475938. 38;//what scale is this? what power of 10?1 _ 000 _ 000 _ 000;//Ah, so a billion101 _ 475 _ 938.38;//And this is hundreds of millions
No *** unexpected-multiline
We’ve removed this rule as it is not compatible with Prettier. If you rely on this rule you can re-enable it byextending our ESLint configand adding the following:
{ "extends":"react-app", "rules": { "no-unexpected-multiline":"warn" } }
(🚀) **************************** (New Feature)
babel-preset-react-app
- # 7438Add optional chaining and nullish coalescing operators support (@ renatoagds)
babel-preset-react- app
,react-dev-utils
- # 7817Add numeric separator support (@Tharun 208)
cra-template-typescript
,cra-template
,create-react-app
,react-scripts
💥 Breaking Change
-
create-react-app
,react-dev- utils
,react-scripts
-
# 7988Bump webpack-dev-server (@ ianschmitz)
NOTE: This is only a breaking change if you’re usingreact-dev-utils
outside of Create React App.
🐛 Bug Fix
eslint-config-react-app
create-react-app
react-scripts
- # 7860Mark TypeScript as an optional peer dependency for react-scripts (@ dstaley)
- # 7822Fix absolute paths issue in Jest (@ rovansteen)
- # 7796Fixed process type in TypeScript template. (@ fuszenecker)
react-dev-utils
💅 Enhancement
cra-template-typescript
,cra-template
- # 8005Prefix apple-touch-icon links with PUBLIC_URL ( @ benblank)
- (#) Add@ testing-libraryto the default templates (@ kentcdodds)
react-scripts
- # 7989Add scripts support to templates (@ mrmckeb)
- (#) Add restoreMocks to supported jest config keys (@ ianschmitz)
- # 6352Add additional information for postcss errors (# 6282) (@ buildbreakdo)
- # 6753Add Service-Worker header to checkValidServiceWorker (@ darthmaim)
- # 7832feat: add additional Jest keys to whitelist (@ mrmckeb)
- # 7022Fix node_modules sourcemap config (which will fix VSCode debugging of CRA apps) ( (@justingrant) )
cra-template
create-react-app
,react-error-overlay
- # 7052Dark scheme overlay (@ Fabianopb)
babel-preset-react- app
(📝) **************************** (Documentation)
- Other
- # 8050Update template docs (@ mrmckeb)
- # 7995Add contributors section to readme (@ ianschmitz)
- # 7896chore: Fix broken link for e2e README (@ haruelrovix)
- # 7874Bump docusaurus ((@ andriijas)
- # 7819
📖 (DOC: Improvement)@ waahab)
- # 7853Update adding-bootstrap .md ( (@ Xuhao) )
- # 7849chore: update README.md gif links (@ cchanxzy)
- # 7840Link to A SP.NET Core docs (@ Daniel 15))
- # 7841Update getting-started.md (@ reactjser)
- # 7809Add a note about .eslintignore files being respected (@ seanlaff)
- # 7686Link to React documentation for code splitting ( @ Hugodby)
- # 7785Upgrade to docusaurus 2 ( @ endiliey)
- # 7824Fix grammar error in troubleshooting.md (@Jakeboone 02)
- # 7823Document correct default behavior for HOST var ( @ jsejcksn)
- # 7815Tightens up the TypeScript docs (@ orta)
- # 7813Clarify dynamic import stage in docs (@ aprilandjan)
react-dev-utils
,react-scripts
babel-preset-react- app
react-dev-utils
- # 7897chore: Fix broken link for CRA deployment (@ haruelrovix)
react-scripts
*** Internal
react-scripts
- Other
eslint-config-react- app
- # 8003Use @ typescript-eslint / no-unused-expressions to support optional chaining (@ maxdavidson)
create-react-app
cra-template-typescript
- (#) (Make base and TypeScript templates consistent) @ suprj)
create-react-app
,react-dev-utils
,react-scripts
- # (Temporarily disable Windows in CI)@ ianschmitz)
🔨 Underlying Tools
babel-preset-react-app
,cra-template-typescript
,cra-template
,create-react-app
,react-dev-utils
,react-error-overlay
,react-scripts
- # 8024Bump dependencies ( @ ianschmitz)
create-react-app
,react-dev-utils
,react-scripts
- # 7988 (Bump webpack-dev-server)@ ianschmitz)
- # 7876Bump styling related loaders (@ andriijas)
react-app-polyfill
- # 7999Unpin dependencies in react-app-polyfill (@ianschmitz)
babel-preset-react- app
,react-app-polyfill
,react-dev-utils
,react-scripts
- # 7986Bump dependencies (@ianschmitz)
react-scripts
- # 7956 (Upgrade jest-watch-typeahead)@ Andarist)
- # 7870Fix eslint complaints in build. JS (@ andriijas)
- # 7857feat: upgrade terser & enable parallel minification in wsl (@ endiliey)
- # 7856Move unused eslint webpack import into @ remove-on-eject block (@ mrseanbaines)
babel-preset-react- app
,cra-template-typescript
,create-react-app
,react-app-polyfill
,react-dev-utils
,react-error-overlay
,react-scripts
- # 7951Fix CI (@ ianschmitz)
react-dev-utils
- # 7910Update open@ andriijas)
babel-plugin-named- asset-import
,babel-preset-react-app
,react-error-overlay
,react-scripts
react-error-overlay
,react-scripts
- # 7875Bump react (@ andriijas)
Committers: 42
(Abdul Wahab) ******************************************************************************************************************************************************** (⚡️) (@ waahab)
- Alex Guerra (@ heyimalex)
- Ali Waseem (@ awaseem)
- Andreas Cederström (@ andriijas)
- Ben Blank (@ benblank)
- Brody McKee (@ mrmckeb)
- Chun (@ cchanxzy)
- Damian Senn (@ topaxi)
- Daniel Lo Nigro@ Daniel 15)
- Donavon West@ donavon)
- Dylan Staley (@ dstaley)
- Endi (@ endiliey)
- Fabiano Brito (@ Fabianopb)
- Guillaume Hertault@ GuiHash)
- Havit Rovik (@ haruelrovix)
- Hugo David-Boyet ( @ Hugodby)
- Ian Schmitz@ ianschmitz)
- Ian Sutherland@ iansu)
- Jake Boone@Jakeboone 02)
- Jesse Jackson (@ jsejcksn)
- Jonathan Felchlin ( @ GreenGremlin)
- Joshua Robinson@ buildbreakdo)
- Justin Grant@ justingrant)
- Kanitkorn Sujautra (@ lukyth)
- Kent C. Dodds (@ kentcdodds)
- Klas Björkqvist (@ klasbj)
- Mateusz Burzyński@ Andarist)
- Max Davidson@ maxdavidson)
- May (@ aprilandjan)
- Orta ( (@ orta) )
- RJ (@ suprj)
- Renato Augusto Gama dos Santos (@ Renatoagds)
- Robert FUSZENECKER@ fuszenecker)
- Robert van Steen (@Rovansteen)
- Sean Baines@ mrseanbaines)
- Sean Lafferty ( @ seanlaff)
- Tharun Rajendran (@Tharun 208)
- Tomáš Hübelbauer (@ TomasHubelbauer)
- Wataru Ashihara (@ wataash)
- Xuhao (@ Xuhao)
- @ reactjser
- darthmaim (@ darthmaim)
Migrating from 3.2.0 to 3.3.0
babel-preset-react-app
- # 7438Add optional chaining and nullish coalescing operators support (@ renatoagds)
babel-preset-react- app
,react-dev-utils
- # 7817Add numeric separator support (@Tharun 208)
cra-template-typescript
,cra-template
,create-react-app
,react-scripts
create-react-app
,react-dev- utils
,react-scripts
-
# 7988Bump webpack-dev-server (@ ianschmitz)
NOTE: This is only a breaking change if you’re using
react-dev-utils
outside of Create React App.
eslint-config-react-app
create-react-app
react-scripts
- # 7860Mark TypeScript as an optional peer dependency for react-scripts (@ dstaley)
- # 7822Fix absolute paths issue in Jest (@ rovansteen)
- # 7796Fixed process type in TypeScript template. (@ fuszenecker)
react-dev-utils
cra-template-typescript
,cra-template
- # 8005Prefix apple-touch-icon links with PUBLIC_URL ( @ benblank)
- (#) Add@ testing-libraryto the default templates (@ kentcdodds)
react-scripts
- # 7989Add scripts support to templates (@ mrmckeb)
- (#) Add restoreMocks to supported jest config keys (@ ianschmitz)
- # 6352Add additional information for postcss errors (# 6282) (@ buildbreakdo)
- # 6753Add Service-Worker header to checkValidServiceWorker (@ darthmaim)
- # 7832feat: add additional Jest keys to whitelist (@ mrmckeb)
- # 7022Fix node_modules sourcemap config (which will fix VSCode debugging of CRA apps) ( (@justingrant) )
cra-template
create-react-app
,react-error-overlay
- # 7052Dark scheme overlay (@ Fabianopb)
babel-preset-react- app
- Other
- # 8050Update template docs (@ mrmckeb)
- # 7995Add contributors section to readme (@ ianschmitz)
- # 7896chore: Fix broken link for e2e README (@ haruelrovix)
- # 7874Bump docusaurus ((@ andriijas)
- # 7819
📖 (DOC: Improvement)@ waahab) - # 7853Update adding-bootstrap .md ( (@ Xuhao) )
- # 7849chore: update README.md gif links (@ cchanxzy)
- # 7840Link to A SP.NET Core docs (@ Daniel 15))
- # 7841Update getting-started.md (@ reactjser)
- # 7809Add a note about .eslintignore files being respected (@ seanlaff)
- # 7686Link to React documentation for code splitting ( @ Hugodby)
- # 7785Upgrade to docusaurus 2 ( @ endiliey)
- # 7824Fix grammar error in troubleshooting.md (@Jakeboone 02)
- # 7823Document correct default behavior for HOST var ( @ jsejcksn)
- # 7815Tightens up the TypeScript docs (@ orta)
- # 7813Clarify dynamic import stage in docs (@ aprilandjan)
react-dev-utils
,react-scripts
babel-preset-react- app
react-dev-utils
- # 7897chore: Fix broken link for CRA deployment (@ haruelrovix)
react-scripts
*** Internal
react-scripts
- Other
eslint-config-react- app
- # 8003Use @ typescript-eslint / no-unused-expressions to support optional chaining (@ maxdavidson)
create-react-app
cra-template-typescript
- (#) (Make base and TypeScript templates consistent) @ suprj)
create-react-app
,react-dev-utils
,react-scripts
- # (Temporarily disable Windows in CI)@ ianschmitz)
🔨 Underlying Tools
babel-preset-react-app
,cra-template-typescript
,cra-template
,create-react-app
,react-dev-utils
,react-error-overlay
,react-scripts
- # 8024Bump dependencies ( @ ianschmitz)
create-react-app
,react-dev-utils
,react-scripts
- # 7988 (Bump webpack-dev-server)@ ianschmitz)
- # 7876Bump styling related loaders (@ andriijas)
react-app-polyfill
- # 7999Unpin dependencies in react-app-polyfill (@ianschmitz)
babel-preset-react- app
,react-app-polyfill
,react-dev-utils
,react-scripts
- # 7986Bump dependencies (@ianschmitz)
react-scripts
- # 7956 (Upgrade jest-watch-typeahead)@ Andarist)
- # 7870Fix eslint complaints in build. JS (@ andriijas)
- # 7857feat: upgrade terser & enable parallel minification in wsl (@ endiliey)
- # 7856Move unused eslint webpack import into @ remove-on-eject block (@ mrseanbaines)
babel-preset-react- app
,cra-template-typescript
,create-react-app
,react-app-polyfill
,react-dev-utils
,react-error-overlay
,react-scripts
- # 7951Fix CI (@ ianschmitz)
react-dev-utils
- # 7910Update open@ andriijas)
babel-plugin-named- asset-import
,babel-preset-react-app
,react-error-overlay
,react-scripts
react-error-overlay
,react-scripts
- # 7875Bump react (@ andriijas)
Committers: 42
- (Abdul Wahab) ******************************************************************************************************************************************************** (⚡️) (@ waahab)
- Alex Guerra (@ heyimalex)
- Ali Waseem (@ awaseem)
- Andreas Cederström (@ andriijas)
- Ben Blank (@ benblank)
- Brody McKee (@ mrmckeb)
- Chun (@ cchanxzy)
- Damian Senn (@ topaxi)
- Daniel Lo Nigro@ Daniel 15)
- Donavon West@ donavon)
- Dylan Staley (@ dstaley)
- Endi (@ endiliey)
- Fabiano Brito (@ Fabianopb)
- Guillaume Hertault@ GuiHash)
- Havit Rovik (@ haruelrovix)
- Hugo David-Boyet ( @ Hugodby)
- Ian Schmitz@ ianschmitz)
- Ian Sutherland@ iansu)
- Jake Boone@Jakeboone 02)
- Jesse Jackson (@ jsejcksn)
- Jonathan Felchlin ( @ GreenGremlin)
- Joshua Robinson@ buildbreakdo)
- Justin Grant@ justingrant)
- Kanitkorn Sujautra (@ lukyth)
- Kent C. Dodds (@ kentcdodds)
- Klas Björkqvist (@ klasbj)
- Mateusz Burzyński@ Andarist)
- Max Davidson@ maxdavidson)
- May (@ aprilandjan)
- Orta ( (@ orta) )
- RJ (@ suprj)
- Renato Augusto Gama dos Santos (@ Renatoagds)
- Robert FUSZENECKER@ fuszenecker)
- Robert van Steen (@Rovansteen)
- Sean Baines@ mrseanbaines)
- Sean Lafferty ( @ seanlaff)
- Tharun Rajendran (@Tharun 208)
- Tomáš Hübelbauer (@ TomasHubelbauer)
- Wataru Ashihara (@ wataash)
- Xuhao (@ Xuhao)
- @ reactjser
- darthmaim (@ darthmaim)
Migrating from 3.2.0 to 3.3.0
Inside any created project that has not been ejected, run:
npm install --save --save-exact [email protected]
or
yarn add --exact [email protected]
GIPHY App Key not set. Please check settings