From 6ff7cd36b193f17567a70780100d55d5cf1c996f Mon Sep 17 00:00:00 2001 From: ClarkXia Date: Fri, 3 Mar 2023 16:36:31 +0800 Subject: [PATCH 1/5] fix: enable hmr to avoid reload --- packages/bundles/package.json | 4 +- .../ice/templates/core/entry.client.tsx.ejs | 5 + packages/webpack-config/src/index.ts | 1 + pnpm-lock.yaml | 108 +++--------------- 4 files changed, 25 insertions(+), 93 deletions(-) diff --git a/packages/bundles/package.json b/packages/bundles/package.json index 05eae3f51c..f02843cbed 100644 --- a/packages/bundles/package.json +++ b/packages/bundles/package.json @@ -68,7 +68,7 @@ "trusted-cert": "1.1.3", "webpack": "5.75.0", "webpack-bundle-analyzer": "4.5.0", - "webpack-dev-server": "4.10.0", + "webpack-dev-server": "4.11.1", "unplugin": "0.9.5", "bonjour-service": "^1.0.13", "colorette": "^2.0.10", @@ -91,7 +91,7 @@ "webpack-dev-middleware": "^5.3.1", "ws": "^8.4.2", "globby": "13.1.2", - "@pmmmwh/react-refresh-webpack-plugin": "0.5.7", + "@pmmmwh/react-refresh-webpack-plugin": "0.5.10", "loader-utils": "^2.0.0", "source-map": "0.8.0-beta.0", "find-up": "5.0.0", diff --git a/packages/ice/templates/core/entry.client.tsx.ejs b/packages/ice/templates/core/entry.client.tsx.ejs index f1437fb81b..6c6025af9f 100644 --- a/packages/ice/templates/core/entry.client.tsx.ejs +++ b/packages/ice/templates/core/entry.client.tsx.ejs @@ -40,3 +40,8 @@ const render = (customOptions = {}) => { }; <%- entryCode %> + +if (import.meta.webpackHot) { + import.meta.webpackHot.decline(); + import.meta.webpackHot.accept(); +} diff --git a/packages/webpack-config/src/index.ts b/packages/webpack-config/src/index.ts index 1ee084027e..3edded58e6 100644 --- a/packages/webpack-config/src/index.ts +++ b/packages/webpack-config/src/index.ts @@ -360,6 +360,7 @@ export function getWebpackConfig(options: GetWebpackConfigOptions): Configuratio }), ].filter(Boolean), devServer: merge({ + liveReload: false, allowedHosts: 'all', headers: { 'Access-Control-Allow-Origin': '*', diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index ec8f12a8ba..2af4cdeca6 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -799,7 +799,7 @@ importers: '@ice/swc-plugin-keep-export': 0.1.4 '@ice/swc-plugin-node-transform': 0.1.0-5 '@ice/swc-plugin-remove-export': 0.1.2 - '@pmmmwh/react-refresh-webpack-plugin': 0.5.7 + '@pmmmwh/react-refresh-webpack-plugin': 0.5.10 '@swc/core': 1.3.19 '@types/cacache': ^15.0.1 '@types/less': ^3.0.3 @@ -873,7 +873,7 @@ importers: webpack: 5.75.0 webpack-bundle-analyzer: 4.5.0 webpack-dev-middleware: ^5.3.1 - webpack-dev-server: 4.10.0 + webpack-dev-server: 4.11.1 ws: ^8.4.2 dependencies: '@ice/swc-plugin-keep-export': 0.1.4 @@ -895,7 +895,7 @@ importers: react-refresh: 0.14.0 sass: 1.50.0 devDependencies: - '@pmmmwh/react-refresh-webpack-plugin': 0.5.7_m75for7sf55ah73zax6rma6s6a + '@pmmmwh/react-refresh-webpack-plugin': 0.5.10_e764yt37rymiplqgpb7fiwcihu '@types/cacache': 15.0.1 '@types/less': 3.0.3 '@types/lodash': 4.14.185 @@ -954,7 +954,7 @@ importers: webpack: 5.75.0_ncbsfugu56ddhgadp34k4kpsue webpack-bundle-analyzer: 4.5.0 webpack-dev-middleware: 5.3.3_webpack@5.75.0 - webpack-dev-server: 4.10.0_webpack@5.75.0 + webpack-dev-server: 4.11.1_webpack@5.75.0 ws: 8.9.0 packages/create-ice: @@ -6076,14 +6076,14 @@ packages: rimraf: 3.0.2 dev: true - /@pmmmwh/react-refresh-webpack-plugin/0.5.7_m75for7sf55ah73zax6rma6s6a: - resolution: {integrity: sha512-bcKCAzF0DV2IIROp9ZHkRJa6O4jy7NlnHdWL3GmcUxYWNjLXkK5kfELELwEfSP5hXPfVL/qOGMAROuMQb9GG8Q==} + /@pmmmwh/react-refresh-webpack-plugin/0.5.10_e764yt37rymiplqgpb7fiwcihu: + resolution: {integrity: sha512-j0Ya0hCFZPd4x40qLzbhGsh9TMtdb+CJQiso+WxLOPNasohq9cc5SNUcwsZaRH6++Xh91Xkm/xHCkuIiIu0LUA==} engines: {node: '>= 10.13'} peerDependencies: '@types/webpack': 4.x || 5.x react-refresh: '>=0.10.0 <1.0.0' sockjs-client: ^1.4.0 - type-fest: '>=0.17.0 <3.0.0' + type-fest: '>=0.17.0 <4.0.0' webpack: '>=4.43.0 <6.0.0' webpack-dev-server: 3.x || 4.x webpack-hot-middleware: 2.x @@ -6104,16 +6104,16 @@ packages: dependencies: ansi-html-community: 0.0.8 common-path-prefix: 3.0.0 - core-js-pure: 3.25.3 + core-js-pure: 3.27.2 error-stack-parser: 2.1.4 find-up: 5.0.0 html-entities: 2.3.3 - loader-utils: 2.0.2 + loader-utils: 2.0.4 react-refresh: 0.14.0 schema-utils: 3.1.1 source-map: 0.7.4 webpack: 5.75.0_ncbsfugu56ddhgadp34k4kpsue - webpack-dev-server: 4.10.0_webpack@5.75.0 + webpack-dev-server: 4.11.1_webpack@5.75.0 dev: true /@polka/url/1.0.0-next.21: @@ -7383,12 +7383,6 @@ packages: - webpack-cli dev: true - /@types/ws/8.5.3: - resolution: {integrity: sha512-6YOoWjruKj1uLf3INHH7D3qTXwFfEsg1kf3c0uDdSBJwfa/llkwIjrAGV7j7mVgGNbzTQ3HiHKKDXl6bJPD97w==} - dependencies: - '@types/node': 18.7.23 - dev: true - /@types/ws/8.5.4: resolution: {integrity: sha512-zdQDHKUgcX/zBc4GrwsE/7dVdAD8JR4EuiAXiiUhhfyIJXXb2+PrGshFyeXWQPMmmZ2XxgaqclgpIC7eTXc1mg==} dependencies: @@ -9442,8 +9436,8 @@ packages: engines: {node: '>=10'} hasBin: true dependencies: - JSONStream: 1.3.5 is-text-path: 1.0.1 + JSONStream: 1.3.5 lodash: 4.17.21 meow: 8.1.2 split2: 3.2.2 @@ -9518,6 +9512,7 @@ packages: /core-js-pure/3.25.3: resolution: {integrity: sha512-T/7qvgv70MEvRkZ8p6BasLZmOVYKzOaWNBEHAU8FmveCJkl4nko2quqPQOmy6AJIp5MBanhz9no3A94NoRb0XA==} requiresBuild: true + dev: false /core-js-pure/3.27.2: resolution: {integrity: sha512-Cf2jqAbXgWH3VVzjyaaFkY1EBazxugUepGymDoeteyYr9ByX51kD2jdHZlsEF/xnJMyN3Prua7mQuzwMg6Zc9A==} @@ -12821,25 +12816,6 @@ packages: - debug dev: false - /http-proxy-middleware/2.0.6_@types+express@4.17.14: - resolution: {integrity: sha512-ya/UeJ6HVBYxrgYotAZo1KvPWlgB48kUJLDePFeneHsVujFaW5WNj2NgWCAE//B1Dl02BIfYlpNgBy8Kf8Rjmw==} - engines: {node: '>=12.0.0'} - peerDependencies: - '@types/express': ^4.17.13 - peerDependenciesMeta: - '@types/express': - optional: true - dependencies: - '@types/express': 4.17.14 - '@types/http-proxy': 1.17.9 - http-proxy: 1.18.1 - is-glob: 4.0.3 - is-plain-obj: 3.0.0 - micromatch: 4.0.5 - transitivePeerDependencies: - - debug - dev: true - /http-proxy-middleware/2.0.6_@types+express@4.17.16: resolution: {integrity: sha512-ya/UeJ6HVBYxrgYotAZo1KvPWlgB48kUJLDePFeneHsVujFaW5WNj2NgWCAE//B1Dl02BIfYlpNgBy8Kf8Rjmw==} engines: {node: '>=12.0.0'} @@ -18611,12 +18587,6 @@ packages: /react-dev-utils/12.0.1_hhrrucqyg4eysmfpujvov2ym5u: resolution: {integrity: sha512-84Ivxmr17KjUupyqzFode6xKhjwuEJDROWKJy/BthkL7Wn6NJ8h4WE6k/exAv6ImS+0oZLRRW5j/aINMHyeGeQ==} engines: {node: '>=14'} - peerDependencies: - typescript: '>=2.7' - webpack: '>=4' - peerDependenciesMeta: - typescript: - optional: true dependencies: '@babel/code-frame': 7.18.6 address: 1.2.2 @@ -18647,7 +18617,9 @@ packages: transitivePeerDependencies: - eslint - supports-color + - typescript - vue-template-compiler + - webpack /react-dom/17.0.2_react@17.0.2: resolution: {integrity: sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==} @@ -20519,6 +20491,7 @@ packages: serialize-javascript: 6.0.0 terser: 5.16.2 webpack: 5.75.0_esbuild@0.16.10 + dev: true /terser-webpack-plugin/5.3.6_peqg53aznxdu6ibj7wrnfxrfiq: resolution: {integrity: sha512-kfLFk+PoLUQIbLmB1+PZDMRSZS99Mp+/MHqDNmMA6tOItzRt+Npe3E+fsMs5mfcM0wCtrrdU387UnV+vnSffXQ==} @@ -21715,54 +21688,6 @@ packages: schema-utils: 4.0.0 webpack: 5.75.0_ncbsfugu56ddhgadp34k4kpsue - /webpack-dev-server/4.10.0_webpack@5.75.0: - resolution: {integrity: sha512-7dezwAs+k6yXVFZ+MaL8VnE+APobiO3zvpp3rBHe/HmWQ+avwh0Q3d0xxacOiBybZZ3syTZw9HXzpa3YNbAZDQ==} - engines: {node: '>= 12.13.0'} - hasBin: true - peerDependencies: - webpack: ^4.37.0 || ^5.0.0 - webpack-cli: '*' - peerDependenciesMeta: - webpack-cli: - optional: true - dependencies: - '@types/bonjour': 3.5.10 - '@types/connect-history-api-fallback': 1.3.5 - '@types/express': 4.17.14 - '@types/serve-index': 1.9.1 - '@types/serve-static': 1.15.0 - '@types/sockjs': 0.3.33 - '@types/ws': 8.5.3 - ansi-html-community: 0.0.8 - bonjour-service: 1.0.14 - chokidar: 3.5.3 - colorette: 2.0.19 - compression: 1.7.4 - connect-history-api-fallback: 2.0.0 - default-gateway: 6.0.3 - express: 4.18.1 - graceful-fs: 4.2.10 - html-entities: 2.3.3 - http-proxy-middleware: 2.0.6_@types+express@4.17.14 - ipaddr.js: 2.0.1 - open: 8.4.0 - p-retry: 4.6.2 - rimraf: 3.0.2 - schema-utils: 4.0.0 - selfsigned: 2.1.1 - serve-index: 1.9.1 - sockjs: 0.3.24 - spdy: 4.0.2 - webpack: 5.75.0_ncbsfugu56ddhgadp34k4kpsue - webpack-dev-middleware: 5.3.3_webpack@5.75.0 - ws: 8.9.0 - transitivePeerDependencies: - - bufferutil - - debug - - supports-color - - utf-8-validate - dev: true - /webpack-dev-server/4.11.1_debug@4.3.4+webpack@5.75.0: resolution: {integrity: sha512-lILVz9tAUy1zGFwieuaQtYiadImb5M3d+H+L1zDYalYoDl0cksAB1UNyuE5MMWJrG6zR1tXkCP2fitl7yoUJiw==} engines: {node: '>= 12.13.0'} @@ -21849,7 +21774,7 @@ packages: serve-index: 1.9.1 sockjs: 0.3.24 spdy: 4.0.2 - webpack: 5.75.0_esbuild@0.16.10 + webpack: 5.75.0_ncbsfugu56ddhgadp34k4kpsue webpack-dev-middleware: 5.3.3_webpack@5.75.0 ws: 8.12.0 transitivePeerDependencies: @@ -21958,6 +21883,7 @@ packages: - '@swc/core' - esbuild - uglify-js + dev: true /webpack/5.75.0_ncbsfugu56ddhgadp34k4kpsue: resolution: {integrity: sha512-piaIaoVJlqMsPtX/+3KTTO6jfvrSYgauFVdt8cr9LTHKmcq/AMd4mhzsiP7ZF/PGRNPGA8336jldh9l2Kt2ogQ==} From 4c88f385e81769572eb92affc1f68ab1740b94e1 Mon Sep 17 00:00:00 2001 From: ClarkXia Date: Fri, 3 Mar 2023 16:51:23 +0800 Subject: [PATCH 2/5] Update entry.client.tsx.ejs --- packages/ice/templates/core/entry.client.tsx.ejs | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/ice/templates/core/entry.client.tsx.ejs b/packages/ice/templates/core/entry.client.tsx.ejs index 6c6025af9f..24f76211ac 100644 --- a/packages/ice/templates/core/entry.client.tsx.ejs +++ b/packages/ice/templates/core/entry.client.tsx.ejs @@ -42,6 +42,5 @@ const render = (customOptions = {}) => { <%- entryCode %> if (import.meta.webpackHot) { - import.meta.webpackHot.decline(); import.meta.webpackHot.accept(); } From d7ad365f0c63c683e02ba62f8a39a20957c391ce Mon Sep 17 00:00:00 2001 From: ClarkXia Date: Fri, 3 Mar 2023 16:53:10 +0800 Subject: [PATCH 3/5] fix: changelog --- .changeset/curly-windows-think.md | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 .changeset/curly-windows-think.md diff --git a/.changeset/curly-windows-think.md b/.changeset/curly-windows-think.md new file mode 100644 index 0000000000..50e8a8d6f9 --- /dev/null +++ b/.changeset/curly-windows-think.md @@ -0,0 +1,7 @@ +--- +'@ice/webpack-config': patch +'@ice/bundles': patch +'@ice/app': patch +--- + +fix: enable hmr to avoid reload From ed29192b9ca44ea523644222eb0fc4eb36cb2663 Mon Sep 17 00:00:00 2001 From: ClarkXia Date: Fri, 3 Mar 2023 17:13:49 +0800 Subject: [PATCH 4/5] fix: config --- packages/webpack-config/src/index.ts | 2 +- packages/webpack-config/src/unPlugins/compilation.ts | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/webpack-config/src/index.ts b/packages/webpack-config/src/index.ts index 3edded58e6..3daf4b32d0 100644 --- a/packages/webpack-config/src/index.ts +++ b/packages/webpack-config/src/index.ts @@ -323,7 +323,7 @@ export function getWebpackConfig(options: GetWebpackConfigOptions): Configuratio ...plugins, ...compilerWebpackPlugins, // @ts-ignore - new EnvReplacementPlugin(), + dev && new EnvReplacementPlugin(), dev && fastRefresh && new ReactRefreshWebpackPlugin({ exclude: [/node_modules/, /bundles[\\\\/]compiled/], // use webpack-dev-server overlay instead diff --git a/packages/webpack-config/src/unPlugins/compilation.ts b/packages/webpack-config/src/unPlugins/compilation.ts index 59d1e6bf65..d4c6586966 100644 --- a/packages/webpack-config/src/unPlugins/compilation.ts +++ b/packages/webpack-config/src/unPlugins/compilation.ts @@ -195,6 +195,8 @@ function getJsxTransformOptions({ rootDir, }: GetJsxTransformOptions) { const reactTransformConfig: ReactConfig = { + // Swc won't enable fast refresh when development is false in the latest version. + development: mode === 'development', refresh: fastRefresh, runtime: 'automatic', importSource: '@ice/runtime', // The exact import source is '@ice/runtime/jsx-runtime' From 87caf7dc942ebcefd5c3ba7663b1a3ff46079c67 Mon Sep 17 00:00:00 2001 From: ClarkXia Date: Fri, 3 Mar 2023 17:29:01 +0800 Subject: [PATCH 5/5] fix: optimize code --- packages/webpack-config/src/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/webpack-config/src/index.ts b/packages/webpack-config/src/index.ts index 3daf4b32d0..089ee35f23 100644 --- a/packages/webpack-config/src/index.ts +++ b/packages/webpack-config/src/index.ts @@ -323,7 +323,7 @@ export function getWebpackConfig(options: GetWebpackConfigOptions): Configuratio ...plugins, ...compilerWebpackPlugins, // @ts-ignore - dev && new EnvReplacementPlugin(), + !dev && new EnvReplacementPlugin(), dev && fastRefresh && new ReactRefreshWebpackPlugin({ exclude: [/node_modules/, /bundles[\\\\/]compiled/], // use webpack-dev-server overlay instead