feat: support "umd" format (#299)

Co-authored-by: Timeless0911 <[email protected]>

Author: fi3ework

biome.json

@@ -27,7 +27,8 @@
   "javascript": {
     "formatter": {
       "quoteStyle": "single"
-    }
+    },
+    "jsxRuntime": "reactClassic"
   },
   "json": {
     "formatter": {

examples/react-component-bundle-false/rslib.config.ts

@@ -35,5 +35,12 @@ export default defineConfig({
       },
     },
   ],
-  plugins: [pluginReact(), pluginSass()],
+  plugins: [
+    pluginReact({
+      swcReactOptions: {
+        runtime: 'classic',
+      },
+    }),
+    pluginSass(),
+  ],
 });

examples/react-component-bundle-false/src/components/CounterButton/index.tsx

@@ -1,4 +1,6 @@
+import React from 'react';
 import styles from './index.module.scss';
+
 interface CounterButtonProps {
   onClick: () => void;
   label: string;

examples/react-component-bundle-false/src/index.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import { CounterButton } from './components/CounterButton/index';
 import { useCounter } from './useCounter';
 import './index.scss';

examples/react-component-bundle-false/tsconfig.json

@@ -7,7 +7,7 @@
     "esModuleInterop": true,
     "forceConsistentCasingInFileNames": true,
     "isolatedModules": true,
-    "jsx": "react-jsx",
+    "jsx": "react",
     "lib": ["DOM", "ESNext"],
     "moduleResolution": "node",
     "resolveJsonModule": true,

examples/react-component-bundle/rslib.config.ts

@@ -33,5 +33,12 @@ export default defineConfig({
       },
     },
   ],
-  plugins: [pluginReact(), pluginSass()],
+  plugins: [
+    pluginReact({
+      swcReactOptions: {
+        runtime: 'classic',
+      },
+    }),
+    pluginSass(),
+  ],
 });

examples/react-component-bundle/src/components/CounterButton/index.tsx

@@ -1,4 +1,6 @@
+import React from 'react';
 import styles from './index.module.scss';
+
 interface CounterButtonProps {
   onClick: () => void;
   label: string;

examples/react-component-bundle/src/index.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import { CounterButton } from './components/CounterButton/index';
 import { useCounter } from './useCounter';
 import './index.scss';

examples/react-component-bundle/tsconfig.json

@@ -7,7 +7,7 @@
     "esModuleInterop": true,
     "forceConsistentCasingInFileNames": true,
     "isolatedModules": true,
-    "jsx": "react-jsx",
+    "jsx": "react",
     "lib": ["DOM", "ESNext"],
     "moduleResolution": "node",
     "resolveJsonModule": true,

examples/react-component-umd/README.md

@@ -0,0 +1,3 @@
+# @examples/react-component-umd
+
+This example demonstrates how to use Rslib to build a simple React component with umd format output.