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

feat(storybook-addon): refactor util withModuleFederation #829

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
2 changes: 2 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,8 @@

[module-federation/typescript](./packages/typescript)

[module-federation/storybook-addon](./packages/storybook-addon)

## Generate an application

Run `nx g @nrwl/next:app my-app` to generate an application.
Copy link

Choose a reason for hiding this comment

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

It seems that this is not actually code but rather a markdown document, likely related to a project's documentation or readme file.

As for the content itself, it looks like a brief introduction to a project, specifically mentioning its use of Nx and Next.js. There is also a note about generating an application using the nx g command.

Without additional context, it is difficult to provide specific feedback or improvements. However, listing out the changes made in the code patch would be helpful in understanding any potential risks or opportunities for improvement.

Expand Down
23 changes: 11 additions & 12 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -58,17 +58,16 @@
"@jscutlery/semver": "^2.27.1",
"@node-rs/jieba": "^1.6.2",
"@nrwl/cli": "15.9.2",
"@nrwl/eslint-plugin-nx": "15.9.2",
"@nrwl/jest": "15.9.2",
"@nrwl/js": "15.9.2",
"@nrwl/linter": "15.9.2",
"@nrwl/next": "15.9.2",
"@nrwl/react": "15.9.2",
"@nrwl/storybook": "^15.9.2",
"@nrwl/vite": "15.9.2",
"@nrwl/web": "15.9.2",
"@nrwl/webpack": "15.9.2",
"@nrwl/workspace": "15.9.2",
"@nrwl/eslint-plugin-nx": "16.0.0",
"@nrwl/jest": "16.0.0",
"@nrwl/js": "16.0.0",
"@nrwl/linter": "16.0.0",
"@nrwl/next": "16.0.0",
"@nrwl/react": "16.0.0",
"@nrwl/storybook": "^16.0.0",
"@nrwl/vite": "16.0.0",
"@nrwl/web": "16.0.0",
"@nrwl/webpack": "16.0.0",
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.7",
"@storybook/addon-essentials": "^6.5.15",
"@storybook/builder-webpack5": "^6.5.15",
Expand Down Expand Up @@ -122,7 +121,7 @@
"merge-stream": "~2.0",
"ngx-deploy-npm": "^5.0.0",
"nodejieba": "^2.6.0",
"nx": "15.9.2",
"nx": "16.0.0",
"postcss-calc": "~8.2.0",
"postcss-custom-properties": "~13.1.0",
"postcss-import": "~15.1.0",
Copy link

Choose a reason for hiding this comment

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

The code patch appears to be a dependency update in the package.json file. It updates various @nrwl packages and the nx package to version 16.0.0. There are no apparent syntax or logic issues in the code patch, and it seems to be a routine package update. However, it is always recommended to test thoroughly after updating dependencies to ensure compatibility and stability.

Expand Down
2 changes: 1 addition & 1 deletion packages/storybook-addon/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@module-federation/storybook-addon",
"version": "0.1.0",
"version": "0.1.1",
"description": "Storybook addon to consume remote module federated apps/components",
"license": "MIT",
"repository": "https://github.com/module-federation/universe/tree/main/packages/storybook-addon",
Copy link

Choose a reason for hiding this comment

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

This is not a code patch, but rather a patch file containing changes to a package.json file.

The only change in this patch is the version number, which has been updated from "0.1.0" to "0.1.1". There are no bug risks associated with this change and it is a common practice to update the version number when making changes to a package.

Improvement suggestions would depend on the context of this package and its usage, but without more information, it is difficult to provide specific suggestions.

Copy link
Member

Choose a reason for hiding this comment

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

my release system automatically incrementes package versions

Expand Down
24 changes: 2 additions & 22 deletions packages/storybook-addon/src/utils/with-module-federation.ts
Original file line number Diff line number Diff line change
@@ -1,28 +1,9 @@
import { getModuleFederationConfig } from '@nrwl/react/src/module-federation/utils';
import { readCachedProjectConfiguration } from 'nx/src/project-graph/project-graph';
import { getModuleFederationConfig } from '@nx/react/src/module-federation/utils';
import { container, Configuration } from 'webpack';
import type { ModuleFederationConfig } from '@nrwl/devkit';

const { ModuleFederationPlugin } = container;

function determineRemoteUrl(remote: string) {
const remoteConfiguration = readCachedProjectConfiguration(remote);
const serveTarget = remoteConfiguration?.targets?.['serve'];

if (!serveTarget) {
throw new Error(
`Cannot automatically determine URL of remote (${remote}). Looked for property "host" in the project's "serve" target.\n
You can also use the tuple syntax in your webpack config to configure your remotes. e.g. \`remotes: [['remote1', 'http://localhost:4201']]\``
);
}

const host = serveTarget.options?.host ?? 'http://localhost';
const port = serveTarget.options?.port ?? 4201;
return `${
host.endsWith('/') ? host.slice(0, -1) : host
}:${port}/remoteEntry.js`;
}

const updateMappedRemotes = (remotes: Record<string, string>) => {
const newRemotes: Record<string, string> = {};

Expand All @@ -35,8 +16,7 @@ const updateMappedRemotes = (remotes: Record<string, string>) => {

const withModuleFederation = async (options: ModuleFederationConfig) => {
const { mappedRemotes, sharedDependencies } = await getModuleFederationConfig(
options,
determineRemoteUrl
options
);

return (config: Configuration) => {
Expand Down