fix: should not inject runtime when enableRuntime is false (#4)

src/index.ts

@@ -88,6 +88,10 @@ export const pluginRem = (
         { headTags, bodyTags },
         { environment, filename, assetPrefix },
       ) => {
+        if (!options.enableRuntime) {
+          return { headTags, bodyTags };
+        }
+
         const entries = Object.keys(environment.entry);
         const { config } = environment;
 

test/disable-runtime/index.test.ts

@@ -0,0 +1,39 @@
+import { existsSync, readFileSync } from 'node:fs';
+import { dirname, join } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { expect, test } from '@playwright/test';
+import { createRsbuild } from '@rsbuild/core';
+import { pluginReact } from '@rsbuild/plugin-react';
+import { pluginRem } from '../../dist';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+
+test('should not generate runtime code when enableRuntime is false', async () => {
+  const rsbuild = await createRsbuild({
+    cwd: __dirname,
+    rsbuildConfig: {
+      plugins: [
+        pluginRem({
+          enableRuntime: false,
+        }),
+        pluginReact(),
+      ],
+    },
+  });
+
+  await rsbuild.build();
+
+  const htmlFile = join(rsbuild.context.distPath, 'index.html');
+  const htmlContent = readFileSync(htmlFile, 'utf-8');
+
+  const { version } = JSON.parse(
+    readFileSync(join(__dirname, '../../package.json'), 'utf-8'),
+  );
+  const remFile = join(
+    rsbuild.context.distPath,
+    `static/js/convert-rem.${version}.js`,
+  );
+
+  expect(existsSync(remFile)).toBeFalsy();
+  expect(htmlContent.includes('function setRootPixel')).toBeFalsy();
+});

test/disable-runtime/rsbuild.config.ts

@@ -0,0 +1,6 @@
+import { pluginLess } from '@rsbuild/plugin-less';
+import { pluginSass } from '@rsbuild/plugin-sass';
+
+export default {
+  plugins: [pluginLess(), pluginSass()],
+};

test/disable-runtime/src/App.css

@@ -0,0 +1,27 @@
+html,
+body {
+  padding: 0;
+  margin: 0;
+  font-family:
+    nunito_for_arco,
+    Helvetica Neue,
+    Helvetica,
+    PingFang SC,
+    Hiragino Sans GB,
+    Microsoft YaHei,
+    微软雅黑,
+    Arial,
+    sans-serif;
+}
+
+* {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  box-sizing: border-box;
+}
+
+.description {
+  text-align: center;
+  line-height: 1.5;
+  font-size: 16px;
+}

test/disable-runtime/src/App.jsx

@@ -0,0 +1,18 @@
+import './App.css';
+import styles from './App.module.css';
+
+const App = () => (
+  <div className="container">
+    <p className={styles.header} id="header">
+      header
+    </p>
+    <p className={styles.title} id="title">
+      title
+    </p>
+    <p className="description" id="description">
+      description
+    </p>
+  </div>
+);
+
+export default App;

test/disable-runtime/src/App.module.css

@@ -0,0 +1,11 @@
+.title {
+  text-align: center;
+  color: blue;
+  font-size: 20px;
+}
+
+.header {
+  text-align: center;
+  color: red;
+  font-size: 20px;
+}

test/disable-runtime/src/index.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+import App from './App';
+
+const container = document.getElementById('root');
+if (container) {
+  const root = createRoot(container);
+  root.render(React.createElement(App));
+}