diff --git a/package.json b/package.json index b093e33e90023..42e625fd6cbd0 100644 --- a/package.json +++ b/package.json @@ -104,7 +104,7 @@ }, "scripts": { "build": "node ./scripts/rollup/build.js", - "build-for-devtools": "cross-env RELEASE_CHANNEL=experimental yarn build react/index,react-dom,react-is,react-debug-tools,scheduler,react-test-renderer --type=NODE", + "build-for-devtools": "cross-env RELEASE_CHANNEL=experimental yarn build react/index,react-dom,react-is,react-debug-tools,scheduler,react-test-renderer,react-refresh --type=NODE", "linc": "node ./scripts/tasks/linc.js", "lint": "node ./scripts/tasks/eslint.js", "lint-build": "node ./scripts/rollup/validate/index.js", diff --git a/packages/react-devtools-scheduling-profiler/package.json b/packages/react-devtools-scheduling-profiler/package.json index 2923f10ff7a56..60564834cde32 100644 --- a/packages/react-devtools-scheduling-profiler/package.json +++ b/packages/react-devtools-scheduling-profiler/package.json @@ -17,6 +17,7 @@ "regenerator-runtime": "^0.13.7" }, "devDependencies": { + "@pmmmwh/react-refresh-webpack-plugin": "^0.4.1", "babel-loader": "^8.1.0", "css-loader": "^4.2.1", "file-loader": "^6.0.0", diff --git a/packages/react-devtools-scheduling-profiler/webpack.config.js b/packages/react-devtools-scheduling-profiler/webpack.config.js index 91d6a141c2cb1..20def602b2ee2 100644 --- a/packages/react-devtools-scheduling-profiler/webpack.config.js +++ b/packages/react-devtools-scheduling-profiler/webpack.config.js @@ -3,23 +3,24 @@ const {resolve} = require('path'); const {DefinePlugin} = require('webpack'); const HtmlWebpackPlugin = require('html-webpack-plugin'); +const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin'); const NODE_ENV = process.env.NODE_ENV; if (!NODE_ENV) { console.error('NODE_ENV not set'); process.exit(1); } +const __DEV__ = NODE_ENV === 'development'; const TARGET = process.env.TARGET; if (!TARGET) { console.error('TARGET not set'); process.exit(1); } +const shouldUseDevServer = TARGET === 'local'; const builtModulesDir = resolve(__dirname, '..', '..', 'build', 'node_modules'); -const __DEV__ = NODE_ENV === 'development'; - const imageInlineSizeLimit = 10000; const config = { @@ -32,6 +33,7 @@ const config = { alias: { react: resolve(builtModulesDir, 'react'), 'react-dom': resolve(builtModulesDir, 'react-dom'), + 'react-refresh': resolve(builtModulesDir, 'react-refresh'), }, }, plugins: [ @@ -43,7 +45,8 @@ const config = { new HtmlWebpackPlugin({ title: 'React Concurrent Mode Profiler', }), - ], + shouldUseDevServer && new ReactRefreshWebpackPlugin(), + ].filter(Boolean), module: { rules: [ { @@ -56,6 +59,9 @@ const config = { 'react-devtools-shared', 'babel.config.js', ), + plugins: shouldUseDevServer + ? [resolve(builtModulesDir, 'react-refresh/babel')] + : [], }, }, { @@ -87,7 +93,7 @@ const config = { }, }; -if (TARGET === 'local') { +if (shouldUseDevServer) { config.devServer = { hot: true, port: 8080, diff --git a/yarn.lock b/yarn.lock index cc19b161d748d..6d31511a84500 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1821,6 +1821,18 @@ universal-user-agent "^3.0.0" url-template "^2.0.8" +"@pmmmwh/react-refresh-webpack-plugin@^0.4.1": + version "0.4.1" + resolved "https://registry.yarnpkg.com/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.4.1.tgz#a4db0ed8e58c2f8566161c9a8cdf1d095c9a891b" + integrity sha512-MzM87WdX2r2KRFfhEho7oGyK1XRE/J9WwjB3v6oLQHN0dzBypBZxSWjnoYx+RWneRCsg8Sin1myf+EjX1fqIbQ== + dependencies: + ansi-html "^0.0.7" + error-stack-parser "^2.0.6" + html-entities "^1.2.1" + native-url "^0.2.6" + schema-utils "^2.6.5" + source-map "^0.7.3" + "@reach/auto-id@0.2.0": version "0.2.0" resolved "https://registry.yarnpkg.com/@reach/auto-id/-/auto-id-0.2.0.tgz#97f9e48fe736aa5c6f4f32cf73c1f19d005f8550" @@ -2592,7 +2604,7 @@ ansi-gray@^0.1.1: dependencies: ansi-wrap "0.1.0" -ansi-html@0.0.7: +ansi-html@0.0.7, ansi-html@^0.0.7: version "0.0.7" resolved "https://registry.yarnpkg.com/ansi-html/-/ansi-html-0.0.7.tgz#813584021962a9e9e6fd039f940d12f56ca7859e" integrity sha1-gTWEAhliqenm/QOflA0S9WynhZ4= @@ -9509,6 +9521,13 @@ nanomatch@^1.2.9: snapdragon "^0.8.1" to-regex "^3.0.1" +native-url@^0.2.6: + version "0.2.6" + resolved "https://registry.yarnpkg.com/native-url/-/native-url-0.2.6.tgz#ca1258f5ace169c716ff44eccbddb674e10399ae" + integrity sha512-k4bDC87WtgrdD362gZz6zoiXQrl40kYlBmpfmSjwRO1VU0V5ccwJTlxuE72F6m3V0vc1xOf6n3UCP9QyerRqmA== + dependencies: + querystring "^0.2.0" + natural-compare-lite@~1.4.0: version "1.4.0" resolved "https://registry.yarnpkg.com/natural-compare-lite/-/natural-compare-lite-1.4.0.tgz#17b09581988979fddafe0201e931ba933c96cbb4" @@ -10900,7 +10919,7 @@ querystring-es3@^0.2.0, querystring-es3@~0.2.0: resolved "https://registry.yarnpkg.com/querystring-es3/-/querystring-es3-0.2.1.tgz#9ec61f79049875707d69414596fd907a4d711e73" integrity sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM= -querystring@0.2.0: +querystring@0.2.0, querystring@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/querystring/-/querystring-0.2.0.tgz#b209849203bb25df820da756e747005878521620" integrity sha1-sgmEkgO7Jd+CDadW50cAWHhSFiA=