diff --git a/docusaurus/docs/nodejs-builtin-fallbacks.md b/docusaurus/docs/nodejs-builtin-fallbacks.md new file mode 100644 index 00000000000..28de3958d63 --- /dev/null +++ b/docusaurus/docs/nodejs-builtin-fallbacks.md @@ -0,0 +1,66 @@ +--- +id: nodejs-builtin-fallbacks +title: NodeJS builtin fallbacks +--- + +NodeJS builtin fallbacks enable you to import NodeJS builtin modules meant for Node and fallback to browser specific modules in your web application. + +Per default Create React App set fallbacks to empty modules in production build and development fallbacks in development mode. + +In development mode you might get error messages in your browser console similar to: + +``` +(dev) Error: Module "path" not found, cannot access property "join", please read https://create-react-app.dev/docs/nodejs-builtin-fallbacks +``` + +_(It's possible to disable these warnings in development using the environment variable: `DISABLE_MISSING_NODEJS_BUILTIN_MODULE_FALLBACK_WARNING=true`)_ + +**IMPORTANT:** Before fixing this dependency, please make sure to only use Npm packages meant for the browser and not for Node / backend. + +It takes abit of work but visit the project documentation, README.md and if on GitHub etc. look open and closed issues in the project e.g. search "browser" to see if maintainers close issues for browser support. + +Implications of loading packages not build for the browser can vary from security, bundle size etc. - There might be better alternatives. + +**Escape hatch** + +To fix the issue you will need to add the browser fallback - the example above complains about missing `path` module. + +```bash +npm install path-browserif +# or.. +yarn add path-browserif +``` + +Create React App will recognize the fallback and use that instead of an empty module. +_(Find the fallback package in the table bellow)_ + +| NodeJS builtin module | Browser version | +| :-------------------- | :------------------------- | +| assert | assert | +| buffer | buffer | +| console | console-browserif | +| constants | constants-browserif | +| crypto | crypto-browserif | +| domain | domain-browse | +| events | events | +| http | stream-htt | +| https | https-browserif | +| os | os-browserify/browse | +| path | path-browserif | +| punycode | punycode | +| process | process/browse | +| querystring | querystring-es | +| stream | stream-browserif | +| stream_duplex | readable-stream/duple | +| stream_passthrough | readable-stream/passthroug | +| stream_readable | readable-stream/readabl | +| stream_transform | readable-stream/transfor | +| stream_writable | readable-stream/writabl | +| string_decoder | string_decoder | +| sys | util | +| timers | timers-browserif | +| tty | tty-browserif | +| url | url | +| util | util | +| vm | vm-browserif | +| zlib | browserify-zlib | diff --git a/docusaurus/website/sidebars.json b/docusaurus/website/sidebars.json index 386a29da1bf..4bfaa896694 100644 --- a/docusaurus/website/sidebars.json +++ b/docusaurus/website/sidebars.json @@ -52,6 +52,7 @@ "can-i-use-decorators", "pre-rendering-into-static-html-files", "advanced-configuration", + "nodejs-builtin-fallbacks", "alternatives-to-ejecting" ], "Support": ["troubleshooting"] diff --git a/package-lock.json b/package-lock.json index eb9eb9c7bc4..2a1a96eb86f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4,7 +4,6 @@ "requires": true, "packages": { "": { - "name": "create-react-app", "hasInstallScript": true, "workspaces": [ "packages/*" @@ -25838,7 +25837,7 @@ } }, "packages/babel-plugin-named-asset-import": { - "version": "0.3.7", + "version": "0.3.8", "license": "MIT", "devDependencies": { "babel-plugin-tester": "^10.1.0", @@ -25849,7 +25848,7 @@ } }, "packages/babel-preset-react-app": { - "version": "10.0.0", + "version": "10.0.1", "license": "MIT", "dependencies": { "@babel/core": "^7.16.0", @@ -25871,28 +25870,28 @@ } }, "packages/confusing-browser-globals": { - "version": "1.0.10", + "version": "1.0.11", "license": "MIT", "devDependencies": { "jest": "^27.4.3" } }, "packages/cra-template": { - "version": "1.1.2", + "version": "1.1.3", "license": "MIT", "engines": { "node": ">=14" } }, "packages/cra-template-typescript": { - "version": "1.1.2", + "version": "1.1.3", "license": "MIT", "engines": { "node": ">=14" } }, "packages/create-react-app": { - "version": "4.0.3", + "version": "5.0.0", "license": "MIT", "dependencies": { "chalk": "^4.1.2", @@ -25933,7 +25932,7 @@ } }, "packages/eslint-config-react-app": { - "version": "6.0.0", + "version": "7.0.0", "license": "MIT", "dependencies": { "@babel/core": "^7.16.0", @@ -25941,8 +25940,8 @@ "@rushstack/eslint-patch": "^1.1.0", "@typescript-eslint/eslint-plugin": "^5.5.0", "@typescript-eslint/parser": "^5.5.0", - "babel-preset-react-app": "^10.0.0", - "confusing-browser-globals": "^1.0.10", + "babel-preset-react-app": "^10.0.1", + "confusing-browser-globals": "^1.0.11", "eslint-plugin-flowtype": "^8.0.3", "eslint-plugin-import": "^2.25.3", "eslint-plugin-jest": "^25.3.0", @@ -25959,7 +25958,7 @@ } }, "packages/react-app-polyfill": { - "version": "2.0.0", + "version": "3.0.0", "license": "MIT", "dependencies": { "core-js": "^3.19.2", @@ -25974,7 +25973,7 @@ } }, "packages/react-dev-utils": { - "version": "11.0.4", + "version": "12.0.0", "license": "MIT", "dependencies": { "@babel/code-frame": "^7.16.0", @@ -25996,7 +25995,7 @@ "open": "^8.4.0", "pkg-up": "^3.1.0", "prompts": "^2.4.2", - "react-error-overlay": "^6.0.9", + "react-error-overlay": "^6.0.10", "recursive-readdir": "^2.2.2", "shell-quote": "^1.7.3", "strip-ansi": "^6.0.1", @@ -26019,7 +26018,7 @@ } }, "packages/react-error-overlay": { - "version": "6.0.9", + "version": "6.0.10", "license": "MIT", "devDependencies": { "@babel/code-frame": "^7.16.0", @@ -26027,12 +26026,12 @@ "anser": "^2.1.0", "babel-jest": "^27.4.2", "babel-loader": "^8.2.3", - "babel-preset-react-app": "^10.0.0", + "babel-preset-react-app": "^10.0.1", "chalk": "^4.1.2", "chokidar": "^3.5.2", "cross-env": "^7.0.3", "eslint": "^8.3.0", - "eslint-config-react-app": "^6.0.0", + "eslint-config-react-app": "^7.0.0", "flow-bin": "^0.116.0", "html-entities": "^2.3.2", "jest": "^27.4.3", @@ -26041,7 +26040,7 @@ "promise": "^8.1.0", "raw-loader": "^4.0.2", "react": "^17.0.2", - "react-app-polyfill": "^2.0.0", + "react-app-polyfill": "^3.0.0", "react-dom": "^17.0.2", "rimraf": "^3.0.2", "settle-promise": "^1.0.0", @@ -26059,7 +26058,7 @@ } }, "packages/react-scripts": { - "version": "4.0.3", + "version": "5.0.0", "license": "MIT", "dependencies": { "@babel/core": "^7.16.0", @@ -26067,8 +26066,8 @@ "@svgr/webpack": "^5.5.0", "babel-jest": "^27.4.2", "babel-loader": "^8.2.3", - "babel-plugin-named-asset-import": "^0.3.7", - "babel-preset-react-app": "^10.0.0", + "babel-plugin-named-asset-import": "^0.3.8", + "babel-preset-react-app": "^10.0.1", "bfj": "^7.0.2", "browserslist": "^4.18.1", "camelcase": "^6.2.1", @@ -26078,7 +26077,7 @@ "dotenv": "^10.0.0", "dotenv-expand": "^5.1.0", "eslint": "^8.3.0", - "eslint-config-react-app": "^6.0.0", + "eslint-config-react-app": "^7.0.0", "eslint-webpack-plugin": "^3.1.1", "file-loader": "^6.2.0", "fs-extra": "^10.0.0", @@ -26094,8 +26093,8 @@ "postcss-normalize": "^10.0.1", "postcss-preset-env": "^7.0.1", "prompts": "^2.4.2", - "react-app-polyfill": "^2.0.0", - "react-dev-utils": "^11.0.4", + "react-app-polyfill": "^3.0.0", + "react-dev-utils": "^12.0.0", "react-refresh": "^0.11.0", "resolve": "^1.20.0", "resolve-url-loader": "^4.0.0", @@ -29113,7 +29112,8 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/@octokit/plugin-request-log/-/plugin-request-log-1.0.4.tgz", "integrity": "sha512-mLUsMkgP7K/cnFEw07kWqXGF5LKrOkD+lhCrKvPHXWDywAwuDUeDwWBpc69XK3pNX0uKiVt8g5z96PJ6z9xCFA==", - "dev": true + "dev": true, + "requires": {} }, "@octokit/plugin-rest-endpoint-methods": { "version": "5.13.0", @@ -30199,12 +30199,14 @@ "acorn-import-assertions": { "version": "1.8.0", "resolved": "https://registry.npmjs.org/acorn-import-assertions/-/acorn-import-assertions-1.8.0.tgz", - "integrity": "sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw==" + "integrity": "sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw==", + "requires": {} }, "acorn-jsx": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz", - "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==" + "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==", + "requires": {} }, "acorn-node": { "version": "1.8.2", @@ -30316,7 +30318,8 @@ "ajv-keywords": { "version": "3.5.2", "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz", - "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==" + "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==", + "requires": {} }, "alex": { "version": "8.2.0", @@ -32990,7 +32993,8 @@ "css-blank-pseudo": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/css-blank-pseudo/-/css-blank-pseudo-2.0.0.tgz", - "integrity": "sha512-n7fxEOyuvAVPLPb9kL4XTIK/gnp2fKQ7KFQ+9lj60W9pDn/jTr5LjS/kHHm+rES/YJ3m0S6+uJgYSuAJg9zOyA==" + "integrity": "sha512-n7fxEOyuvAVPLPb9kL4XTIK/gnp2fKQ7KFQ+9lj60W9pDn/jTr5LjS/kHHm+rES/YJ3m0S6+uJgYSuAJg9zOyA==", + "requires": {} }, "css-declaration-sorter": { "version": "6.1.3", @@ -33087,7 +33091,8 @@ "css-prefers-color-scheme": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/css-prefers-color-scheme/-/css-prefers-color-scheme-5.0.0.tgz", - "integrity": "sha512-XpzVrdwbppHm+Nnrzcb/hQb8eq1aKv4U8Oh59LsLfTsbIZZ6Fvn9razb66ihH2aTJ0VhO9n9sVm8piyKXJAZMA==" + "integrity": "sha512-XpzVrdwbppHm+Nnrzcb/hQb8eq1aKv4U8Oh59LsLfTsbIZZ6Fvn9razb66ihH2aTJ0VhO9n9sVm8piyKXJAZMA==", + "requires": {} }, "css-select": { "version": "4.1.3", @@ -33186,7 +33191,8 @@ "cssnano-utils": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/cssnano-utils/-/cssnano-utils-2.0.1.tgz", - "integrity": "sha512-i8vLRZTnEH9ubIyfdZCAdIdgnHAUeQeByEeQ2I7oTilvP9oHO6RScpeq3GsFUVqeB8uZgOQ9pw8utofNn32hhQ==" + "integrity": "sha512-i8vLRZTnEH9ubIyfdZCAdIdgnHAUeQeByEeQ2I7oTilvP9oHO6RScpeq3GsFUVqeB8uZgOQ9pw8utofNn32hhQ==", + "requires": {} }, "csso": { "version": "4.2.0", @@ -34028,8 +34034,8 @@ "@rushstack/eslint-patch": "^1.1.0", "@typescript-eslint/eslint-plugin": "^5.5.0", "@typescript-eslint/parser": "^5.5.0", - "babel-preset-react-app": "^10.0.0", - "confusing-browser-globals": "^1.0.10", + "babel-preset-react-app": "^10.0.1", + "confusing-browser-globals": "^1.0.11", "eslint-plugin-flowtype": "^8.0.3", "eslint-plugin-import": "^2.25.3", "eslint-plugin-jest": "^25.3.0", @@ -34267,7 +34273,8 @@ "eslint-plugin-react-hooks": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.3.0.tgz", - "integrity": "sha512-XslZy0LnMn+84NEG9jSGR6eGqaZB3133L8xewQo3fQagbQuGt7a63gf+P1NGKZavEYEC3UXaWEAA/AqDkuN6xA==" + "integrity": "sha512-XslZy0LnMn+84NEG9jSGR6eGqaZB3133L8xewQo3fQagbQuGt7a63gf+P1NGKZavEYEC3UXaWEAA/AqDkuN6xA==", + "requires": {} }, "eslint-plugin-testing-library": { "version": "5.0.1", @@ -36200,7 +36207,8 @@ "icss-utils": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz", - "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==" + "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==", + "requires": {} }, "idb": { "version": "6.1.5", @@ -37171,7 +37179,8 @@ "jest-pnp-resolver": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/jest-pnp-resolver/-/jest-pnp-resolver-1.2.2.tgz", - "integrity": "sha512-olV41bKSMm8BdnuMsewT4jqlZ8+3TCARAXjZGT9jcoSnrfUnRCqnMoF9XEeoWjbzObpqF9dRhHQj0Xb9QdF6/w==" + "integrity": "sha512-olV41bKSMm8BdnuMsewT4jqlZ8+3TCARAXjZGT9jcoSnrfUnRCqnMoF9XEeoWjbzObpqF9dRhHQj0Xb9QdF6/w==", + "requires": {} }, "jest-regex-util": { "version": "27.4.0", @@ -39994,7 +40003,8 @@ "postcss-browser-comments": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/postcss-browser-comments/-/postcss-browser-comments-4.0.0.tgz", - "integrity": "sha512-X9X9/WN3KIvY9+hNERUqX9gncsgBA25XaeR+jshHz2j8+sYyHktHw1JdKuMjeLpGktXidqDhA7b/qm1mrBDmgg==" + "integrity": "sha512-X9X9/WN3KIvY9+hNERUqX9gncsgBA25XaeR+jshHz2j8+sYyHktHw1JdKuMjeLpGktXidqDhA7b/qm1mrBDmgg==", + "requires": {} }, "postcss-calc": { "version": "8.0.0", @@ -40051,7 +40061,8 @@ "postcss-custom-media": { "version": "8.0.0", "resolved": "https://registry.npmjs.org/postcss-custom-media/-/postcss-custom-media-8.0.0.tgz", - "integrity": "sha512-FvO2GzMUaTN0t1fBULDeIvxr5IvbDXcIatt6pnJghc736nqNgsGao5NT+5+WVLAQiTt6Cb3YUms0jiPaXhL//g==" + "integrity": "sha512-FvO2GzMUaTN0t1fBULDeIvxr5IvbDXcIatt6pnJghc736nqNgsGao5NT+5+WVLAQiTt6Cb3YUms0jiPaXhL//g==", + "requires": {} }, "postcss-custom-properties": { "version": "12.0.0", @@ -40080,22 +40091,26 @@ "postcss-discard-comments": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-5.0.1.tgz", - "integrity": "sha512-lgZBPTDvWrbAYY1v5GYEv8fEO/WhKOu/hmZqmCYfrpD6eyDWWzAOsl2rF29lpvziKO02Gc5GJQtlpkTmakwOWg==" + "integrity": "sha512-lgZBPTDvWrbAYY1v5GYEv8fEO/WhKOu/hmZqmCYfrpD6eyDWWzAOsl2rF29lpvziKO02Gc5GJQtlpkTmakwOWg==", + "requires": {} }, "postcss-discard-duplicates": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-5.0.1.tgz", - "integrity": "sha512-svx747PWHKOGpAXXQkCc4k/DsWo+6bc5LsVrAsw+OU+Ibi7klFZCyX54gjYzX4TH+f2uzXjRviLARxkMurA2bA==" + "integrity": "sha512-svx747PWHKOGpAXXQkCc4k/DsWo+6bc5LsVrAsw+OU+Ibi7klFZCyX54gjYzX4TH+f2uzXjRviLARxkMurA2bA==", + "requires": {} }, "postcss-discard-empty": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-5.0.1.tgz", - "integrity": "sha512-vfU8CxAQ6YpMxV2SvMcMIyF2LX1ZzWpy0lqHDsOdaKKLQVQGVP1pzhrI9JlsO65s66uQTfkQBKBD/A5gp9STFw==" + "integrity": "sha512-vfU8CxAQ6YpMxV2SvMcMIyF2LX1ZzWpy0lqHDsOdaKKLQVQGVP1pzhrI9JlsO65s66uQTfkQBKBD/A5gp9STFw==", + "requires": {} }, "postcss-discard-overridden": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-5.0.1.tgz", - "integrity": "sha512-Y28H7y93L2BpJhrdUR2SR2fnSsT+3TVx1NmVQLbcnZWwIUpJ7mfcTC6Za9M2PG6w8j7UQRfzxqn8jU2VwFxo3Q==" + "integrity": "sha512-Y28H7y93L2BpJhrdUR2SR2fnSsT+3TVx1NmVQLbcnZWwIUpJ7mfcTC6Za9M2PG6w8j7UQRfzxqn8jU2VwFxo3Q==", + "requires": {} }, "postcss-double-position-gradients": { "version": "3.0.1", @@ -40116,27 +40131,32 @@ "postcss-flexbugs-fixes": { "version": "5.0.2", "resolved": "https://registry.npmjs.org/postcss-flexbugs-fixes/-/postcss-flexbugs-fixes-5.0.2.tgz", - "integrity": "sha512-18f9voByak7bTktR2QgDveglpn9DTbBWPUzSOe9g0N4WR/2eSt6Vrcbf0hmspvMI6YWGywz6B9f7jzpFNJJgnQ==" + "integrity": "sha512-18f9voByak7bTktR2QgDveglpn9DTbBWPUzSOe9g0N4WR/2eSt6Vrcbf0hmspvMI6YWGywz6B9f7jzpFNJJgnQ==", + "requires": {} }, "postcss-focus-visible": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/postcss-focus-visible/-/postcss-focus-visible-6.0.1.tgz", - "integrity": "sha512-UddLlBmJ78Nu7OrKME70EKxCPBdxTx7pKIyD3GDNRM8Tnq19zmscT9QzsvR8gygz0i0nNUjMtSz4N3AEWZ5R/Q==" + "integrity": "sha512-UddLlBmJ78Nu7OrKME70EKxCPBdxTx7pKIyD3GDNRM8Tnq19zmscT9QzsvR8gygz0i0nNUjMtSz4N3AEWZ5R/Q==", + "requires": {} }, "postcss-focus-within": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/postcss-focus-within/-/postcss-focus-within-5.0.1.tgz", - "integrity": "sha512-50v1AZVlFSVzLTNdBQG521Aa54VABf/X1RkhR8Fm/9dDQby0W0XdwOnuo8Juvf0ZZXbKkxyTkyyQD0QaNVZVGg==" + "integrity": "sha512-50v1AZVlFSVzLTNdBQG521Aa54VABf/X1RkhR8Fm/9dDQby0W0XdwOnuo8Juvf0ZZXbKkxyTkyyQD0QaNVZVGg==", + "requires": {} }, "postcss-font-variant": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/postcss-font-variant/-/postcss-font-variant-5.0.0.tgz", - "integrity": "sha512-1fmkBaCALD72CK2a9i468mA/+tr9/1cBxRRMXOUaZqO43oWPR5imcyPjXwuv7PXbCid4ndlP5zWhidQVVa3hmA==" + "integrity": "sha512-1fmkBaCALD72CK2a9i468mA/+tr9/1cBxRRMXOUaZqO43oWPR5imcyPjXwuv7PXbCid4ndlP5zWhidQVVa3hmA==", + "requires": {} }, "postcss-gap-properties": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/postcss-gap-properties/-/postcss-gap-properties-3.0.0.tgz", - "integrity": "sha512-QJOkz1epC/iCuOdhQPm3n9T+F25+P+MYJEEcs5xz/Q+020mc9c6ZRGJkzPJd8FS9hFmT9eEKFEx9PEDl+lH5og==" + "integrity": "sha512-QJOkz1epC/iCuOdhQPm3n9T+F25+P+MYJEEcs5xz/Q+020mc9c6ZRGJkzPJd8FS9hFmT9eEKFEx9PEDl+lH5og==", + "requires": {} }, "postcss-image-set-function": { "version": "4.0.2", @@ -40149,7 +40169,8 @@ "postcss-initial": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/postcss-initial/-/postcss-initial-4.0.1.tgz", - "integrity": "sha512-0ueD7rPqX8Pn1xJIjay0AZeIuDoF+V+VvMt/uOnn+4ezUKhZM/NokDeP6DwMNyIoYByuN/94IQnt5FEkaN59xQ==" + "integrity": "sha512-0ueD7rPqX8Pn1xJIjay0AZeIuDoF+V+VvMt/uOnn+4ezUKhZM/NokDeP6DwMNyIoYByuN/94IQnt5FEkaN59xQ==", + "requires": {} }, "postcss-js": { "version": "3.0.3", @@ -40202,12 +40223,14 @@ "postcss-logical": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/postcss-logical/-/postcss-logical-5.0.0.tgz", - "integrity": "sha512-fWEWMn/xf6F9SMzAD7OS0GTm8Qh1BlBmEbVT/YZGYhwipQEwOpO7YOOu+qnzLksDg9JjLRj5tLmeN8OW8+ogIA==" + "integrity": "sha512-fWEWMn/xf6F9SMzAD7OS0GTm8Qh1BlBmEbVT/YZGYhwipQEwOpO7YOOu+qnzLksDg9JjLRj5tLmeN8OW8+ogIA==", + "requires": {} }, "postcss-media-minmax": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/postcss-media-minmax/-/postcss-media-minmax-5.0.0.tgz", - "integrity": "sha512-yDUvFf9QdFZTuCUg0g0uNSHVlJ5X1lSzDZjPSFaiCWvjgsvu8vEVxtahPrLMinIDEEGnx6cBe6iqdx5YWz08wQ==" + "integrity": "sha512-yDUvFf9QdFZTuCUg0g0uNSHVlJ5X1lSzDZjPSFaiCWvjgsvu8vEVxtahPrLMinIDEEGnx6cBe6iqdx5YWz08wQ==", + "requires": {} }, "postcss-merge-longhand": { "version": "5.0.4", @@ -40270,7 +40293,8 @@ "postcss-modules-extract-imports": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz", - "integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==" + "integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==", + "requires": {} }, "postcss-modules-local-by-default": { "version": "4.0.0", @@ -40327,7 +40351,8 @@ "postcss-normalize-charset": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-5.0.1.tgz", - "integrity": "sha512-6J40l6LNYnBdPSk+BHZ8SF+HAkS4q2twe5jnocgd+xWpz/mx/5Sa32m3W1AA8uE8XaXN+eg8trIlfu8V9x61eg==" + "integrity": "sha512-6J40l6LNYnBdPSk+BHZ8SF+HAkS4q2twe5jnocgd+xWpz/mx/5Sa32m3W1AA8uE8XaXN+eg8trIlfu8V9x61eg==", + "requires": {} }, "postcss-normalize-display-values": { "version": "5.0.1", @@ -40411,12 +40436,14 @@ "postcss-overflow-shorthand": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/postcss-overflow-shorthand/-/postcss-overflow-shorthand-3.0.0.tgz", - "integrity": "sha512-4fTapLT68wUoIr4m3Z0sKn1NbXX0lJYvj4aDA2++KpNx8wMSVf55UuLPz0nSjXa7dV1p0xQHlJ0iFJRNrSY2mw==" + "integrity": "sha512-4fTapLT68wUoIr4m3Z0sKn1NbXX0lJYvj4aDA2++KpNx8wMSVf55UuLPz0nSjXa7dV1p0xQHlJ0iFJRNrSY2mw==", + "requires": {} }, "postcss-page-break": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/postcss-page-break/-/postcss-page-break-3.0.4.tgz", - "integrity": "sha512-1JGu8oCjVXLa9q9rFTo4MbeeA5FMe00/9C7lN4va606Rdb+HkxXtXsmEDrIraQ11fGz/WvKWa8gMuCKkrXpTsQ==" + "integrity": "sha512-1JGu8oCjVXLa9q9rFTo4MbeeA5FMe00/9C7lN4va606Rdb+HkxXtXsmEDrIraQ11fGz/WvKWa8gMuCKkrXpTsQ==", + "requires": {} }, "postcss-place": { "version": "7.0.1", @@ -40496,7 +40523,8 @@ "postcss-replace-overflow-wrap": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/postcss-replace-overflow-wrap/-/postcss-replace-overflow-wrap-4.0.0.tgz", - "integrity": "sha512-KmF7SBPphT4gPPcKZc7aDkweHiKEEO8cla/GjcBK+ckKxiZslIu3C4GCRW3DNfL0o7yW7kMQu9xlZ1kXRXLXtw==" + "integrity": "sha512-KmF7SBPphT4gPPcKZc7aDkweHiKEEO8cla/GjcBK+ckKxiZslIu3C4GCRW3DNfL0o7yW7kMQu9xlZ1kXRXLXtw==", + "requires": {} }, "postcss-selector-not": { "version": "5.0.0", @@ -40863,7 +40891,8 @@ "version": "8.2.3", "resolved": "https://registry.npmjs.org/ws/-/ws-8.2.3.tgz", "integrity": "sha512-wBuoj1BDpC6ZQ1B7DWQBYVLphPWkm8i9Y0/3YdHjHKHiohOJ1ws+3OccDWtH+PoC9DZD5WOTrJvNbWvjS6JWaA==", - "dev": true + "dev": true, + "requires": {} } } }, @@ -41034,7 +41063,7 @@ "open": "^8.4.0", "pkg-up": "^3.1.0", "prompts": "^2.4.2", - "react-error-overlay": "^6.0.9", + "react-error-overlay": "^6.0.10", "recursive-readdir": "^2.2.2", "shell-quote": "^1.7.3", "strip-ansi": "^6.0.1", @@ -41067,12 +41096,12 @@ "anser": "^2.1.0", "babel-jest": "^27.4.2", "babel-loader": "^8.2.3", - "babel-preset-react-app": "^10.0.0", + "babel-preset-react-app": "^10.0.1", "chalk": "^4.1.2", "chokidar": "^3.5.2", "cross-env": "^7.0.3", "eslint": "^8.3.0", - "eslint-config-react-app": "^6.0.0", + "eslint-config-react-app": "^7.0.0", "flow-bin": "^0.116.0", "html-entities": "^2.3.2", "jest": "^27.4.3", @@ -41081,7 +41110,7 @@ "promise": "^8.1.0", "raw-loader": "^4.0.2", "react": "^17.0.2", - "react-app-polyfill": "^2.0.0", + "react-app-polyfill": "^3.0.0", "react-dom": "^17.0.2", "rimraf": "^3.0.2", "settle-promise": "^1.0.0", @@ -41115,8 +41144,8 @@ "@svgr/webpack": "^5.5.0", "babel-jest": "^27.4.2", "babel-loader": "^8.2.3", - "babel-plugin-named-asset-import": "^0.3.7", - "babel-preset-react-app": "^10.0.0", + "babel-plugin-named-asset-import": "^0.3.8", + "babel-preset-react-app": "^10.0.1", "bfj": "^7.0.2", "browserslist": "^4.18.1", "camelcase": "^6.2.1", @@ -41126,7 +41155,7 @@ "dotenv": "^10.0.0", "dotenv-expand": "^5.1.0", "eslint": "^8.3.0", - "eslint-config-react-app": "^6.0.0", + "eslint-config-react-app": "^7.0.0", "eslint-webpack-plugin": "^3.1.1", "file-loader": "^6.2.0", "fs-extra": "^10.0.0", @@ -41144,8 +41173,8 @@ "postcss-preset-env": "^7.0.1", "prompts": "^2.4.2", "react": "^17.0.2", - "react-app-polyfill": "^2.0.0", - "react-dev-utils": "^11.0.4", + "react-app-polyfill": "^3.0.0", + "react-dev-utils": "^12.0.0", "react-dom": "^17.0.2", "react-refresh": "^0.11.0", "resolve": "^1.20.0", @@ -42892,7 +42921,8 @@ "style-loader": { "version": "3.3.1", "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-3.3.1.tgz", - "integrity": "sha512-GPcQ+LDJbrcxHORTRes6Jy2sfvK2kS6hpSfI/fXhPt+spVzxF6LJ1dHLN9zIGmVaaP044YKaIatFaufENRiDoQ==" + "integrity": "sha512-GPcQ+LDJbrcxHORTRes6Jy2sfvK2kS6hpSfI/fXhPt+spVzxF6LJ1dHLN9zIGmVaaP044YKaIatFaufENRiDoQ==", + "requires": {} }, "stylehacks": { "version": "5.0.1", @@ -45193,7 +45223,8 @@ "ws": { "version": "8.3.0", "resolved": "https://registry.npmjs.org/ws/-/ws-8.3.0.tgz", - "integrity": "sha512-Gs5EZtpqZzLvmIM59w4igITU57lrtYVFneaa434VROv4thzJyV6UjIL3D42lslWlI+D4KzLYnxSwtfuiO79sNw==" + "integrity": "sha512-Gs5EZtpqZzLvmIM59w4igITU57lrtYVFneaa434VROv4thzJyV6UjIL3D42lslWlI+D4KzLYnxSwtfuiO79sNw==", + "requires": {} } } }, @@ -45778,7 +45809,8 @@ "ws": { "version": "7.5.6", "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.6.tgz", - "integrity": "sha512-6GLgCqo2cy2A2rjCNFlxQS6ZljG/coZfZXclldI8FB/1G3CCI36Zd8xy2HrFVACi8tfk5XrgLQEk+P0Tnz9UcA==" + "integrity": "sha512-6GLgCqo2cy2A2rjCNFlxQS6ZljG/coZfZXclldI8FB/1G3CCI36Zd8xy2HrFVACi8tfk5XrgLQEk+P0Tnz9UcA==", + "requires": {} }, "x-is-string": { "version": "0.1.0", diff --git a/packages/react-dev-utils/ModuleScopePlugin.js b/packages/react-dev-utils/ModuleScopePlugin.js index e2c16ffd819..5d56c637e4c 100644 --- a/packages/react-dev-utils/ModuleScopePlugin.js +++ b/packages/react-dev-utils/ModuleScopePlugin.js @@ -15,7 +15,10 @@ class ModuleScopePlugin { constructor(appSrc, allowedFiles = []) { this.appSrcs = Array.isArray(appSrc) ? appSrc : [appSrc]; this.allowedFiles = new Set(allowedFiles); - this.allowedPaths = [...allowedFiles].map(path.dirname).filter(p => path.relative(p, process.cwd()) !== ''); + this.allowedPaths = [...allowedFiles] + .filter(Boolean) + .map(path.dirname) + .filter(p => path.relative(p, process.cwd()) !== ''); } apply(resolver) { @@ -54,9 +57,11 @@ class ModuleScopePlugin { if (this.allowedFiles.has(requestFullPath)) { return callback(); } - if (this.allowedPaths.some((allowedFile) => { - return requestFullPath.startsWith(allowedFile); - })) { + if ( + this.allowedPaths.some(allowedFile => { + return requestFullPath.startsWith(allowedFile); + }) + ) { return callback(); } // Find path from src to the requested file diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_duplex.js b/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_duplex.js new file mode 100644 index 00000000000..59dbe227baa --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_duplex.js @@ -0,0 +1,13 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')( + 'stream_duplex' +); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_passthrough.js b/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_passthrough.js new file mode 100644 index 00000000000..af0986377ed --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_passthrough.js @@ -0,0 +1,13 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')( + 'stream_passthrough' +); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_readable.js b/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_readable.js new file mode 100644 index 00000000000..083fac1e9f5 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_readable.js @@ -0,0 +1,13 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')( + 'stream_readable' +); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_transform.js b/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_transform.js new file mode 100644 index 00000000000..f0d8ede6b7b --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_transform.js @@ -0,0 +1,13 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')( + 'stream_transform' +); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_writable.js b/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_writable.js new file mode 100644 index 00000000000..d278e44f6d3 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/_stream_writable.js @@ -0,0 +1,13 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')( + 'stream_writeable' +); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/assert.js b/packages/react-scripts/config/developmentBuiltinFallbacks/assert.js new file mode 100644 index 00000000000..0fbb6828160 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/assert.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('assert'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/buffer.js b/packages/react-scripts/config/developmentBuiltinFallbacks/buffer.js new file mode 100644 index 00000000000..05a1151d2c7 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/buffer.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('buffer'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/console.js b/packages/react-scripts/config/developmentBuiltinFallbacks/console.js new file mode 100644 index 00000000000..25331146438 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/console.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('console'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/constants.js b/packages/react-scripts/config/developmentBuiltinFallbacks/constants.js new file mode 100644 index 00000000000..7847a0f9b36 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/constants.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('constants'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/createDevelopmentNodeBuiltinFallback.js b/packages/react-scripts/config/developmentBuiltinFallbacks/createDevelopmentNodeBuiltinFallback.js new file mode 100644 index 00000000000..e36b9ca5dc2 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/createDevelopmentNodeBuiltinFallback.js @@ -0,0 +1,49 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = function createDevelopmentNodeBuiltinFallback(nodeModuleName) { + const linkToDocumentation = + 'https://create-react-app.dev/docs/nodejs-builtin-fallbacks'; + const defaultMessage = `(dev) Error: Module "${nodeModuleName}" not found, ref: ${linkToDocumentation}`; + + const defaultExport = { + $$typeof: defaultMessage, + __esModule: { + value: true, + }, + }; + try { + // Modern browsers with Proxy support - Shows warning in $$type, default and specific imports + return new Proxy(Object.assign({}, defaultExport), { + get: function developmentFallback(target, prop) { + if (['$$typeof', '__esModule'].includes(prop)) { + return target; + } + + console.error( + `(dev) Error: Module "${nodeModuleName}" not found, cannot access property "${prop}", please read ${linkToDocumentation}` + ); + throw TypeError(); + }, + }); + } catch (error) { + // Legacy browsers without Proxy support - Limited to showing warnings in $$type and default + const result = Object.assign({}, defaultExport); + + Object.defineProperty(result, 'default', { + get: function () { + console.error(defaultMessage); + throw new TypeError(); + }, + }); + + return result; + } +}; diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/crypto.js b/packages/react-scripts/config/developmentBuiltinFallbacks/crypto.js new file mode 100644 index 00000000000..df110d19d5c --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/crypto.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('crypto'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/domain.js b/packages/react-scripts/config/developmentBuiltinFallbacks/domain.js new file mode 100644 index 00000000000..5200005b568 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/domain.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('domain'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/events.js b/packages/react-scripts/config/developmentBuiltinFallbacks/events.js new file mode 100644 index 00000000000..0a392705f30 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/events.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('events'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/http.js b/packages/react-scripts/config/developmentBuiltinFallbacks/http.js new file mode 100644 index 00000000000..63c1b7f2fe0 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/http.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('http'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/https.js b/packages/react-scripts/config/developmentBuiltinFallbacks/https.js new file mode 100644 index 00000000000..e6f9cc2cd5e --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/https.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('https'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/os.js b/packages/react-scripts/config/developmentBuiltinFallbacks/os.js new file mode 100644 index 00000000000..8a3457871d0 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/os.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('os'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/path.js b/packages/react-scripts/config/developmentBuiltinFallbacks/path.js new file mode 100644 index 00000000000..9ddb53acf5e --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/path.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('path'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/process.js b/packages/react-scripts/config/developmentBuiltinFallbacks/process.js new file mode 100644 index 00000000000..f61ec89ed16 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/process.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('process'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/punycode.js b/packages/react-scripts/config/developmentBuiltinFallbacks/punycode.js new file mode 100644 index 00000000000..52b846e2062 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/punycode.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('punycode'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/querystring.js b/packages/react-scripts/config/developmentBuiltinFallbacks/querystring.js new file mode 100644 index 00000000000..a3770ca0b76 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/querystring.js @@ -0,0 +1,13 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')( + 'querystring' +); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/stream.js b/packages/react-scripts/config/developmentBuiltinFallbacks/stream.js new file mode 100644 index 00000000000..038c79cfeb9 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/stream.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('stream'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/string_decoder.js b/packages/react-scripts/config/developmentBuiltinFallbacks/string_decoder.js new file mode 100644 index 00000000000..0d37cbd9bb8 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/string_decoder.js @@ -0,0 +1,13 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')( + 'string_decoder' +); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/sys.js b/packages/react-scripts/config/developmentBuiltinFallbacks/sys.js new file mode 100644 index 00000000000..fdd68594204 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/sys.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('sys'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/timers.js b/packages/react-scripts/config/developmentBuiltinFallbacks/timers.js new file mode 100644 index 00000000000..544c121e43b --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/timers.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('timers'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/tty.js b/packages/react-scripts/config/developmentBuiltinFallbacks/tty.js new file mode 100644 index 00000000000..fa9fc13f58e --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/tty.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('tty'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/url.js b/packages/react-scripts/config/developmentBuiltinFallbacks/url.js new file mode 100644 index 00000000000..0ffbc8f25d6 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/url.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('url'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/util.js b/packages/react-scripts/config/developmentBuiltinFallbacks/util.js new file mode 100644 index 00000000000..d4014314ac2 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/util.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('util'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/vm.js b/packages/react-scripts/config/developmentBuiltinFallbacks/vm.js new file mode 100644 index 00000000000..6690e13c5ea --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/vm.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('vm'); diff --git a/packages/react-scripts/config/developmentBuiltinFallbacks/zlib.js b/packages/react-scripts/config/developmentBuiltinFallbacks/zlib.js new file mode 100644 index 00000000000..617a5f4c3c3 --- /dev/null +++ b/packages/react-scripts/config/developmentBuiltinFallbacks/zlib.js @@ -0,0 +1,11 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +module.exports = require('./createDevelopmentNodeBuiltinFallback')('zlib'); diff --git a/packages/react-scripts/config/nodeBuiltinFallbacks.js b/packages/react-scripts/config/nodeBuiltinFallbacks.js new file mode 100644 index 00000000000..041a6838abc --- /dev/null +++ b/packages/react-scripts/config/nodeBuiltinFallbacks.js @@ -0,0 +1,83 @@ +// @remove-on-eject-begin +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +// @remove-on-eject-end +'use strict'; + +const paths = require('./paths'); + +const builtinFallbackMap = { + // Reference: https://github.com/webpack/webpack/blob/c181294865dca01b28e6e316636fef5f2aad4eb6/lib/ModuleNotFoundError.js#L13 + assert: 'assert/', + buffer: 'buffer/', + console: 'console-browserify', + constants: 'constants-browserify', + crypto: 'crypto-browserify', + domain: 'domain-browser', + events: 'events/', + http: 'stream-http', + https: 'https-browserify', + os: 'os-browserify/browser', + path: 'path-browserify', + punycode: 'punycode/', + process: 'process/browser', + querystring: 'querystring-es3', + stream: 'stream-browserify', + _stream_duplex: 'readable-stream/duplex', + _stream_passthrough: 'readable-stream/passthrough', + _stream_readable: 'readable-stream/readable', + _stream_transform: 'readable-stream/transform', + _stream_writable: 'readable-stream/writable', + string_decoder: 'string_decoder/', + sys: 'util/', + timers: 'timers-browserify', + tty: 'tty-browserify', + url: 'url/', + util: 'util/', + vm: 'vm-browserify', + zlib: 'browserify-zlib', +}; + +const disableDevelopmentFallback = + process.env.DISABLE_MISSING_NODEJS_BUILTIN_MODULE_FALLBACK_WARNING === 'true'; + +function createNodeBuiltinFallbacks(webpackEnv) { + const fallbacks = {}; + const isEnvProduction = webpackEnv === 'production'; + + const appPackageJson = require(paths.appPackageJson); + + for (const [nodeModule, fallbackModule] of Object.entries( + builtinFallbackMap + )) { + const [fallbackModuleName] = fallbackModule.split('/'); + fallbacks[nodeModule] = + isEnvProduction || disableDevelopmentFallback + ? false // Default don't include polyfills per default in production + : require.resolve(`./developmentBuiltinFallbacks/${nodeModule}`); // Default polyfill in development for better DX + + if (appPackageJson.dependencies[fallbackModuleName]) { + // Check app package.json for fallback dependency making sure we use project installed fallbacks + try { + // Use installed fallback + fallbacks[nodeModule] = require.resolve(fallbackModule); + } catch (e) { + // If ever fallback resolve failed + console.error( + `Failed to load fallback module "${fallbackModule}" for "${nodeModule}"` + ); + } + } + } + + return { + fallbacks, + fallbackEntries: Object.values(fallbacks), + }; +} + +module.exports = createNodeBuiltinFallbacks; diff --git a/packages/react-scripts/config/webpack.config.js b/packages/react-scripts/config/webpack.config.js index 2b1b3bbd47d..6c25c5b1f5e 100644 --- a/packages/react-scripts/config/webpack.config.js +++ b/packages/react-scripts/config/webpack.config.js @@ -37,6 +37,9 @@ const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin' const getCacheIdentifier = require('react-dev-utils/getCacheIdentifier'); // @remove-on-eject-end const createEnvironmentHash = require('./webpack/persistentCache/createEnvironmentHash'); +// @remove-on-eject-begin +const nodeBuiltinFallbacks = require('./nodeBuiltinFallbacks'); +// @remove-on-eject-end // Source maps are resource heavy and can cause out of memory issue for large source files. const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== 'false'; @@ -114,6 +117,10 @@ module.exports = function (webpackEnv) { const shouldUseReactRefresh = env.raw.FAST_REFRESH; + // @remove-on-eject-begin + const nodeBuiltin = nodeBuiltinFallbacks(webpackEnv); + // @remove-on-eject-end + // common function to get style loaders const getStyleLoaders = (cssOptions, preProcessor) => { const loaders = [ @@ -301,6 +308,13 @@ module.exports = function (webpackEnv) { ], }, resolve: { + // @remove-on-eject-begin + // This adds support for node builtins + fallback: { + ...nodeBuiltin.fallbacks, + }, + // @remove-on-eject-end + // This allows you to set a fallback for where webpack should look for modules. // We placed these paths second because we want `node_modules` to "win" // if there are any conflicts. This matches Node resolution mechanism. @@ -341,6 +355,9 @@ module.exports = function (webpackEnv) { babelRuntimeEntry, babelRuntimeEntryHelpers, babelRuntimeRegenerator, + // @remove-on-eject-begin + ...nodeBuiltin.fallbackEntries, + // @remove-on-eject-end ]), ], },