Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore(rsbuild-plugin): split setUp function to help extend #3215

Merged
merged 6 commits into from
Dec 26, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/angry-spoons-wink.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@module-federation/rsbuild-plugin': patch
---

chore(rsbuild-plugin): split setUp function to help extend
5 changes: 5 additions & 0 deletions .changeset/spicy-roses-hear.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@module-federation/storybook-addon': patch
---

chore: export plugin name
2 changes: 1 addition & 1 deletion apps/rslib-module/.storybook/main.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ const config: StorybookConfig = {
options: {
remotes: {
'rslib-module':
'rslib-module@http://localhost:3001/mf/mf-manifest.json',
'rslib_provider@http://localhost:3001/mf-manifest.json',
},
},
},
Expand Down
5 changes: 3 additions & 2 deletions apps/rslib-module/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,8 @@
"types": "./dist/cjs/index.d.ts",
"scripts": {
"build": "rslib build",
"dev": "rslib mf dev",
"dev": "rslib mf-dev",
"build:watch": "rslib build --watch",
"serve": "pnpm build && http-server -p 3001 ./dist/ --cors",
"storybook": "storybook dev -p 6006"
},
Expand All @@ -22,7 +23,7 @@
"@module-federation/rsbuild-plugin": "workspace:*",
"@module-federation/storybook-addon": "workspace:*",
"@rsbuild/plugin-react": "^1.0.6",
"@rslib/core": "^0.0.18",
"@rslib/core": "0.2.0",
"@types/react": "^18.3.11",
"http-server": "^14.1.1",
"react": "^18.3.1",
Expand Down
40 changes: 17 additions & 23 deletions apps/rslib-module/rslib.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -35,33 +35,27 @@ export default defineConfig({
distPath: {
root: './dist/mf',
},
assetPrefix: 'http://localhost:3000/mf',
minify: true,
},
dev: {
assetPrefix: 'http://localhost:3001/mf',
},
// just for dev
server: {
port: 3001,
},
plugins: [
pluginModuleFederation({
name: 'rslib_provider',
exposes: {
'.': './src/index.tsx',
},
shared: {
react: {
singleton: true,
},
'react-dom': {
singleton: true,
},
},
}),
],
},
],
plugins: [pluginReact()],
plugins: [
pluginReact(),
pluginModuleFederation({
name: 'rslib_provider',
exposes: {
'.': './src/index.tsx',
},
shared: {
react: {
singleton: true,
},
'react-dom': {
singleton: true,
},
},
}),
],
});
5 changes: 4 additions & 1 deletion packages/enhanced/src/index.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
import type { moduleFederationPlugin } from '@module-federation/sdk';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The import statement only imports the type but not the actual module. If the module is needed at runtime, consider importing both:

Suggested change
import type { moduleFederationPlugin } from '@module-federation/sdk';
import { moduleFederationPlugin } from '@module-federation/sdk';

export { default as ModuleFederationPlugin } from './wrapper/ModuleFederationPlugin';
export {
default as ModuleFederationPlugin,
PLUGIN_NAME,
} from './wrapper/ModuleFederationPlugin';
export { default as ContainerReferencePlugin } from './wrapper/ContainerReferencePlugin';
export { default as SharePlugin } from './wrapper/SharePlugin';
export { default as ContainerPlugin } from './wrapper/ContainerPlugin';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The export statement for ContainerPlugin appears to be truncated. Complete the line to properly export the plugin:

Suggested change
export { default as ContainerPlugin } from './wrapper/ContainerPlugin';
export { default as ContainerPlugin } from './wrapper/ContainerPlugin';

Comment on lines 1 to 8
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider adding JSDoc comments for the exported plugins to improve API documentation. This will help users understand the purpose and usage of each plugin. For example:
/**

  • Exports core Module Federation plugins for webpack configuration
  • @module ModuleFederationPlugins
    */

Also consider grouping related exports together with explanatory comments for better code organization.

Expand Down
5 changes: 4 additions & 1 deletion packages/enhanced/src/rspack.ts
Original file line number Diff line number Diff line change
@@ -1 +1,4 @@
export { ModuleFederationPlugin } from '@module-federation/rspack/plugin';
export {
ModuleFederationPlugin,
PLUGIN_NAME,
} from '@module-federation/rspack/plugin';
7 changes: 5 additions & 2 deletions packages/enhanced/src/webpack.ts
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
import { default as ModuleFederationPlugin } from './wrapper/ModuleFederationPlugin';
import {
default as ModuleFederationPlugin,
PLUGIN_NAME,
} from './wrapper/ModuleFederationPlugin';

Comment on lines +1 to +4
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The import statement could be more specific about what's being imported. Instead of using 'default as', consider importing the plugin directly for better clarity and readability. Here's a suggested change:

