Skip to content

Commit

Permalink
feat(css): support asset in bundle
Browse files Browse the repository at this point in the history
  • Loading branch information
SoonIter committed Dec 18, 2024
1 parent 2540150 commit 00c9732
Show file tree
Hide file tree
Showing 6 changed files with 42 additions and 1 deletion.
7 changes: 7 additions & 0 deletions examples/react-component-bundle/src/assets/logo.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions examples/react-component-bundle/src/index.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
.counter-text {
font-size: 50px;
}

.title {
background: url('./assets/logo.svg');
}
1 change: 1 addition & 0 deletions examples/react-component-bundle/src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ export const Counter: React.FC = () => {

return (
<div>
<h1 className='title'></h1>
<h2 className="counter-text">Counter: {count}</h2>
<CounterButton onClick={decrement} label="-" />
<CounterButton onClick={increment} label="+" />
Expand Down
25 changes: 25 additions & 0 deletions packages/core/src/asset/assetConfig.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import { RsbuildConfig } from "@rsbuild/core";
import { Format } from "../types";

export const composeAssetConfig = (
bundle: boolean,
format: Format
): RsbuildConfig => {
if(format === 'esm' || format === 'cjs') {
if(bundle) {
return {
output: {
// default: no inline asset
dataUriLimit: 0,
assetPrefix: 'auto' // we currently not support import asset in js because of 'auto' publicPath runtime
},
}
} else {
// TODO: bundleless
return {}
}
}

// mf and umd etc
return {}
};
4 changes: 4 additions & 0 deletions packages/core/src/config.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import fs from 'node:fs';
import path, { dirname, extname, isAbsolute, join } from 'node:path';
import { composeAssetConfig } from './asset/assetConfig'
import {
type EnvironmentConfig,
type RsbuildConfig,
Expand Down Expand Up @@ -1221,6 +1222,8 @@ async function composeLibRsbuildConfig(
cssModulesAuto,
);
const cssConfig = composeCssConfig(lcp, config.bundle);
const assetConfig = composeAssetConfig(bundle, format!);

const entryChunkConfig = composeEntryChunkConfig({
enabledImportMetaUrlShim: enabledShims.cjs['import.meta.url'],
});
Expand Down Expand Up @@ -1251,6 +1254,7 @@ async function composeLibRsbuildConfig(
targetConfig,
entryConfig,
cssConfig,
assetConfig,
entryChunkConfig,
minifyConfig,
dtsConfig,
Expand Down
2 changes: 1 addition & 1 deletion packages/core/src/css/cssConfig.ts
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,7 @@ export const composeCssConfig = (
bundle = true,
): RsbuildConfig => {
if (bundle || rootDir === null) {
return {};
return {}
}

return {
Expand Down

0 comments on commit 00c9732

Please sign in to comment.