From 354b1eee42cb1eca7e1c76e561030fa9428ff008 Mon Sep 17 00:00:00 2001 From: ahabhgk Date: Fri, 15 Sep 2023 19:53:22 +0800 Subject: [PATCH 1/2] feat: compatible with webpack-dev-server --- crates/node_binding/binding.d.ts | 1 + .../rspack_binding_options/src/options/mod.rs | 3 - .../src/options/raw_builtins/mod.rs | 5 + packages/playground/fixtures/index.ts | 3 +- packages/playground/fixtures/rspack.ts | 151 +++++++++--------- packages/playground/package.json | 7 +- packages/rspack-dev-server/src/server.ts | 5 +- packages/rspack/src/Compiler.ts | 13 +- .../HotModuleReplacementPlugin.ts | 6 + packages/rspack/src/builtin-plugin/base.ts | 1 + packages/rspack/src/builtin-plugin/index.ts | 1 + packages/rspack/src/index.ts | 3 +- .../rspack/tests/HotTestCases.template.ts | 10 +- .../__snapshots__/StatsTestCases.test.ts.snap | 18 +-- pnpm-lock.yaml | 117 ++++++++++++-- 15 files changed, 233 insertions(+), 111 deletions(-) create mode 100644 packages/rspack/src/builtin-plugin/HotModuleReplacementPlugin.ts diff --git a/crates/node_binding/binding.d.ts b/crates/node_binding/binding.d.ts index 9c7c97f3c74..b7676664394 100644 --- a/crates/node_binding/binding.d.ts +++ b/crates/node_binding/binding.d.ts @@ -129,6 +129,7 @@ export const enum BuiltinPluginName { CommonJsChunkFormatPlugin = 'CommonJsChunkFormatPlugin', ArrayPushCallbackChunkFormatPlugin = 'ArrayPushCallbackChunkFormatPlugin', ModuleChunkFormatPlugin = 'ModuleChunkFormatPlugin', + HotModuleReplacementPlugin = 'HotModuleReplacementPlugin', HttpExternalsRspackPlugin = 'HttpExternalsRspackPlugin', CopyRspackPlugin = 'CopyRspackPlugin', HtmlRspackPlugin = 'HtmlRspackPlugin', diff --git a/crates/rspack_binding_options/src/options/mod.rs b/crates/rspack_binding_options/src/options/mod.rs index 21ee026e89a..e7e1810497b 100644 --- a/crates/rspack_binding_options/src/options/mod.rs +++ b/crates/rspack_binding_options/src/options/mod.rs @@ -125,9 +125,6 @@ impl RawOptionsApply for RawOptions { .boxed(), ); plugins.push(rspack_plugin_json::JsonPlugin {}.boxed()); - if dev_server.hot { - plugins.push(rspack_plugin_hmr::HotModuleReplacementPlugin {}.boxed()); - } plugins.push(rspack_plugin_runtime::RuntimePlugin {}.boxed()); if experiments.lazy_compilation { plugins.push(rspack_plugin_runtime::LazyCompilationPlugin {}.boxed()); diff --git a/crates/rspack_binding_options/src/options/raw_builtins/mod.rs b/crates/rspack_binding_options/src/options/raw_builtins/mod.rs index 50844ca53a1..dc028bb5bea 100644 --- a/crates/rspack_binding_options/src/options/raw_builtins/mod.rs +++ b/crates/rspack_binding_options/src/options/raw_builtins/mod.rs @@ -19,6 +19,7 @@ use rspack_plugin_entry::EntryPlugin; use rspack_plugin_externals::{ electron_target_plugin, http_externals_rspack_plugin, node_target_plugin, ExternalsPlugin, }; +use rspack_plugin_hmr::HotModuleReplacementPlugin; use rspack_plugin_html::HtmlRspackPlugin; use rspack_plugin_library::enable_library_plugin; use rspack_plugin_progress::ProgressPlugin; @@ -58,6 +59,7 @@ pub enum BuiltinPluginName { CommonJsChunkFormatPlugin, ArrayPushCallbackChunkFormatPlugin, ModuleChunkFormatPlugin, + HotModuleReplacementPlugin, // rspack specific plugins HttpExternalsRspackPlugin, @@ -148,6 +150,9 @@ impl RawOptionsApply for BuiltinPlugin { BuiltinPluginName::ModuleChunkFormatPlugin => { plugins.push(ModuleChunkFormatPlugin.boxed()); } + BuiltinPluginName::HotModuleReplacementPlugin => { + plugins.push(HotModuleReplacementPlugin.boxed()); + } // rspack specific plugins BuiltinPluginName::HttpExternalsRspackPlugin => { diff --git a/packages/playground/fixtures/index.ts b/packages/playground/fixtures/index.ts index 5358095e7c7..57c677c5fec 100644 --- a/packages/playground/fixtures/index.ts +++ b/packages/playground/fixtures/index.ts @@ -5,7 +5,8 @@ import { fileActionFixtures } from "./fileAction"; const test = base .extend(pathInfoFixtures) - .extend(rspackFixtures) + .extend(rspackFixtures(true)) + .extend(rspackFixtures(false)) .extend(fileActionFixtures); export type { RspackOptions }; diff --git a/packages/playground/fixtures/rspack.ts b/packages/playground/fixtures/rspack.ts index 5098b5fd90a..41dd4c21126 100644 --- a/packages/playground/fixtures/rspack.ts +++ b/packages/playground/fixtures/rspack.ts @@ -2,16 +2,18 @@ import path from "path"; import { Fixtures, PlaywrightTestArgs } from "@playwright/test"; import { Compiler, Configuration, createCompiler } from "@rspack/core"; import { RspackDevServer } from "@rspack/dev-server"; +import WebpackDevServer from "webpack-dev-server"; import type { PathInfoFixtures } from "./pathInfo"; import { sleep } from "@/utils/sleep"; class Rspack { projectDir: string; compiler: Compiler; - devServer: RspackDevServer; + devServer: RspackDevServer | WebpackDevServer; private onDone: Array<() => void> = []; constructor( projectDir: string, + wds: boolean, handleRspackConfig: (config: Configuration) => Configuration ) { const configPath = path.resolve(projectDir, "rspack.config.js"); @@ -28,7 +30,8 @@ class Rspack { item(); } }); - this.devServer = new RspackDevServer( + const DevServerConstructor = wds ? WebpackDevServer : RspackDevServer; + this.devServer = new DevServerConstructor( compiler.options.devServer ?? {}, compiler ); @@ -79,84 +82,88 @@ type RspackWorkerFixtures = { ) => Promise; }; -export const rspackFixtures: Fixtures< +export const rspackFixtures = ( + wds: boolean +): Fixtures< RspackOptions & RspackFixtures, RspackWorkerFixtures, PlaywrightTestArgs & PathInfoFixtures -> = { - defaultRspackConfig: [{ handleConfig: c => c }, { option: true }], - rspack: [ - async ( - { page, pathInfo, _startRspackServer, defaultRspackConfig }, - use - ) => { - const rspack = await _startRspackServer( - pathInfo.testFile, - pathInfo.tempProjectDir, - defaultRspackConfig.handleConfig - ); - const port = rspack.devServer.options.port; - await rspack.waitingForBuild(); - await page.goto(`http://localhost:${port}`); - await use(rspack); - }, - { - auto: true - } - ], +> => { + return { + defaultRspackConfig: [{ handleConfig: c => c }, { option: true }], + rspack: [ + async ( + { page, pathInfo, _startRspackServer, defaultRspackConfig }, + use + ) => { + const rspack = await _startRspackServer( + pathInfo.testFile, + pathInfo.tempProjectDir, + defaultRspackConfig.handleConfig + ); + const port = rspack.devServer.options.port; + await rspack.waitingForBuild(); + await page.goto(`http://localhost:${port}`); + await use(rspack); + }, + { + auto: true + } + ], - _startRspackServer: [ - async ({}, use, { workerIndex }) => { - let currentTestFile = ""; - let rspack: Rspack | null = null as any; - await use(async function (testFile, projectDir, handleRspackConfig) { - if (rspack && currentTestFile !== testFile) { - await rspack.devServer.stop(); - rspack = null; - currentTestFile = testFile; - } - if (!rspack) { - const port = 8000 + workerIndex; - rspack = new Rspack(projectDir, function (config) { - // rewrite port - if (!config.devServer) { - config.devServer = {}; - } - config.devServer.port = port; + _startRspackServer: [ + async ({}, use, { workerIndex }) => { + let currentTestFile = ""; + let rspack: Rspack | null = null as any; + await use(async function (testFile, projectDir, handleRspackConfig) { + if (rspack && currentTestFile !== testFile) { + await rspack.devServer.stop(); + rspack = null; + currentTestFile = testFile; + } + if (!rspack) { + const port = 8000 + workerIndex; + rspack = new Rspack(projectDir, wds, function (config) { + // rewrite port + if (!config.devServer) { + config.devServer = {}; + } + config.devServer.port = port; - // set default context - if (!config.context) { - config.context = projectDir; - } + // set default context + if (!config.context) { + config.context = projectDir; + } - // set default define - if (!config.builtins) { - config.builtins = {}; - } - config.builtins.define = Object.assign( - { - "process.env.NODE_ENV": JSON.stringify( - config.mode || "development" - ) - }, - config.builtins.define - ); + // set default define + if (!config.builtins) { + config.builtins = {}; + } + config.builtins.define = Object.assign( + { + "process.env.NODE_ENV": JSON.stringify( + config.mode || "development" + ) + }, + config.builtins.define + ); - return handleRspackConfig(config); - }); - await rspack.devServer.start(); - } + return handleRspackConfig(config); + }); + await rspack.devServer.start(); + } - return rspack; - }); + return rspack; + }); - if (rspack?.projectDir) { - await rspack.devServer.stop(); + if (rspack?.projectDir) { + await rspack.devServer.stop(); + } + }, + { + scope: "worker", + timeout: 60000 } - }, - { - scope: "worker", - timeout: 60000 - } - ] + ] + }; }; diff --git a/packages/playground/package.json b/packages/playground/package.json index 727b958a185..9a70b16b4ba 100644 --- a/packages/playground/package.json +++ b/packages/playground/package.json @@ -14,9 +14,9 @@ "devDependencies": { "@playwright/test": "1.35.0", "@rspack/core": "workspace:*", - "@rspack/plugin-react-refresh": "workspace:*", "@rspack/dev-client": "workspace:*", "@rspack/dev-server": "workspace:*", + "@rspack/plugin-react-refresh": "workspace:*", "@types/fs-extra": "11.0.1", "fs-extra": "11.1.1", "postcss": "^8.4.21", @@ -24,8 +24,9 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "tailwindcss": "^3.3.0", - "ws": "8.8.1", "vue": "3.2.47", - "vue-loader": "^17.2.2" + "vue-loader": "^17.2.2", + "webpack-dev-server": "4.13.1", + "ws": "8.8.1" } } \ No newline at end of file diff --git a/packages/rspack-dev-server/src/server.ts b/packages/rspack-dev-server/src/server.ts index 3177cf06beb..f197bde635f 100644 --- a/packages/rspack-dev-server/src/server.ts +++ b/packages/rspack-dev-server/src/server.ts @@ -155,7 +155,10 @@ export class RspackDevServer extends WebpackDevServer { ); } compiler.options.devServer ??= {}; - compiler.options.devServer.hot = true; + compiler.options.devServer.hot ??= true; + if (compiler.options.devServer.hot) { + new compiler.webpack.HotModuleReplacementPlugin().apply(compiler); + } compiler.options.builtins.react ??= {}; compiler.options.builtins.react.refresh ??= true; compiler.options.builtins.react.development ??= true; diff --git a/packages/rspack/src/Compiler.ts b/packages/rspack/src/Compiler.ts index 048783a7eb8..8b2b128d56a 100644 --- a/packages/rspack/src/Compiler.ts +++ b/packages/rspack/src/Compiler.ts @@ -47,10 +47,6 @@ import { } from "./builtin-plugin"; import { optionsApply_compat } from "./rspackOptionsApply"; -class HotModuleReplacementPlugin { - apply() {} -} - class Compiler { #_instance?: binding.Rspack; @@ -123,7 +119,6 @@ class Compiler { this.builtinPlugins = []; // to workaround some plugin access webpack, we may change dev-server to avoid this hack in the future this.webpack = { - HotModuleReplacementPlugin, // modernjs/server will auto inject this plugin not set NormalModule, get sources(): typeof import("webpack-sources") { return require("webpack-sources"); @@ -153,6 +148,9 @@ class Compiler { get ExternalsPlugin() { return require("./builtin-plugin").ExternalsPlugin; }, + get HotModuleReplacementPlugin() { + return require("./builtin-plugin").HotModuleReplacementPlugin; + }, get LoaderOptionsPlugin() { return require("./lib/LoaderOptionsPlugin").LoaderOptionsPlugin; }, @@ -161,6 +159,11 @@ class Compiler { }, WebpackError: Error, ModuleFilenameHelpers, + javascript: { + get EnableChunkLoadingPlugin() { + return require("./builtin-plugin").EnableChunkLoadingPlugin; + } + }, node: { get NodeTargetPlugin() { return require("./builtin-plugin").NodeTargetPlugin; diff --git a/packages/rspack/src/builtin-plugin/HotModuleReplacementPlugin.ts b/packages/rspack/src/builtin-plugin/HotModuleReplacementPlugin.ts new file mode 100644 index 00000000000..acb9a9738ee --- /dev/null +++ b/packages/rspack/src/builtin-plugin/HotModuleReplacementPlugin.ts @@ -0,0 +1,6 @@ +import { BuiltinPluginName, create } from "./base"; + +export const HotModuleReplacementPlugin = create( + BuiltinPluginName.HotModuleReplacementPlugin, + () => undefined +); diff --git a/packages/rspack/src/builtin-plugin/base.ts b/packages/rspack/src/builtin-plugin/base.ts index f35a52e4db7..24b246f846d 100644 --- a/packages/rspack/src/builtin-plugin/base.ts +++ b/packages/rspack/src/builtin-plugin/base.ts @@ -17,6 +17,7 @@ export enum BuiltinPluginName { CommonJsChunkFormatPlugin = "CommonJsChunkFormatPlugin", ArrayPushCallbackChunkFormatPlugin = "ArrayPushCallbackChunkFormatPlugin", ModuleChunkFormatPlugin = "ModuleChunkFormatPlugin", + HotModuleReplacementPlugin = "HotModuleReplacementPlugin", HttpExternalsRspackPlugin = "HttpExternalsRspackPlugin", CopyRspackPlugin = "CopyRspackPlugin", HtmlRspackPlugin = "HtmlRspackPlugin", diff --git a/packages/rspack/src/builtin-plugin/index.ts b/packages/rspack/src/builtin-plugin/index.ts index 1410836b217..8f76353b351 100644 --- a/packages/rspack/src/builtin-plugin/index.ts +++ b/packages/rspack/src/builtin-plugin/index.ts @@ -15,6 +15,7 @@ export * from "./EnableWasmLoadingPlugin"; export * from "./ArrayPushCallbackChunkFormatPlugin"; export * from "./CommonJsChunkFormatPlugin"; export * from "./ModuleChunkFormatPlugin"; +export * from "./HotModuleReplacementPlugin"; export * from "./HtmlRspackPlugin"; export * from "./CopyRspackPlugin"; diff --git a/packages/rspack/src/index.ts b/packages/rspack/src/index.ts index c79f068792f..4cc90f3238a 100644 --- a/packages/rspack/src/index.ts +++ b/packages/rspack/src/index.ts @@ -33,7 +33,8 @@ export { CopyRspackPlugin, EntryPlugin, ExternalsPlugin, - EnableChunkLoadingPlugin + EnableChunkLoadingPlugin, + HotModuleReplacementPlugin } from "./builtin-plugin"; export type { BannerPluginArgument, diff --git a/packages/rspack/tests/HotTestCases.template.ts b/packages/rspack/tests/HotTestCases.template.ts index d9c038da5d6..bfa897cd8a0 100644 --- a/packages/rspack/tests/HotTestCases.template.ts +++ b/packages/rspack/tests/HotTestCases.template.ts @@ -4,7 +4,12 @@ import vm from "vm"; import rimraf from "rimraf"; import checkArrayExpectation from "./checkArrayExpectation"; import createLazyTestEnv from "./helpers/createLazyTestEnv"; -import { Compiler, rspack, Stats } from "@rspack/core"; +import { + Compiler, + rspack, + Stats, + HotModuleReplacementPlugin +} from "@rspack/core"; export function describeCases(config: { name: string; @@ -460,5 +465,8 @@ function getOptions( ...options.devServer, hot }; + if (hot) { + options.plugins.push(new HotModuleReplacementPlugin()); + } return options; } diff --git a/packages/rspack/tests/__snapshots__/StatsTestCases.test.ts.snap b/packages/rspack/tests/__snapshots__/StatsTestCases.test.ts.snap index f6c1b02346c..6c258256df0 100644 --- a/packages/rspack/tests/__snapshots__/StatsTestCases.test.ts.snap +++ b/packages/rspack/tests/__snapshots__/StatsTestCases.test.ts.snap @@ -621,7 +621,7 @@ exports[`StatsTestCases should print correct stats for hot+production 1`] = ` "hotModuleReplacement": false, }, "name": "bundle.js", - "size": 9105, + "size": 263, "type": "asset", }, ], @@ -684,10 +684,10 @@ exports[`StatsTestCases should print correct stats for hot+production 1`] = ` "assets": [ { "name": "bundle.js", - "size": 9105, + "size": 263, }, ], - "assetsSize": 9105, + "assetsSize": 263, "chunks": [ "main", ], @@ -697,7 +697,7 @@ exports[`StatsTestCases should print correct stats for hot+production 1`] = ` "errors": [], "errorsCount": 0, "filteredModules": undefined, - "hash": "8b17e56c72949ef15048", + "hash": "21aefdba356ad056ea65", "logging": {}, "modules": [ { @@ -734,10 +734,10 @@ exports[`StatsTestCases should print correct stats for hot+production 1`] = ` "assets": [ { "name": "bundle.js", - "size": 9105, + "size": 263, }, ], - "assetsSize": 9105, + "assetsSize": 263, "chunks": [ "main", ], @@ -753,14 +753,14 @@ exports[`StatsTestCases should print correct stats for hot+production 1`] = ` exports[`StatsTestCases should print correct stats for hot+production 2`] = ` "PublicPath: (none) -asset bundle.js 8.89 KiB {main} [emitted] (name: main) -Entrypoint main 8.89 KiB = bundle.js +asset bundle.js 263 bytes {main} [emitted] (name: main) +Entrypoint main 263 bytes = bundle.js chunk {main} bundle.js (main) [entry] ./index.js [10] {main} entry ./index.js ./index.js [10] {main} entry ./index.js -rspack compiled successfully (8b17e56c72949ef15048)" +rspack compiled successfully (21aefdba356ad056ea65)" `; exports[`StatsTestCases should print correct stats for identifier-let-strict-mode 1`] = ` diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index ec8eabc67fd..647adffcf29 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -889,6 +889,7 @@ importers: tailwindcss: ^3.3.0 vue: 3.2.47 vue-loader: ^17.2.2 + webpack-dev-server: 4.13.1 ws: 8.8.1 devDependencies: '@playwright/test': 1.35.0 @@ -902,9 +903,10 @@ importers: postcss-loader: 7.3.3_postcss@8.4.21 react: 18.2.0 react-dom: 18.2.0_react@18.2.0 - tailwindcss: 3.3.1 + tailwindcss: 3.3.1_postcss@8.4.21 vue: 3.2.47 vue-loader: 17.2.2_vue@3.2.47 + webpack-dev-server: 4.13.1 ws: 8.8.1 packages/rspack: @@ -11137,23 +11139,23 @@ packages: resolution: {integrity: sha512-ALYone6pm6QmwZoAgeyNksccT9Q4AWZQ6PvfwR37GT6r6FWUPguq6sUmNGSMV2Wr761oQoBxwGGa6DR5o1DC9g==} dependencies: '@types/connect': 3.4.35 - '@types/node': 18.15.11 + '@types/node': 16.11.7 /@types/bonjour/3.5.10: resolution: {integrity: sha512-p7ienRMiS41Nu2/igbJxxLDWrSZ0WxM8UQgCeO9KhoVF7cOVFkrKsiDr1EsJIla8vV3oEEjGcz11jc5yimhzZw==} dependencies: - '@types/node': 18.15.11 + '@types/node': 16.11.7 /@types/connect-history-api-fallback/1.3.5: resolution: {integrity: sha512-h8QJa8xSb1WD4fpKBDcATDNGXghFj6/3GRWG6dhmRcu0RX1Ubasur2Uvx5aeEwlf0MwblEC2bMzzMQntxnw/Cw==} dependencies: '@types/express-serve-static-core': 4.17.31 - '@types/node': 18.15.11 + '@types/node': 16.11.7 /@types/connect/3.4.35: resolution: {integrity: sha512-cdeYyv4KWoEgpBISTxWvqYsVy444DOqehiF3fM3ne10AmJ62RSyNkUnxMJXHQWRQQX2eR94m5y1IZyDwBjV9FQ==} dependencies: - '@types/node': 18.15.11 + '@types/node': 16.11.7 /@types/cookie/0.4.1: resolution: {integrity: sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q==} @@ -11222,7 +11224,7 @@ packages: /@types/express-serve-static-core/4.17.31: resolution: {integrity: sha512-DxMhY+NAsTwMMFHBTtJFNp5qiHKJ7TeqOo23zVEM9alT1Ml27Q3xcTH0xwxn7Q0BbMcVEJOs/7aQtUWupUQN3Q==} dependencies: - '@types/node': 18.15.11 + '@types/node': 16.11.7 '@types/qs': 6.9.7 '@types/range-parser': 1.2.4 @@ -11291,7 +11293,7 @@ packages: /@types/http-proxy/1.17.9: resolution: {integrity: sha512-QsbSjA/fSk7xB+UXlCT3wHBy5ai9wOcNDWwZAtud+jXhwOM3l+EYZh8Lng4+/6n8uar0J7xILzqftJdJ/Wdfkw==} dependencies: - '@types/node': 18.15.11 + '@types/node': 16.11.7 /@types/interpret/1.1.1: resolution: {integrity: sha512-HZ4d0m2Ebl8DmrOdYZHgYyipj/8Ftq1/ssB/oQR7fqfUrwtTP7IW3BDi2V445nhPBLzZjEkApaPVp83moSCXlA==} @@ -11381,7 +11383,6 @@ packages: /@types/node/16.11.7: resolution: {integrity: sha512-QB5D2sqfSjCmTuWcBWyJ+/44bcjO7VbjSbOE0ucoVbAsSNQc4Lt6QkgkVXkTDwkL4z/beecZNDvVX15D4P8Jbw==} - dev: true /@types/node/18.15.11: resolution: {integrity: sha512-E5Kwq2n4SbMzQOn6wnmBjuK9ouqlURrcZDVfbo9ftDDTFt3nk7ZKK4GMOzoYgnpQJKcxwQw+lGaBvvlMo0qN/Q==} @@ -11499,7 +11500,7 @@ packages: resolution: {integrity: sha512-z5xyF6uh8CbjAu9760KDKsH2FcDxZ2tFCsA4HIMWE6IkiYMXfVoa+4f9KX+FN0ZLsaMw1WNG2ETLA6N+/YA+cg==} dependencies: '@types/mime': 3.0.1 - '@types/node': 18.15.11 + '@types/node': 16.11.7 /@types/sinon/10.0.13: resolution: {integrity: sha512-UVjDqJblVNQYvVNUsj0PuYYw0ELRmgt1Nt5Vk0pT5f16ROGfcKJY8o1HVuMOJOpD727RrGB9EGvoaTQE5tgxZQ==} @@ -11514,7 +11515,7 @@ packages: /@types/sockjs/0.3.33: resolution: {integrity: sha512-f0KEEe05NvUnat+boPTZ0dgaLZ4SfSouXUgv5noUiefG2ajgKjmETo9ZJyuqsl7dfl2aHlLJUiki6B4ZYldiiw==} dependencies: - '@types/node': 18.15.11 + '@types/node': 16.11.7 /@types/source-list-map/0.1.2: resolution: {integrity: sha512-K5K+yml8LTo9bWJI/rECfIPrGgxdpeNbj+d53lwN4QjW1MCwlkhUms+gtdzigTeUyBr09+u8BwOIY3MXvHdcsA==} @@ -11577,7 +11578,7 @@ packages: /@types/ws/8.5.3: resolution: {integrity: sha512-6YOoWjruKj1uLf3INHH7D3qTXwFfEsg1kf3c0uDdSBJwfa/llkwIjrAGV7j7mVgGNbzTQ3HiHKKDXl6bJPD97w==} dependencies: - '@types/node': 18.15.11 + '@types/node': 16.11.7 /@types/yargs-parser/21.0.0: resolution: {integrity: sha512-iO9ZQHkZxHn4mSakYV0vFHAVDyEOIJQrV2uZ06HxEPcx+mt8swXoZHIbaaJ2crJYFfErySgktuTZ3BeLz+XmFA==} @@ -16348,7 +16349,7 @@ packages: array-flatten: 1.1.1 body-parser: 1.20.1 content-disposition: 0.5.4 - content-type: 1.0.4 + content-type: 1.0.5 cookie: 0.5.0 cookie-signature: 1.0.6 debug: 2.6.9 @@ -21664,6 +21665,7 @@ packages: define-lazy-prop: 2.0.0 is-docker: 2.2.1 is-wsl: 2.2.0 + dev: false /open/8.4.2: resolution: {integrity: sha512-7x81NCL719oNbsq/3mh+hVrAWmFuEYUqrq/Iw3kUzH8ReypT9QQ0BLoJS7/G9k6N81XjW4qHWtjWwe/9eLy1EQ==} @@ -22371,6 +22373,18 @@ packages: splaytree: 3.1.1 dev: false + /postcss-import/14.1.0_postcss@8.4.21: + resolution: {integrity: sha512-flwI+Vgm4SElObFVPpTIT7SU7R3qk2L7PyduMcokiaVKuWv9d/U+Gm/QAd8NDLuykTWTkcrjOeD2Pp1rMeBTGw==} + engines: {node: '>=10.0.0'} + peerDependencies: + postcss: ^8.0.0 + dependencies: + postcss: 8.4.21 + postcss-value-parser: 4.2.0 + read-cache: 1.0.0 + resolve: 1.22.2 + dev: true + /postcss-import/14.1.0_postcss@8.4.23: resolution: {integrity: sha512-flwI+Vgm4SElObFVPpTIT7SU7R3qk2L7PyduMcokiaVKuWv9d/U+Gm/QAd8NDLuykTWTkcrjOeD2Pp1rMeBTGw==} engines: {node: '>=10.0.0'} @@ -22383,6 +22397,16 @@ packages: resolve: 1.22.2 dev: true + /postcss-js/4.0.1_postcss@8.4.21: + resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==} + engines: {node: ^12 || ^14 || >= 16} + peerDependencies: + postcss: ^8.4.21 + dependencies: + camelcase-css: 2.0.1 + postcss: 8.4.21 + dev: true + /postcss-js/4.0.1_postcss@8.4.23: resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==} engines: {node: ^12 || ^14 || >= 16} @@ -22393,6 +22417,23 @@ packages: postcss: 8.4.23 dev: true + /postcss-load-config/3.1.4_postcss@8.4.21: + resolution: {integrity: sha512-6DiM4E7v4coTE4uzA8U//WhtPwyhiim3eyjEMFCnUpzbrkK9wJHgKDT2mR+HbtSrd/NubVaYTOpSpjUl8NQeRg==} + engines: {node: '>= 10'} + peerDependencies: + postcss: '>=8.0.9' + ts-node: '>=9.0.0' + peerDependenciesMeta: + postcss: + optional: true + ts-node: + optional: true + dependencies: + lilconfig: 2.1.0 + postcss: 8.4.21 + yaml: 1.10.2 + dev: true + /postcss-load-config/3.1.4_postcss@8.4.23: resolution: {integrity: sha512-6DiM4E7v4coTE4uzA8U//WhtPwyhiim3eyjEMFCnUpzbrkK9wJHgKDT2mR+HbtSrd/NubVaYTOpSpjUl8NQeRg==} engines: {node: '>= 10'} @@ -22593,6 +22634,16 @@ packages: postcss: 8.4.23 dev: true + /postcss-nested/6.0.0_postcss@8.4.21: + resolution: {integrity: sha512-0DkamqrPcmkBDsLn+vQDIrtkSbNkv5AD/M322ySo9kqFkCIYklym2xEmWkwo+Y3/qZo34tzEPNUw4y7yMCdv5w==} + engines: {node: '>=12.0'} + peerDependencies: + postcss: ^8.2.14 + dependencies: + postcss: 8.4.21 + postcss-selector-parser: 6.0.11 + dev: true + /postcss-nested/6.0.0_postcss@8.4.23: resolution: {integrity: sha512-0DkamqrPcmkBDsLn+vQDIrtkSbNkv5AD/M322ySo9kqFkCIYklym2xEmWkwo+Y3/qZo34tzEPNUw4y7yMCdv5w==} engines: {node: '>=12.0'} @@ -26052,6 +26103,41 @@ packages: - ts-node dev: true + /tailwindcss/3.3.1_postcss@8.4.21: + resolution: {integrity: sha512-Vkiouc41d4CEq0ujXl6oiGFQ7bA3WEhUZdTgXAhtKxSy49OmKs8rEfQmupsfF0IGW8fv2iQkp1EVUuapCFrZ9g==} + engines: {node: '>=12.13.0'} + hasBin: true + peerDependencies: + postcss: ^8.0.9 + dependencies: + arg: 5.0.2 + chokidar: 3.5.3 + color-name: 1.1.4 + didyoumean: 1.2.2 + dlv: 1.1.3 + fast-glob: 3.2.12 + glob-parent: 6.0.2 + is-glob: 4.0.3 + jiti: 1.18.2 + lilconfig: 2.1.0 + micromatch: 4.0.5 + normalize-path: 3.0.0 + object-hash: 3.0.0 + picocolors: 1.0.0 + postcss: 8.4.21 + postcss-import: 14.1.0_postcss@8.4.21 + postcss-js: 4.0.1_postcss@8.4.21 + postcss-load-config: 3.1.4_postcss@8.4.21 + postcss-nested: 6.0.0_postcss@8.4.21 + postcss-selector-parser: 6.0.11 + postcss-value-parser: 4.2.0 + quick-lru: 5.1.1 + resolve: 1.22.1 + sucrase: 3.31.0 + transitivePeerDependencies: + - ts-node + dev: true + /tapable/2.2.1: resolution: {integrity: sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==} engines: {node: '>=6'} @@ -27795,15 +27881,15 @@ packages: connect-history-api-fallback: 2.0.0 default-gateway: 6.0.3 express: 4.18.2 - graceful-fs: 4.2.10 + graceful-fs: 4.2.11 html-entities: 2.3.3 http-proxy-middleware: 2.0.6_@types+express@4.17.14 ipaddr.js: 2.0.1 launch-editor: 2.6.0 - open: 8.4.0 + open: 8.4.2 p-retry: 4.6.2 rimraf: 3.0.2 - schema-utils: 4.0.0 + schema-utils: 4.0.1 selfsigned: 2.1.1 serve-index: 1.9.1 sockjs: 0.3.24 @@ -27866,6 +27952,7 @@ packages: - debug - supports-color - utf-8-validate + dev: false /webpack-dev-server/4.13.2_webpack@5.80.0: resolution: {integrity: sha512-5i6TrGBRxG4vnfDpB6qSQGfnB6skGBXNL5/542w2uRGLimX6qeE5BQMLrzIC3JYV/xlGOv+s+hTleI9AZKUQNw==} From cbec4b8452ed12a9d034ca82614f04f9184dd713 Mon Sep 17 00:00:00 2001 From: ahabhgk Date: Fri, 15 Sep 2023 20:02:22 +0800 Subject: [PATCH 2/2] fix --- packages/rspack-dev-server/src/server.ts | 5 +---- packages/rspack/src/rspackOptionsApply.ts | 4 ++++ .../__snapshots__/StatsTestCases.test.ts.snap | 18 +++++++++--------- 3 files changed, 14 insertions(+), 13 deletions(-) diff --git a/packages/rspack-dev-server/src/server.ts b/packages/rspack-dev-server/src/server.ts index f197bde635f..3177cf06beb 100644 --- a/packages/rspack-dev-server/src/server.ts +++ b/packages/rspack-dev-server/src/server.ts @@ -155,10 +155,7 @@ export class RspackDevServer extends WebpackDevServer { ); } compiler.options.devServer ??= {}; - compiler.options.devServer.hot ??= true; - if (compiler.options.devServer.hot) { - new compiler.webpack.HotModuleReplacementPlugin().apply(compiler); - } + compiler.options.devServer.hot = true; compiler.options.builtins.react ??= {}; compiler.options.builtins.react.refresh ??= true; compiler.options.builtins.react.development ??= true; diff --git a/packages/rspack/src/rspackOptionsApply.ts b/packages/rspack/src/rspackOptionsApply.ts index 4ef8af8027e..2d3b9ba5d45 100644 --- a/packages/rspack/src/rspackOptionsApply.ts +++ b/packages/rspack/src/rspackOptionsApply.ts @@ -135,6 +135,10 @@ export function optionsApply_compat( compiler.context, options.entry ); + + if (options.devServer?.hot) { + new compiler.webpack.HotModuleReplacementPlugin().apply(compiler); + } } } diff --git a/packages/rspack/tests/__snapshots__/StatsTestCases.test.ts.snap b/packages/rspack/tests/__snapshots__/StatsTestCases.test.ts.snap index 6c258256df0..f6c1b02346c 100644 --- a/packages/rspack/tests/__snapshots__/StatsTestCases.test.ts.snap +++ b/packages/rspack/tests/__snapshots__/StatsTestCases.test.ts.snap @@ -621,7 +621,7 @@ exports[`StatsTestCases should print correct stats for hot+production 1`] = ` "hotModuleReplacement": false, }, "name": "bundle.js", - "size": 263, + "size": 9105, "type": "asset", }, ], @@ -684,10 +684,10 @@ exports[`StatsTestCases should print correct stats for hot+production 1`] = ` "assets": [ { "name": "bundle.js", - "size": 263, + "size": 9105, }, ], - "assetsSize": 263, + "assetsSize": 9105, "chunks": [ "main", ], @@ -697,7 +697,7 @@ exports[`StatsTestCases should print correct stats for hot+production 1`] = ` "errors": [], "errorsCount": 0, "filteredModules": undefined, - "hash": "21aefdba356ad056ea65", + "hash": "8b17e56c72949ef15048", "logging": {}, "modules": [ { @@ -734,10 +734,10 @@ exports[`StatsTestCases should print correct stats for hot+production 1`] = ` "assets": [ { "name": "bundle.js", - "size": 263, + "size": 9105, }, ], - "assetsSize": 263, + "assetsSize": 9105, "chunks": [ "main", ], @@ -753,14 +753,14 @@ exports[`StatsTestCases should print correct stats for hot+production 1`] = ` exports[`StatsTestCases should print correct stats for hot+production 2`] = ` "PublicPath: (none) -asset bundle.js 263 bytes {main} [emitted] (name: main) -Entrypoint main 263 bytes = bundle.js +asset bundle.js 8.89 KiB {main} [emitted] (name: main) +Entrypoint main 8.89 KiB = bundle.js chunk {main} bundle.js (main) [entry] ./index.js [10] {main} entry ./index.js ./index.js [10] {main} entry ./index.js -rspack compiled successfully (21aefdba356ad056ea65)" +rspack compiled successfully (8b17e56c72949ef15048)" `; exports[`StatsTestCases should print correct stats for identifier-let-strict-mode 1`] = `