Skip to content
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
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
{
"name": "runtime-demo-host",
"name": "runtime-host",
"version": "0.0.0",
"devDependencies": {
"@module-federation/core": "*",
"@module-federation/runtime": "*",
"@module-federation/typescript": "3.0.1",
"@pmmmwh/react-refresh-webpack-plugin": "0.5.11",
"react-refresh": "0.14.0"
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "runtime_demo_host",
"name": "3005-runtime-host",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"sourceRoot": "apps/runtime-demo/host/src",
"sourceRoot": "apps/runtime-demo/3005-runtime-host/src",
"projectType": "application",
"targets": {
"build": {
Expand All @@ -10,14 +10,14 @@
"defaultConfiguration": "production",
"options": {
"compiler": "swc",
"outputPath": "dist/apps/runtime-demo/host",
"index": "apps/runtime-demo/host/src/index.html",
"outputPath": "dist/apps/runtime-demo/3005-runtime-host",
"index": "apps/runtime-demo/3005-runtime-host/src/index.html",
"baseHref": "/",
"main": "apps/runtime-demo/host/src/index.ts",
"tsConfig": "apps/runtime-demo/host/tsconfig.app.json",
"main": "apps/runtime-demo/3005-runtime-host/src/index.ts",
"tsConfig": "apps/runtime-demo/3005-runtime-host/tsconfig.app.json",
"styles": [],
"scripts": [],
"webpackConfig": "apps/runtime-demo/host/webpack.config.js",
"webpackConfig": "apps/runtime-demo/3005-runtime-host/webpack.config.js",
"babelUpwardRootMode": true
},
"configurations": {
Expand Down Expand Up @@ -47,17 +47,17 @@
"executor": "@nx/webpack:dev-server",
"defaultConfiguration": "production",
"options": {
"buildTarget": "runtime_demo_host:build",
"buildTarget": "3005-runtime-host:build",
"hmr": true,
"port": 3005,
"devRemotes": ["runtime_demo_remote"]
"devRemotes": ["3006-runtime-remote"]
},
"configurations": {
"development": {
"buildTarget": "runtime_demo_host:build:development"
"buildTarget": "3005-runtime-host:build:development"
},
"production": {
"buildTarget": "runtime_demo_host:build:production",
"buildTarget": "3005-runtime-host:build:production",
"hmr": false
}
}
Expand All @@ -73,15 +73,15 @@
"executor": "@nx/web:file-server",
"defaultConfiguration": "development",
"options": {
"buildTarget": "runtime_demo_host:build",
"buildTarget": "3005-runtime-host:build",
"port": 3005
},
"configurations": {
"development": {
"buildTarget": "runtime_demo_host:build:development"
"buildTarget": "3005-runtime-host:build:development"
},
"production": {
"buildTarget": "runtime_demo_host:build:production"
"buildTarget": "3005-runtime-host:build:production"
}
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ init({
name: 'app1',
remotes: [
{
name: 'runtime_demo_remote',
name: 'runtime_remote',
alias: 'app2',
entry: 'http://localhost:3006/remoteEntry.js',
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,5 +20,6 @@
}
},
"files": [],
"exclude": ["webpack.config.js"],
"include": ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx", "next-env.d.ts"]
}
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
{
"name": "runtime-demo-remote",
"name": "runtime-remote",
"version": "0.0.0",
"private": true,
"devDependencies": {
"@module-federation/core": "*",
"@module-federation/enhance": "*",
"@module-federation/typescript": "3.0.1",
"@pmmmwh/react-refresh-webpack-plugin": "0.5.11",
"react-refresh": "0.14.0"
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "runtime_demo_remote",
"name": "3006-runtime-remote",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"sourceRoot": "apps/runtime-demo/remote/src",
"sourceRoot": "apps/runtime-demo/3006-runtime-remote/src",
"projectType": "application",
"targets": {
"build": {
Expand All @@ -10,14 +10,14 @@
"defaultConfiguration": "production",
"options": {
"compiler": "swc",
"outputPath": "dist/apps/runtime-demo/remote",
"index": "apps/runtime-demo/remote/src/index.html",
"outputPath": "dist/apps/runtime-demo/3006-runtime-remote",
"index": "apps/runtime-demo/3006-runtime-remote/src/index.html",
"baseHref": "/",
"main": "apps/runtime-demo/remote/src/index.ts",
"tsConfig": "apps/runtime-demo/remote/tsconfig.app.json",
"main": "apps/runtime-demo/3006-runtime-remote/src/index.ts",
"tsConfig": "apps/runtime-demo/3006-runtime-remote/tsconfig.app.json",
"styles": [],
"scripts": [],
"webpackConfig": "apps/runtime-demo/remote/webpack.config.js",
"webpackConfig": "apps/runtime-demo/3006-runtime-remote/webpack.config.js",
"babelUpwardRootMode": true
},
"configurations": {
Expand Down Expand Up @@ -47,16 +47,16 @@
"executor": "@nx/react:module-federation-dev-server",
"defaultConfiguration": "production",
"options": {
"buildTarget": "runtime_demo_remote:build",
"buildTarget": "3006-runtime-remote:build",
"hmr": true,
"port": 3006
},
"configurations": {
"development": {
"buildTarget": "runtime_demo_remote:build:development"
"buildTarget": "3006-runtime-remote:build:development"
},
"production": {
"buildTarget": "runtime_demo_remote:build:production",
"buildTarget": "3006-runtime-remote:build:production",
"hmr": false
}
}
Expand Down
89 changes: 89 additions & 0 deletions apps/runtime-demo/3006-runtime-remote/webpack.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
const { registerPluginTSTranspiler } = require('nx/src/utils/nx-plugin.js');
registerPluginTSTranspiler();

const { composePlugins, withNx } = require('@nx/webpack');
const { withReact } = require('@nx/react');

const path = require('path');
const baseConfig = require('./module-federation.config');
// const { withModuleFederation } = require('@nx/react/module-federation');
const { ModuleFederationPlugin } = require('@module-federation/enhanced');

/**
* @type {import('@nx/react/module-federation').ModuleFederationConfig}
**/
const defaultConfig = {
...baseConfig,
};

module.exports = composePlugins(
withNx(),
withReact(),
async (config, context) => {
config.plugins.push(
new ModuleFederationPlugin({
name: 'runtime_remote',
// library: { type: 'var', name: 'runtime_remote' },
filename: 'remoteEntry.js',
exposes: {
'./Button': './src/Button.tsx',
'./Button1': './src/Button1.tsx',
},
}),
);
console.log(
'config.optimization?.runtimeChunk',
config.optimization?.runtimeChunk,
);
config.optimization.runtimeChunk = false;
Copy link
Member

Choose a reason for hiding this comment

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

we should include one of these apps at some point with single runtime chunk true, to make sure everything works with both build setups. I think there is some additional work needed to support single runtimr chunk automatically though. but in future :P

config.plugins.forEach((p) => {
if (p.constructor.name === 'ModuleFederationPlugin') {
//Temporary workaround - https://github.com/nrwl/nx/issues/16983
p._options.library = undefined;
}
});

//Temporary workaround - https://github.com/nrwl/nx/issues/16983
config.experiments = { outputModule: false };

// Update the webpack config as needed here.
// e.g. `config.plugins.push(new MyPlugin())`
config.output = {
...config.output,
scriptType: 'text/javascript',
};
config.optimization = {
runtimeChunk: false,
minimize: false,
};
// const mf = await withModuleFederation(defaultConfig);
return config;
/** @type {import('webpack').Configuration} */
// const parsedConfig = mf(config, context);

// parsedConfig.plugins.forEach((p) => {
// if (p.constructor.name === 'ModuleFederationPlugin') {
// //Temporary workaround - https://github.com/nrwl/nx/issues/16983
// p._options.library = undefined;
// }
// });

// parsedConfig.devServer = {
// ...(parsedConfig.devServer || {}),
// //Needs to resolve static files from the dist folder (@mf-types)
// static: path.resolve(__dirname, '../../dist/apps/runtime-demo/remote'),
// };

// //Temporary workaround - https://github.com/nrwl/nx/issues/16983
// parsedConfig.experiments = { outputModule: false };

// // Update the webpack config as needed here.
// // e.g. `config.plugins.push(new MyPlugin())`
// parsedConfig.output = {
// ...parsedConfig.output,
// scriptType: 'text/javascript',
// };

// return parsedConfig;
},
);
4 changes: 2 additions & 2 deletions apps/runtime-demo/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ This example demos automatic-vendor-sharing, each host/remote will share all ven

# Running Demo

Run `nx serve runtime_demo_remote` to start remote
Run `nx serve 3005_runtime_host` to start remote

Run `nx serve runtime_demo_host` to start remote
Run `nx serve 3006_runtime_remote` to start remote

- [localhost:3005](http://localhost:3005/)
- [localhost:3006](http://localhost:3006/)
9 changes: 0 additions & 9 deletions apps/runtime-demo/remote/module-federation.config.js

This file was deleted.

52 changes: 0 additions & 52 deletions apps/runtime-demo/remote/webpack.config.js

This file was deleted.

Loading