Webpack 5 #11201

raix · 2021-07-12T11:58:10Z

WP5 branch

Updating webpack to v5
Update dependencies related to webpack 5
Update postcss to v8
Fix eslint shareable config to be self contained regarding dependencies
Testing Webpack 5 error overlay instead of the CRA overlay (ref: outstanding formatting issue)

Breaking changes:

No node js builtin shims (breaking as in Webpack 5)
Removed WatchMissingNodeModulesPlugin
Dropped node v10 + v12 support
Webpack Development Server pathname default is now "/ws" (prev: '/sockjs-node')

Closing #9994

@kumarlachhani

* Revert "Revert "Update postcss packages" (#10216)" This reverts commit 3968923. * Revert "Update postcss packages" (#10216) This reverts commit 580ed5d. * Update postcss and loader * Update fork-ts-checker-webpack-plugin@5.2.1 References: * [hook rename](TypeStrong/fork-ts-checker-webpack-plugin#490) * [include/exclude](TypeStrong/fork-ts-checker-webpack-plugin#450) and [issue options](https://github.com/TypeStrong/fork-ts-checker-webpack-plugin#issues-options) * [release notes 5.0.0](https://github.com/TypeStrong/fork-ts-checker-webpack-plugin/releases/tag/v5.0.0) * Update fork-ts-checker-webpack-plugin 6.0.5 * Add css-minimizer-webpack-plugin@1.1.5 remove Add css-minimizer-webpack-plugin@1.1.5 Remove optimize-css-assets-webpack-plugin and postcss-safe-parser References: * https://webpack.js.org/plugins/css-minimizer-webpack-plugin/ * Add support for Webpack 5 message objects * Update WebpackManifestPlugin to v3.0.0 * Support both "SingleEntryPlugin" and "EntryPlugin" * Support Webpack 5 IgnorePlugin signature Reference: * https://webpack.js.org/plugins/ignore-plugin/#example-of-ignoring-moment-locales * #10006 * Update webpack and dev server * Enable persistent cache * Fix react-error-overlay webpack * Fix dev server config * Remove support for SingleEntryPlugin * update workbox-webpack-plugin * Fix post css config * Comment out WebpackManifestPlugin for now having issues with undefined path * Add fast refresh entries to ModuleScopePlugin * Format files * Remove unused variables in start command * git ignore tsconfig.tsbuildinfo supporting incremental typescript builds * simplify output path review feedback from @kumarlachhani * Use asset modules in react-scripts * Use asset modules in react-error-overlay * eslint-config-react-app typo fix (#10317) This just fixes a shell snippet in the readme file for this plugin * Fix link address (#10907) Replace the Github home link with a link to the repo's main page or a link to the source (https://github.com/CodeByZach/pace/blob/master/pace.js) * Bump immer version for fixing security issue (#10791) Bump immer minor version to fix `Prototype Pollution` Security issue. * test(create-react-app): add integration tests (#10381) * Revert "Use asset modules in react-error-overlay" This reverts commit 952f896. * Disable broken tests for now * Revert source-map bump in react-error-overlay * JSON is using default export * Webpack config: Remove invalid parser configuration * Fix issue with ModuleScope and babel runtime * Fix svgr configuration * Webpack config svg use file-loader instead of url-loader * Update postcss-normalize * Fix asset output name * Update test matrix using node 12+14 postcss normalize only support node >=12 * Fix file output extension * Align assetModuleFilename * pipeline update configuration names * Add back webpack-manifest-plugin * Fix kitchen sink get actual href value .href is prefixed with http://localhost etc. * Update kitchen sink test to webpack 5 asset modules * Let webpack handle global this * Fix eject copy config/webpack/persistentCache folder * Move tsbuildinfo into cache folder * Update dependencies * Update webpack-dev-server to beta.3 * Compilation.modules changed to type Set reference: comment by @slorber #9994 (comment) * Format JsonInclusion.js using prettier * Run prettier on webpack dev server config * Enable e2e behavior tests using node 12+14 * Comment out e2e behavior tests for now * Add experimental support for module federation * Fix missing wds socket path update accordingly to review by @xiaokekeT * Revert "Add experimental support for module federation" This reverts commit 8fdc63b. Co-authored-by: Ian Schmitz <ianschmitz@gmail.com> Co-authored-by: jasonwilliams <jase.williams@gmail.com> Co-authored-by: Joseph Atkins-Turkish <spacerat3004@gmail.com> Co-authored-by: e-w-h <46170930+e-w-h@users.noreply.github.com> Co-authored-by: Shamprasad RH <shamprasad.rh@mail.weir> Co-authored-by: James George <jamesgeorge998001@gmail.com>

.github/workflows/integration.yml

azure-pipelines-test-job.yml

iansu

Looks pretty good. I had a few questions and noticed there are some conflicts. Let's get this merged as soon as we can and get an alpha release out.

azure-pipelines.yml

packages/react-scripts/config/webpack/persistentCache/createEnvironmentHash.js

packages/react-dev-utils/WebpackDevServerUtils.js

packages/react-scripts/config/pnpTs.js

packages/react-scripts/config/webpack.config.js

packages/react-scripts/scripts/start.js

mrmckeb · 2021-07-14T17:20:26Z

This is looking great. @iansu and I left a few comments, and also wanted to note that we merged this:
#11105

There are a few conflicts, but it looks like 95% of those are just version-related.

packages/react-scripts/package.json

kryptonitechic · 2021-07-14T19:18:44Z

5 /prouh

ouna de lay Rojo bekino tegak / l pitch Zain mothe on

packages/react-scripts/config/webpack.config.js

prevent yarn warnings

…ized Would be great with wildcard support in ModuleScopePlugin

Warning: Ubuntu 16.04 LTS environment is deprecated and will be removed on September 20, 2021. Migrate to ubuntu-latest instead. For more details, see actions/runner-images#3287

this should be the default already in webpack 5 - to enable require ensure use https://webpack.js.org/plugins/internal-plugins/#requireensureplugin

On v4.14.1 linux tests failed: Node Sass does not yet support your current environment: Linux 64-bit with Unsupported runtime

moroine · 2021-11-22T20:26:32Z

Hey, is there any plan for the v5 release?

yzy111 · 2021-11-23T03:59:06Z

Hey，why did you remove the hot update configuration

raix · 2021-11-23T05:32:57Z

@moroine yes, we will upgrade eslint to version 8 and do a final update of dependency versions and do one final pre release to test it out.

@yzy111 not sure what you mean - we removed the usage of the CRA error overlay in favor of the webpack version (rather maintain one in the community)
Doing that removes the need for a custom hmr client etc. So reducing complexity in the CRA configs/codebase.

due to facebook/create-react-app#11201

t0x1c123 · 2021-12-30T12:38:40Z

Hi can I ask why did you removed? Thanks

 splitChunks: {
        chunks: 'all',
        name: isEnvDevelopment,
      },

sayedali2020

0x064c608f38801811aaa92c27f7b3236593841c2c

abasahebgaware · 2022-10-13T13:03:42Z

Can't resolve 'fs' in '{project_path}\node_modules\yamljs\lib'

getting this error after upgrade react-scripts to v5

Co-authored-by: Ian Schmitz <ianschmitz@gmail.com> Co-authored-by: jasonwilliams <jase.williams@gmail.com> Co-authored-by: Joseph Atkins-Turkish <spacerat3004@gmail.com> Co-authored-by: e-w-h <46170930+e-w-h@users.noreply.github.com> Co-authored-by: Shamprasad RH <shamprasad.rh@mail.weir> Co-authored-by: James George <jamesgeorge998001@gmail.com>

emanisay27

Helooo

emanisay27 · 2023-07-14T09:57:41Z

Hi

raix and others added 2 commits May 28, 2021 09:32

Update Webpack dependencies and fix minor issues (#11170)

da654e6

raix requested review from ianschmitz, iansu, mrmckeb and petetnt as code owners July 12, 2021 11:58

facebook-github-bot added the CLA Signed label Jul 12, 2021

mrmckeb reviewed Jul 14, 2021

View reviewed changes

.github/workflows/integration.yml Outdated Show resolved Hide resolved

.github/workflows/integration.yml Outdated Show resolved Hide resolved

azure-pipelines-test-job.yml Outdated Show resolved Hide resolved

iansu suggested changes Jul 14, 2021

View reviewed changes

dawnofmidnight suggested changes Jul 14, 2021

View reviewed changes

packages/react-scripts/package.json Show resolved Hide resolved

raix commented Jul 14, 2021

View reviewed changes

packages/react-scripts/config/webpack.config.js Show resolved Hide resolved

Morten N.O. Nørgaard Henriksen added 6 commits July 15, 2021 10:38

Merge branch 'main' into wp5

6d3dbed

Merge branch 'main' into wp5

0a7b095

Remove package-lock file

44c6958

prevent yarn warnings

Drop node 10 and 12, add 16

faf8b66

Remove dependency check for babel-eslint

b213cf3

Use md5 for the environment config webpack 5 cache invalidation hash

b5caccf

raix mentioned this pull request Jul 16, 2021

[v5] Use webpack 5 asset modules also for svgr #11213

Open

compile lockfile

f8e0fdb

raix added this to the 5.0 milestone Jul 16, 2021

raix linked an issue Jul 16, 2021 that may be closed by this pull request

Webpack 5 support overview #9994

Closed

25 tasks

Morten N.O. Henriksen added 7 commits July 16, 2021 11:15

Bump @babel/eslint-parser to 7.14.7

b41322a

Fix missing @babel/eslint-parser dev dependency

0508303

ModuleScopePlugin ignore @babel/runtime/helpers/esm/assertThisInitial…

18045c0

…ized Would be great with wildcard support in ModuleScopePlugin

Move azurepipelines to ubuntu-latest

af889e1

Warning: Ubuntu 16.04 LTS environment is deprecated and will be removed on September 20, 2021. Migrate to ubuntu-latest instead. For more details, see actions/runner-images#3287

Webpack config remove requireEnsure

2d3639c

this should be the default already in webpack 5 - to enable require ensure use https://webpack.js.org/plugins/internal-plugins/#requireensureplugin

ModuleScopePlugin ignore @babel/runtime/regenerator

a7b4b6e

Update node-sass from v4 to v6 in fixtures

c3abea1

On v4.14.1 linux tests failed: Node Sass does not yet support your current environment: Linux 64-bit with Unsupported runtime

fernandopasik mentioned this pull request Oct 21, 2021

Security warning on react-dev-utils that depends on immer storybookjs/storybook#16093

Closed

dantman mentioned this pull request Oct 23, 2021

Builds Don't Work with PostCSS After Update #11565

Closed

pringshia mentioned this pull request Nov 22, 2021

Initial commit for Docusaurus integration facebookresearch/Mephisto#611

Merged

raix added the tag: breaking change label Dec 14, 2021

Taillook added a commit to Taillook/storybook that referenced this pull request Dec 15, 2021

remove WatchMissingNodeModulesPlugin

497caaf

due to facebook/create-react-app#11201

amatissart mentioned this pull request Jan 2, 2022

Fix incorrect glob pattern in webpack config #11875

Open

sayedali2020 reviewed Jan 10, 2022

View reviewed changes

This was referenced Jan 30, 2022

feat: webpack v5 preactjs/preact-cli#1645

Merged

Chore: Backport recent refactorings preactjs/preact-cli#1648

Merged

meckila mentioned this pull request Feb 11, 2022

[Spike] Update react-script to use version 5.0.0 CDCgov/prime-reportstream#4232

Closed

brian-petersen mentioned this pull request Mar 14, 2022

MDX does not work with CRA 5.0.0 #12166

Open

simboonlong mentioned this pull request Mar 24, 2023

oa-verify polyfills TradeTrust/ndi-tradex-poc#7

Open

emanisay27 reviewed Jul 14, 2023

View reviewed changes

Omrisnyk mentioned this pull request Nov 27, 2023

[Snyk] Security upgrade react-scripts from 1.1.4 to 5.0.0 Omrisnyk/lock-walker#48

Open

Omrisnyk mentioned this pull request Feb 12, 2024

[Snyk] Security upgrade react-scripts from 1.1.4 to 5.0.0 Omrisnyk/lock-walker#52

Open

Omrisnyk mentioned this pull request Mar 22, 2024

[Snyk] Security upgrade react-scripts from 1.1.4 to 5.0.0 Omrisnyk/lock-walker#53

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Webpack 5 #11201

Webpack 5 #11201

raix commented Jul 12, 2021 •

edited

iansu left a comment

mrmckeb commented Jul 14, 2021

kryptonitechic commented Jul 14, 2021

moroine commented Nov 22, 2021

yzy111 commented Nov 23, 2021

raix commented Nov 23, 2021 •

edited

t0x1c123 commented Dec 30, 2021

sayedali2020 left a comment

abasahebgaware commented Oct 13, 2022

emanisay27 left a comment

emanisay27 commented Jul 14, 2023

Webpack 5 #11201

Webpack 5 #11201

Conversation

raix commented Jul 12, 2021 • edited

iansu left a comment

Choose a reason for hiding this comment

mrmckeb commented Jul 14, 2021

kryptonitechic commented Jul 14, 2021

5 /prouh

moroine commented Nov 22, 2021

yzy111 commented Nov 23, 2021

raix commented Nov 23, 2021 • edited

t0x1c123 commented Dec 30, 2021

sayedali2020 left a comment

Choose a reason for hiding this comment

abasahebgaware commented Oct 13, 2022

emanisay27 left a comment

Choose a reason for hiding this comment

emanisay27 commented Jul 14, 2023

raix commented Jul 12, 2021 •

edited

raix commented Nov 23, 2021 •

edited