feat: support asset module (#684)

Author: SoonIter

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

@@ -3,11 +3,6 @@ import { pluginSass } from '@rsbuild/plugin-sass';
 import { defineConfig } from '@rslib/core';
 
 export default defineConfig({
-  source: {
-    entry: {
-      index: ['./src/**'],
-    },
-  },
   lib: [
     {
       bundle: false,

tests/integration/asset/limit/assets/logo.svg renamed to examples/preact-component-bundle-false/src/assets/logo.svg

@@ -1,4 +1,5 @@
 import type { FunctionComponent } from 'preact';
+import logo from '../../assets/logo.svg';
 import styles from './index.module.scss';
 
 interface CounterButtonProps {
@@ -10,7 +11,12 @@ export const CounterButton: FunctionComponent<CounterButtonProps> = ({
   onClick,
   label,
 }) => (
-  <button type="button" className={styles.button} onClick={onClick}>
+  <button
+    type="button"
+    className={`${styles.button} counter-button`}
+    onClick={onClick}
+  >
+    <img src={logo} alt="react" />
     {label}
   </button>
 );

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

@@ -2,3 +2,8 @@ declare module '*.module.scss' {
   const classes: { [key: string]: string };
   export default classes;
 }
+
+declare module '*.svg' {
+  const url: string;
+  export default url;
+}

examples/preact-component-bundle-false/src/env.d.ts

@@ -1,3 +1,10 @@
+.counter-title {
+  width: 100px;
+  height: 100px;
+  background: no-repeat url('./assets/logo.svg');
+  background-size: cover;
+}
+
 .counter-text {
   font-size: 50px;
 }

examples/preact-component-bundle-false/src/index.scss

@@ -3,11 +3,6 @@ import { pluginSass } from '@rsbuild/plugin-sass';
 import { defineConfig } from '@rslib/core';
 
 export default defineConfig({
-  source: {
-    entry: {
-      index: ['./src/**'],
-    },
-  },
   lib: [
     {
       format: 'esm',
@@ -32,7 +27,6 @@ export default defineConfig({
   ],
   output: {
     target: 'web',
-    assetPrefix: 'auto', // TODO: move this line to packages/core/src/asset/assetConfig.ts,
   },
   plugins: [pluginReact(), pluginSass()],
 });

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

@@ -1,4 +1,5 @@
 import type React from 'react';
+import logo from '../../assets/logo.svg';
 import styles from './index.module.scss';
 
 interface CounterButtonProps {
@@ -10,7 +11,12 @@ export const CounterButton: React.FC<CounterButtonProps> = ({
   onClick,
   label,
 }) => (
-  <button type="button" className={styles.button} onClick={onClick}>
+  <button
+    type="button"
+    className={`${styles.button} counter-button`}
+    onClick={onClick}
+  >
+    <img src={logo} alt="react" />
     {label}
   </button>
 );

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

@@ -2,3 +2,8 @@ declare module '*.module.scss' {
   const classes: { [key: string]: string };
   export default classes;
 }
+
+declare module '*.svg' {
+  const url: string;
+  export default url;
+}

examples/react-component-bundle-false/src/env.d.ts

@@ -25,7 +25,6 @@ export default defineConfig({
   ],
   output: {
     target: 'web',
-    assetPrefix: 'auto', // TODO: move this line to packages/core/src/asset/assetConfig.ts
   },
   plugins: [pluginReact(), pluginSass()],
 });

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

@@ -1,4 +1,5 @@
 import type React from 'react';
+import logo from '../../assets/logo.svg';
 import styles from './index.module.scss';
 
 interface CounterButtonProps {
@@ -10,7 +11,12 @@ export const CounterButton: React.FC<CounterButtonProps> = ({
   onClick,
   label,
 }) => (
-  <button type="button" className={styles.button} onClick={onClick}>
+  <button
+    type="button"
+    className={`${styles.button} counter-button`}
+    onClick={onClick}
+  >
+    <img src={logo} alt="react" />
     {label}
   </button>
 );