paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 37 Packages Projects Releases Wiki Activity

cli: refactor rspack conditionals

Browse Source 
Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
This commit is contained in:
Patrik Oldsberg
2024-10-11 01:11:08 +02:00
parent 7357f79670
commit e4125fb698
8 changed files with 44 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/cli/src/commands/build/buildFrontend.ts
+3 -3
View File
@@ -25,11 +25,11 @@ interface BuildAppOptions {
writeStats: boolean;
configPaths: string[];
isModuleFederationRemote?: true;
useRspack?: boolean;
rspack?: typeof import('@rspack/core').rspack;
}
export async function buildFrontend(options: BuildAppOptions) {
const { targetDir, writeStats, configPaths, useRspack } = options;
const { targetDir, writeStats, configPaths, rspack } = options;
const { name } = await fs.readJson(resolvePath(targetDir, 'package.json'));
await buildBundle({
@@ -45,6 +45,6 @@ export async function buildFrontend(options: BuildAppOptions) {
args: configPaths,
fromPackage: name,
})),
useRspack,
rspack,
});
}
packages/cli/src/commands/build/command.ts
+5 -3
View File
@@ -25,7 +25,9 @@ import { isValidUrl } from '../../lib/urls';
import chalk from 'chalk';
export async function command(opts: OptionValues): Promise<void> {
const useRspack = !!process.env.EXPERIMENTAL_RSPACK;
const rspack = process.env.EXPERIMENTAL_RSPACK
? (require('@rspack/core') as typeof import('@rspack/core').rspack)
: undefined;
const role = await findRoleFromCommand(opts);
@@ -42,7 +44,7 @@ export async function command(opts: OptionValues): Promise<void> {
targetDir: paths.targetDir,
configPaths,
writeStats: Boolean(opts.stats),
useRspack,
rspack,
});
}
return buildBackend({
@@ -65,7 +67,7 @@ export async function command(opts: OptionValues): Promise<void> {
configPaths: [],
writeStats: Boolean(opts.stats),
isModuleFederationRemote: true,
useRspack,
rspack,
});
}
packages/cli/src/lib/bundler/bundle.ts
+4 -4
View File
@@ -38,7 +38,7 @@ function applyContextToError(error: string, moduleName: string): string {
}
export async function buildBundle(options: BuildOptions) {
const { statsJsonEnabled, schema: configSchema, useRspack } = options;
const { statsJsonEnabled, schema: configSchema, rspack } = options;
const paths = resolveBundlingPaths(options);
const publicPaths = await resolveOptionalBundlingPaths({
@@ -119,7 +119,7 @@ export async function buildBundle(options: BuildOptions) {
);
}
const { stats } = await build(configs, isCi, useRspack);
const { stats } = await build(configs, isCi, rspack);
if (!stats) {
throw new Error('No stats returned');
@@ -155,9 +155,9 @@ export async function buildBundle(options: BuildOptions) {
async function build(
configs: webpack.Configuration[],
isCi: boolean,
useRspack?: boolean,
rspack?: typeof import('@rspack/core').rspack,
) {
const bundler: typeof webpack = useRspack ? require('@rspack/core') : webpack;
const bundler = (rspack ?? webpack) as typeof webpack;
const stats = await new Promise<webpack.MultiStats | undefined>(
(resolve, reject) => {
packages/cli/src/lib/bundler/config.ts
+11 -15
View File
@@ -132,7 +132,7 @@ export async function createConfig(
frontendConfig,
moduleFederation,
publicSubPath = '',
useRspack,
rspack,
} = options;
const { plugins, loaders } = transforms(options);
@@ -153,7 +153,7 @@ export async function createConfig(
options.moduleFederation,
);
if (useRspack) {
if (rspack) {
const RspackReactRefreshPlugin = require('@rspack/plugin-react-refresh');
plugins.push(new RspackReactRefreshPlugin());
} else {
@@ -181,10 +181,7 @@ export async function createConfig(
);
}
const rspack = useRspack
? (require('@rspack/core') as typeof import('@rspack/core').rspack)
: undefined;
const bundler = useRspack ? (rspack as unknown as typeof webpack) : webpack;
const bundler = rspack ? (rspack as unknown as typeof webpack) : webpack;
// TODO(blam): process is no longer auto polyfilled by webpack in v5.
// we use the provide plugin to provide this polyfill, but lets look
@@ -215,8 +212,8 @@ export async function createConfig(
if (options.moduleFederation) {
const isRemote = options.moduleFederation?.mode === 'remote';
const AdaptedModuleFederationPlugin = useRspack
? (rspack!.container
const AdaptedModuleFederationPlugin = rspack
? (rspack.container
.ModuleFederationPlugin as unknown as typeof ModuleFederationPlugin)
: ModuleFederationPlugin;
@@ -285,7 +282,7 @@ export async function createConfig(
plugins.push(
new bundler.DefinePlugin({
'process.env.BUILD_INFO': JSON.stringify(buildInfo),
'process.env.APP_CONFIG': useRspack
'process.env.APP_CONFIG': rspack
? // FIXME: see also https://github.com/web-infra-dev/rspack/issues/5606
JSON.stringify(options.getFrontendAppConfigs())
: bundler.DefinePlugin.runtimeValue(
@@ -301,7 +298,7 @@ export async function createConfig(
// These files are required by the transpiled code when using React Refresh.
// They need to be excluded to the module scope plugin which ensures that files
// that exist in the package are required.
const reactRefreshFiles = useRspack
const reactRefreshFiles = rspack
? []
: [
require.resolve(
@@ -341,7 +338,7 @@ export async function createConfig(
// the module is part of `react` or `react-dom`, and `config.mode` otherwise.
plugins.push(
new bundler.DefinePlugin({
'process.env.NODE_ENV': useRspack
'process.env.NODE_ENV': rspack
? // FIXME: see also https://github.com/web-infra-dev/rspack/issues/5606
JSON.stringify(mode)
: webpack.DefinePlugin.runtimeValue(({ module }) => {
@@ -391,7 +388,7 @@ export async function createConfig(
util: require.resolve('util/'),
},
// FIXME: see also https://github.com/web-infra-dev/rspack/issues/3408
...(!useRspack && {
...(!rspack && {
plugins: [
new LinkedPackageResolvePlugin(paths.rootNodeModules, externalPkgs),
new ModuleScopePlugin(
@@ -424,9 +421,8 @@ export async function createConfig(
: {}),
},
experiments: {
lazyCompilation:
!useRspack && yn(process.env.EXPERIMENTAL_LAZY_COMPILATION),
...(useRspack && {
lazyCompilation: !rspack && yn(process.env.EXPERIMENTAL_LAZY_COMPILATION),
...(rspack && {
// We're still using `style-loader` for custom `insert` option
css: false,
}),
packages/cli/src/lib/bundler/optimization.ts
+5 -9
View File
@@ -22,14 +22,10 @@ const { EsbuildPlugin } = require('esbuild-loader');
export const optimization = (
options: BundlingOptions,
): WebpackOptionsNormalized['optimization'] => {
const { isDev, useRspack } = options;
const { isDev, rspack } = options;
const rspack = useRspack
? (require('@rspack/core') as typeof import('@rspack/core').rspack)
: undefined;
const MinifyPlugin = useRspack
? rspack!.SwcJsMinimizerRspackPlugin
const MinifyPlugin = rspack
? rspack.SwcJsMinimizerRspackPlugin
: EsbuildPlugin;
return {
@@ -46,7 +42,7 @@ export const optimization = (
format: undefined,
include: 'remoteEntry.js',
}),
useRspack && new rspack!.LightningCssMinimizerRspackPlugin(),
rspack && new rspack.LightningCssMinimizerRspackPlugin(),
],
runtimeChunk: 'single',
splitChunks: {
@@ -78,7 +74,7 @@ export const optimization = (
priority: 10,
minSize: 100000,
minChunks: 1,
...(!useRspack && {
...(!rspack && {
maxAsyncRequests: Infinity,
maxInitialRequests: Infinity,
}),
packages/cli/src/lib/bundler/server.ts
+6 -4
View File
@@ -106,7 +106,9 @@ DEPRECATION WARNING: React Router Beta is deprecated and support for it will be
},
});
const useRspack = !!process.env.EXPERIMENTAL_RSPACK;
const rspack = process.env.EXPERIMENTAL_RSPACK
? (require('@rspack/core') as typeof import('@rspack/core').rspack)
: undefined;
const commonConfigOptions = {
...options,
@@ -114,7 +116,7 @@ DEPRECATION WARNING: React Router Beta is deprecated and support for it will be
isDev: true,
baseUrl: url,
frontendConfig,
useRspack,
rspack,
getFrontendAppConfigs: () => {
return latestFrontendAppConfigs;
},
@@ -166,8 +168,8 @@ DEPRECATION WARNING: React Router Beta is deprecated and support for it will be
root: paths.targetPath,
});
} else {
const bundler = useRspack ? require('@rspack/core') : webpack;
const DevServer: typeof WebpackDevServer = useRspack
const bundler = (rspack ?? webpack) as typeof webpack;
const DevServer: typeof WebpackDevServer = rspack
? require('@rspack/dev-server').RspackDevServer
: WebpackDevServer;
packages/cli/src/lib/bundler/transforms.ts
+7 -13
View File
@@ -26,14 +26,14 @@ type Transforms = {
type TransformOptions = {
isDev: boolean;
isBackend?: boolean;
useRspack?: boolean;
rspack?: typeof import('@rspack/core').rspack;
};
export const transforms = (options: TransformOptions): Transforms => {
const { isDev, isBackend, useRspack } = options;
const { isDev, isBackend, rspack } = options;
const CssExtractRspackPlugin: typeof MiniCssExtractPlugin = useRspack
? require('@rspack/core').CssExtractRspackPlugin
const CssExtractRspackPlugin: typeof MiniCssExtractPlugin = rspack
? (rspack.CssExtractRspackPlugin as unknown as typeof MiniCssExtractPlugin)
: MiniCssExtractPlugin;
// This ensures that styles inserted from the style-loader and any
@@ -59,9 +59,7 @@ export const transforms = (options: TransformOptions): Transforms => {
exclude: /node_modules/,
use: [
{
loader: useRspack
? 'builtin:swc-loader'
: require.resolve('swc-loader'),
loader: rspack ? 'builtin:swc-loader' : require.resolve('swc-loader'),
options: {
jsc: {
target: 'es2022',
@@ -89,9 +87,7 @@ export const transforms = (options: TransformOptions): Transforms => {
exclude: /node_modules/,
use: [
{
loader: useRspack
? 'builtin:swc-loader'
: require.resolve('swc-loader'),
loader: rspack ? 'builtin:swc-loader' : require.resolve('swc-loader'),
options: {
jsc: {
target: 'es2022',
@@ -124,9 +120,7 @@ export const transforms = (options: TransformOptions): Transforms => {
test: [/\.icon\.svg$/],
use: [
{
loader: useRspack
? 'builtin:swc-loader'
: require.resolve('swc-loader'),
loader: rspack ? 'builtin:swc-loader' : require.resolve('swc-loader'),
options: {
jsc: {
target: 'es2022',
packages/cli/src/lib/bundler/types.ts
+3 -3
View File
@@ -37,7 +37,7 @@ export type BundlingOptions = {
// Mode that the app is running in, 'protected' or 'public', default is 'public'
appMode?: string;
moduleFederation?: ModuleFederationOptions;
useRspack?: boolean;
rspack?: typeof import('@rspack/core').rspack;
};
export type ServeOptions = BundlingPathsOptions & {
@@ -58,7 +58,7 @@ export type BuildOptions = BundlingPathsOptions & {
frontendAppConfigs: AppConfig[];
fullConfig: Config;
moduleFederation?: ModuleFederationOptions;
useRspack?: boolean;
rspack?: typeof import('@rspack/core').rspack;
};
export type BackendBundlingOptions = {
@@ -68,7 +68,7 @@ export type BackendBundlingOptions = {
inspectEnabled: boolean;
inspectBrkEnabled: boolean;
require?: string;
useRspack?: boolean;
rspack?: typeof import('@rspack/core').rspack;
};
export type BackendServeOptions = BundlingPathsOptions & {