feat: support import.meta.hot hmr alias

Author: intellild

crates/rspack_plugin_javascript/src/parser_plugin/hot_module_replacement_plugin.rs

@@ -1,7 +1,7 @@
-use rspack_core::{BoxDependency, DependencyRange};
+use rspack_core::{BoxDependency, ConstDependency, DependencyRange};
 use rspack_util::SpanExt;
 use swc_atoms::Atom;
-use swc_experimental_ecma_ast::{CallExpr, GetSpan, MemberExpr, Span};
+use swc_experimental_ecma_ast::{CallExpr, GetSpan, MemberExpr, Span, UnaryExpr};
 
 use crate::{
   dependency::{
@@ -16,6 +16,37 @@ use crate::{
 
 type CreateDependency = fn(Atom, DependencyRange) -> BoxDependency;
 
+fn is_import_meta_hot(for_name: &str) -> bool {
+  matches!(
+    for_name,
+    expr_name::IMPORT_META_HOT | expr_name::IMPORT_META_HOT_ALIAS
+  )
+}
+
+fn is_import_meta_hot_accept(for_name: &str) -> bool {
+  matches!(
+    for_name,
+    expr_name::IMPORT_META_HOT_ACCEPT | expr_name::IMPORT_META_HOT_ALIAS_ACCEPT
+  )
+}
+
+fn is_import_meta_hot_decline(for_name: &str) -> bool {
+  matches!(
+    for_name,
+    expr_name::IMPORT_META_HOT_DECLINE | expr_name::IMPORT_META_HOT_ALIAS_DECLINE
+  )
+}
+
+fn evaluate_typeof_import_meta_hot(for_name: &str) -> Option<&'static str> {
+  if is_import_meta_hot(for_name) {
+    Some("object")
+  } else if is_import_meta_hot_accept(for_name) || is_import_meta_hot_decline(for_name) {
+    Some("function")
+  } else {
+    None
+  }
+}
+
 fn extract_deps(
   parser: &mut JavascriptParser,
   call_expr: &CallExpr,
@@ -203,6 +234,17 @@ impl ImportMetaHotReplacementParserPlugin {
 
 #[rspack_macros::implemented_javascript_parser_hooks]
 impl<'p, 'a> JavascriptParserPlugin<'p, 'a> for ImportMetaHotReplacementParserPlugin {
+  fn evaluate_typeof(
+    &self,
+    _parser: &mut JavascriptParser<'p>,
+    expr: &'a UnaryExpr<'a>,
+    for_name: &str,
+  ) -> Option<crate::utils::eval::BasicEvaluatedExpression<'a>> {
+    evaluate_typeof_import_meta_hot(for_name).map(|res| {
+      eval::evaluate_to_string(res.to_string(), expr.span.real_lo(), expr.span.real_hi())
+    })
+  }
+
   fn evaluate_identifier(
     &self,
     _parser: &mut JavascriptParser<'p>,
@@ -211,9 +253,9 @@ impl<'p, 'a> JavascriptParserPlugin<'p, 'a> for ImportMetaHotReplacementParserPl
     start: u32,
     end: u32,
   ) -> Option<crate::utils::eval::BasicEvaluatedExpression<'p>> {
-    if for_name == expr_name::IMPORT_META_HOT {
+    if is_import_meta_hot(for_name) {
       Some(eval::evaluate_to_identifier(
-        expr_name::IMPORT_META_HOT.into(),
+        for_name.into(),
         expr_name::IMPORT_META.into(),
         Some(true),
         start,
@@ -230,7 +272,7 @@ impl<'p, 'a> JavascriptParserPlugin<'p, 'a> for ImportMetaHotReplacementParserPl
     expr: &MemberExpr,
     for_name: &str,
   ) -> Option<bool> {
-    if for_name == expr_name::IMPORT_META_HOT {
+    if is_import_meta_hot(for_name) {
       parser.create_hmr_expression_handler(expr.span());
       Some(true)
     } else {
@@ -244,16 +286,31 @@ impl<'p, 'a> JavascriptParserPlugin<'p, 'a> for ImportMetaHotReplacementParserPl
     call_expr: &CallExpr,
     for_name: &str,
   ) -> Option<bool> {
-    if for_name == expr_name::IMPORT_META_HOT_ACCEPT {
+    if is_import_meta_hot_accept(for_name) {
       parser.create_accept_handler(call_expr, |request, range| {
         Box::new(ImportMetaHotAcceptDependency::new(request, range))
       })
-    } else if for_name == expr_name::IMPORT_META_HOT_DECLINE {
+    } else if is_import_meta_hot_decline(for_name) {
       parser.create_decline_handler(call_expr, |request, range| {
         Box::new(ImportMetaHotDeclineDependency::new(request, range))
       })
     } else {
       None
     }
   }
+
+  fn r#typeof(
+    &self,
+    parser: &mut JavascriptParser<'p>,
+    expr: &UnaryExpr,
+    for_name: &str,
+  ) -> Option<bool> {
+    evaluate_typeof_import_meta_hot(for_name).map(|res| {
+      parser.add_presentational_dependency(Box::new(ConstDependency::new(
+        expr.span.into(),
+        format!("'{res}'").into(),
+      )));
+      true
+    })
+  }
 }

crates/rspack_plugin_javascript/src/visitors/dependency/util.rs

@@ -31,6 +31,9 @@ pub mod expr_name {
   pub const IMPORT_META_HOT: &str = "import.meta.webpackHot";
   pub const IMPORT_META_HOT_ACCEPT: &str = "import.meta.webpackHot.accept";
   pub const IMPORT_META_HOT_DECLINE: &str = "import.meta.webpackHot.decline";
+  pub const IMPORT_META_HOT_ALIAS: &str = "import.meta.hot";
+  pub const IMPORT_META_HOT_ALIAS_ACCEPT: &str = "import.meta.hot.accept";
+  pub const IMPORT_META_HOT_ALIAS_DECLINE: &str = "import.meta.hot.decline";
   pub const IMPORT_META_CONTEXT: &str = "import.meta.webpackContext";
   pub const IMPORT_META_GLOB: &str = "import.meta.glob";
 }

packages/rspack/module.d.ts

@@ -229,6 +229,7 @@ declare namespace Rspack {
 
 interface ImportMeta {
   url: string;
+  hot?: Rspack.Hot;
   webpackHot?: Rspack.Hot;
   webpackContext: (
     request: string,

tests/rspack-test/configCases/parsing/import-meta-hot-prod/index.js

@@ -1,9 +1,17 @@
-it('should transform import.meta.webpackHot to false', () => {
+it("should transform import.meta.webpackHot and import.meta.hot to false", () => {
 	let hot = false;
 	if (import.meta.webpackHot) {
 		hot = true;
-    import.meta.webpackHot.accept();
-  }
+		import.meta.webpackHot.accept();
+	}
 
 	expect(hot).toBe(false);
-})
+
+	let hotAlias = false;
+	if (import.meta.hot) {
+		hotAlias = true;
+		import.meta.hot.accept();
+	}
+
+	expect(hotAlias).toBe(false);
+});

tests/rspack-test/configCases/parsing/import-meta-hot/dep.js

@@ -0,0 +1 @@
+export default "import.meta.hot";

tests/rspack-test/configCases/parsing/import-meta-hot/index.js

@@ -0,0 +1,18 @@
+import value from "./dep";
+
+let typeofGuardMatched = false;
+
+if (typeof import.meta.hot !== "undefined") {
+	typeofGuardMatched = true;
+}
+
+if (import.meta.hot) {
+	import.meta.hot.accept(["./dep"], () => {});
+}
+
+it("should support import.meta.hot as an HMR alias", () => {
+	expect(value).toBe("import.meta.hot");
+	expect(typeofGuardMatched).toBe(true);
+	expect(typeof import.meta.hot).toBe("object");
+	expect(typeof import.meta.hot.accept).toBe("function");
+});

tests/rspack-test/configCases/parsing/import-meta-hot/rspack.config.js

@@ -0,0 +1,7 @@
+const { HotModuleReplacementPlugin } = require('@rspack/core');
+
+/** @type {import("@rspack/core").Configuration} */
+module.exports = {
+  devtool: false,
+  plugins: [new HotModuleReplacementPlugin()],
+};

website/docs/en/api/runtime-api/hmr.mdx

@@ -10,9 +10,9 @@ import WebpackLicense from '@components/WebpackLicense';
 
 Rspack provides the same interface as webpack for implementing HMR.
 
-If you've enabled Hot Module Replacement via the [HotModuleReplacementPlugin](/plugins/webpack/hot-module-replacement-plugin), its interface is exposed on the `module.hot` and `import.meta.webpackHot` objects.
+If you've enabled Hot Module Replacement via the [HotModuleReplacementPlugin](/plugins/webpack/hot-module-replacement-plugin), its interface is exposed on the `module.hot`, `import.meta.webpackHot`, and `import.meta.hot` objects.
 
-In ESM, use `import.meta.webpackHot` instead of `module.hot`.
+In ESM, use `import.meta.webpackHot` or `import.meta.hot` instead of `module.hot`.
 
 ## Example
 
@@ -33,7 +33,7 @@ if (import.meta.webpackHot) {
 }
 ```
 
-The following methods are supported by `module.hot` and `import.meta.webpackHot`.
+The following methods are supported by `module.hot`, `import.meta.webpackHot`, and `import.meta.hot`.
 
 ## Module API
 

website/docs/zh/api/runtime-api/hmr.mdx

@@ -10,9 +10,9 @@ import WebpackLicense from '@components/WebpackLicense';
 
 Rspack 提供了与 webpack 相同的接口来实现模块热替换。
 
-如果你通过 [HotModuleReplacementPlugin](/plugins/webpack/hot-module-replacement-plugin) 启用了模块热替换，它的接口将暴露在 `module.hot` 和 `import.meta.webpackHot` 对象下。
+如果你通过 [HotModuleReplacementPlugin](/plugins/webpack/hot-module-replacement-plugin) 启用了模块热替换，它的接口将暴露在 `module.hot`、`import.meta.webpackHot` 和 `import.meta.hot` 对象下。
 
-注意，在 ESM 中请使用 `import.meta.webpackHot` 来代替 `module.hot`。
+注意，在 ESM 中请使用 `import.meta.webpackHot` 或 `import.meta.hot` 来代替 `module.hot`。
 
 ## 示例
 
@@ -33,7 +33,7 @@ if (import.meta.webpackHot) {
 }
 ```
 
-`module.hot` 和 `import.meta.webpackHot` 支持以下方法。
+`module.hot`、`import.meta.webpackHot` 和 `import.meta.hot` 支持以下方法。
 
 ## 模块 API