Suggested change
import {
default as ModuleFederationPlugin,
PLUGIN_NAME,
} from './wrapper/ModuleFederationPlugin';
import ModuleFederationPlugin, { PLUGIN_NAME } from './wrapper/ModuleFederationPlugin';

This makes it immediately clear what's being imported without the 'default as' indirection.

export { ModuleFederationPlugin };
export { ModuleFederationPlugin, PLUGIN_NAME };
2 changes: 1 addition & 1 deletion packages/enhanced/src/wrapper/ModuleFederationPlugin.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import path from 'node:path';
import fs from 'node:fs';
import ReactBridgePlugin from '@module-federation/bridge-react-webpack-plugin';

const PLUGIN_NAME = 'ModuleFederationPlugin';
export const PLUGIN_NAME = 'ModuleFederationPlugin';

export default class ModuleFederationPlugin implements WebpackPluginInstance {
private _options: moduleFederationPlugin.ModuleFederationPluginOptions;
Expand Down
1 change: 1 addition & 0 deletions packages/modernjs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,7 @@
"license": "MIT",
"dependencies": {
"@modern-js/node-bundle-require": "2.60.6",
"@module-federation/rsbuild-plugin": "workspace:*",
"@modern-js/utils": "2.60.6",
"@module-federation/enhanced": "workspace:*",
"@module-federation/node": "workspace:*",
Expand Down
30 changes: 2 additions & 28 deletions packages/modernjs/src/cli/utils.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { bundle } from '@modern-js/node-bundle-require';
import { PluginOptions } from '../types';
import { LOCALHOST, PLUGIN_IDENTIFIER } from '../constant';
import logger from './logger';
import { autoDeleteSplitChunkCacheGroups } from '@module-federation/rsbuild-plugin/utils';

import type { BundlerConfig, BundlerChainConfig } from '../interfaces/bundler';
import type {
Expand Down Expand Up @@ -301,6 +302,7 @@ export function patchBundlerConfig<T extends Bundler>(options: {
}

if (!isServer) {
// @ts-ignore
autoDeleteSplitChunkCacheGroups(mfConfig, bundlerConfig);
}

Expand Down Expand Up @@ -419,31 +421,3 @@ const SHARED_SPLIT_CHUNK_MAP = {
'@douyinfe/semi-ui': SPLIT_CHUNK_MAP.SEMI,
axios: SPLIT_CHUNK_MAP.AXIOS,
};

function autoDeleteSplitChunkCacheGroups<T extends Bundler>(
mfConfig: moduleFederationPlugin.ModuleFederationPluginOptions,
bundlerConfig: BundlerConfig<T>,
) {
if (!mfConfig.shared) {
return;
}
if (
!bundlerConfig.optimization?.splitChunks ||
!bundlerConfig.optimization.splitChunks.cacheGroups
) {
return;
}
const arrayShared = Array.isArray(mfConfig.shared)
? mfConfig.shared
: Object.keys(mfConfig.shared);
for (const shared of arrayShared) {
const splitChunkKey =
SHARED_SPLIT_CHUNK_MAP[shared as keyof typeof SHARED_SPLIT_CHUNK_MAP];
if (!splitChunkKey) {
continue;
}
if (bundlerConfig.optimization.splitChunks.cacheGroups[splitChunkKey]) {
delete bundlerConfig.optimization.splitChunks.cacheGroups[splitChunkKey];
}
}
}
20 changes: 18 additions & 2 deletions packages/rsbuild-plugin/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,14 @@
"license": "MIT",
"exports": {
".": {
"types": "./dist/index.cjs.d.ts",
"import": "./dist/index.esm.js",
"require": "./dist/index.cjs.js",
"types": "./dist/index.cjs.d.ts"
"require": "./dist/index.cjs.js"
},
"./utils": {
"types": "./dist/utils.cjs.d.ts",
"import": "./dist/utils.esm.js",
"require": "./dist/utils.cjs.js"
}
},
"main": "./dist/index.cjs.js",
Expand All @@ -25,6 +30,9 @@
"*": {
".": [
"./dist/index.cjs.d.ts"
],
"utils": [
"./dist/utils.cjs.d.ts"
]
}
},
Expand All @@ -41,6 +49,14 @@
"@module-federation/enhanced": "workspace:*",
"@rsbuild/core": "1.x"
},
"peerDependenciesMeta": {
"@rsbuild/core": {
"optional": true
},
"@module-federation/enhanced": {
"optional": true
}
},
"engines": {
"node": ">=16.0.0"
},
Expand Down
1 change: 1 addition & 0 deletions packages/rsbuild-plugin/rollup.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ module.exports = (rollupConfig, _projectOptions) => {
);
rollupConfig.input = {
index: 'packages/rsbuild-plugin/src/cli/index.ts',
utils: 'packages/rsbuild-plugin/src/utils/index.ts',
};
return rollupConfig;
};
Loading
Loading