Skip to content

Upgrading react-scripts 3 to 4

Breaking3.4.4 → 4.0.3Breaking23Security1Platform3New20Changed38Fixed24Other41

Full comparisonBack to react-scripts
BreakingUpgrade verdict

19 breaking changes and 3 platform requirement changes and a security fix.

In plain terms
  • Mocks are reset automatically before each test.
  • Linting may now flag code that previously passed.
  • You no longer need EXTEND_ESLINT to customize the ESLint config.
  • Use --template typescript instead of the typescript flag, and set the base path in jsconfig.json instead of NODE_PATH.
Must act Top 5 of 23 that need code or config changes

Node.js requirement changed in 4.0.0-next.64: >=8.10 → ^10.12.0 || >=12.0.0.

Adds @pmmmwh/react-refresh-webpack-plugin 0.4.3, bfj ^7.0.2, eslint-plugin-jest ^24.1.0, eslint-plugin-testing-library ^3.9.2, eslint-webpack-plugin ^2.5.2, jest-circus 26.6.0, prompts 2.4.0, react-refresh ^0.8.3.

Drops eslint-loader, jest-environment-jsdom-fourteen.

Installs 1945 packages in all (was 1651).

What you must change

Breaking19
Upgrades to Jest 26 and sets resetMocks to true by default in the Jest config.
resetMocks
4.0.0GitHub ReleaseSummarizedView source
Upgrades to ESLint 7 and adds many new rules, including import/no-anonymous-default-export.
import/no-anonymous-default-export
4.0.0GitHub ReleaseSummarizedView source
Upgrades eslint-plugin-hooks to 4.0.0 and removes the EXTEND_ESLINT flag.
EXTEND_ESLINTeslint-plugin-hooks
4.0.0GitHub ReleaseSummarizedView source
Removes the deprecated typescript flag and NODE_PATH support.
typescriptNODE_PATH--templatejsconfig.json
4.0.0GitHub ReleaseSummarizedView source
Removes EXTEND_ESLINT and adds Jest rules.
EXTEND_ESLINT
4.0.0GitHub ReleaseSummarizedView source
Removes a deprecated ESLint rule.
4.0.0GitHub ReleaseSummarizedView source
Adds the import/no-anonymous-default-export lint rule.
import/no-anonymous-default-export
4.0.0GitHub ReleaseSummarizedView source
Switches to the Workbox InjectManifest plugin and moves PWA templates to their own repository.
4.0.0GitHub ReleaseSummarizedView source
Changes dotenv file loading order to match the dotenv specification.
4.0.0GitHub ReleaseSummarizedView source
Supports ESLint 7.x.
4.0.0GitHub ReleaseSummarizedView source
Exits on an outdated create-react-app version.
create-react-app
4.0.0GitHub ReleaseSummarizedView source
Switches to the Workbox InjectManifest plugin.
4.0.0GitHub ReleaseSummarizedView source
Upgrades Jest to version 26 across several packages.
4.0.0GitHub ReleaseSummarizedView source
Fixes dotenv file loading order, changing which env files take precedence.
4.0.0GitHub ReleaseSummarizedView source
Upgrades several dependencies to new major versions.
4.0.0GitHub ReleaseSummarizedView source
Bumps the React Hooks ESLint plugin to 4.0.0.
4.0.0GitHub ReleaseSummarizedView source
Upgrades to Jest 25 across several packages.
4.0.0GitHub ReleaseSummarizedView source
Upgrades to ESLint 7 and adds Jest and React Testing Library rules.
4.0.0GitHub ReleaseSummarizedView source
Adds Jest and testing-library rules to eslint-config-react-app.
eslint-config-react-app
4.0.0GitHub ReleaseSummarizedView source
Security1
Updates immer to 8.0.1 in react-dev-utils to address a vulnerability.
immerreact-dev-utils
4.0.3GitHub ReleaseSummarizedView source
Platform3
Adds TypeScript 4.x as a peerDependency of react-scripts.
react-scriptstypescript
4.0.2GitHub ReleaseSummarizedView source
Drops Node 8 support, which reached End-of-Life at the end of 2019.
4.0.0GitHub ReleaseSummarizedView source
Drops support for Node 8.
4.0.0GitHub ReleaseSummarizedView source

API changes

Generated by DepDelta from published .d.ts files. Not mixed with prose notes.

  • added: const src: string
  • added: default src
  • added: declare module '*.avif'