Skip to content

Commit 6379f6a

Browse files
ScriptedAlchemyScriptedAlchemy
authored
Next federation 7 (#2973)
* update * testing NextFederation v7 * testing NextFederation v7 * testing NextFederation v7 * update plugins to new beta * get localhost:3000 running * update plugins * update plugins * update plugins * update plugin * chore: nextmf7 update plugin to latest beta * chore: nextmf7 update plugin to latest beta * chore: nextmf7 update plugin to latest beta * chore: nextmf7 update plugin to latest beta * chore: upgrade to next federation 7 * chore: upgrade to next federation 7 * chore: upgrade to next federation 7 * chore: upgrade to next federation 7
1 parent d9bfcd4 commit 6379f6a

File tree

45 files changed

+592
-746
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+592
-746
lines changed

‎complete-react-case/component-app/.DS_Store

0 Bytes
Binary file not shown.

‎comprehensive-demo-react16/app-04/.gitignore

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,11 @@
11
.DS_Store
22
node_modules
33
public/bundle.*
4+
public/*.*.js
5+
public/*.css
6+
!public/global.css
47
public/src_*
58
public/remoteEntry*
69
public/vendors*
710
package-lock.json
8-
yarn.lock
11+
yarn.lock

‎different-react-versions-16-17-typescript/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"name": "different-react-versions-16-17-typescript",
33
"private": true,
4+
"version": "0.0.0",
45
"workspaces": {
56
"packages": [
67
"app1",

‎different-react-versions-16-17/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"name": "different-react-versions-16-17",
33
"private": true,
4+
"version": "1.0.0",
45
"workspaces": {
56
"packages": [
67
"app1",

‎different-react-versions-16-18-typescript/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"name": "different-react-versions-16-18-typescript",
33
"private": true,
4+
"version": "0.0.0",
45
"workspaces": {
56
"packages": [
67
"app1",

‎different-react-versions-16-18/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"name": "different-react-versions-16-18",
33
"private": true,
4+
"version": "1.0.0",
45
"workspaces": {
56
"packages": [
67
"app1",

‎modernjs-medusa/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"name": "modernjs-medusa",
33
"private": true,
4+
"version": "1.0.0",
45
"workspaces": {
56
"packages": [
67
"host",

‎modernjs/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"name": "modernjs",
33
"private": true,
4+
"version": "1.0.0",
45
"workspaces": {
56
"packages": [
67
"host",

‎nextjs-ssr-delegate-modules/checkout/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@
88
"start": "NODE_ENV=production next start"
99
},
1010
"dependencies": {
11-
"@module-federation/nextjs-mf": "6.1.1",
12-
"@module-federation/utilities": "1.3.0",
11+
"@module-federation/nextjs-mf": "^7.0.0",
12+
"@module-federation/utilities": "^2.0.0",
1313
"lodash": "4.17.21",
1414
"next": "13.3.1",
1515
"react": "^18.2.0",

‎nextjs-ssr-delegate-modules/checkout/pages/_app.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import {Suspense,lazy} from "react";
22
import App from 'next/app';
33
import dynamic from 'next/dynamic';
4-
const Nav = dynamic(() => {
4+
const Nav = lazy(() => {
55
return import('home/nav');
6-
},{suspense:true});
6+
});
77

88
function MyApp({ Component, pageProps }) {
99
return (

‎nextjs-ssr-delegate-modules/checkout/remote-delegate.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { importDelegatedModule } from '@module-federation/utilities';
1+
module.exports = new Promise(async (resolve, reject) => {
2+
const { importDelegatedModule } = await import('@module-federation/utilities');
23

3-
module.exports = new Promise((resolve, reject) => {
44
//Logging the delegate being called for the resourceQuery from the webpack runtime ID
55
console.log('Delegate being called for', __resourceQuery, 'from', __webpack_runtime_id__);
66
//Getting the current request by getting the 'remote' query parameter using URLSearchParams

‎nextjs-ssr-delegate-modules/home/components/nav.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
import React, {Suspense} from 'react';
1+
import React, {Suspense,lazy} from 'react';
22
import Link from 'next/link';
33
import dynamic from 'next/dynamic';
44

55
console.log(__webpack_share_scopes__)
6-
export const HelloWorld = dynamic(() => import('./helloWorld').then(mod => {
6+
export const HelloWorld = lazy(() => import('./helloWorld').then(mod => {
77
return {default: mod.HelloWorld}
8-
}),{suspense: true});
8+
}));
99
const links = [
1010
{ href: 'https://zeit.co/now', label: 'ZEIT' },
1111
{ href: 'https://github.com/zeit/next.js', label: 'GitHub' },

‎nextjs-ssr-delegate-modules/home/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@
88
"start": "NODE_ENV=production next start -p 3001"
99
},
1010
"dependencies": {
11-
"@module-federation/nextjs-mf": "6.1.1",
12-
"@module-federation/utilities": "1.3.0",
11+
"@module-federation/nextjs-mf": "^7.0.0",
12+
"@module-federation/utilities": "^2.0.0",
1313
"lodash": "4.17.21",
1414
"next": "13.3.1",
1515
"react": "^18.2.0",

‎nextjs-ssr-delegate-modules/home/pages/index.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
1-
import React, {Fragment, Suspense} from 'react';
1+
import React, {Fragment, Suspense, lazy} from 'react';
22
import Head from 'next/head';
33
import dynamic from 'next/dynamic';
44
import lodash from "lodash";
5-
console.log('lodash', lodash);
65

7-
const RemoteTitle = dynamic(() => import('checkout/title'), {suspense: true});
6+
const RemoteTitle = lazy(() => import('checkout/title'));
87

98
const Home = ({loaded}) => {
109
return (

‎nextjs-ssr-delegate-modules/home/remote-delegate.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { importDelegatedModule } from '@module-federation/utilities';
1+
module.exports = new Promise(async (resolve, reject) => {
2+
const { importDelegatedModule } = await import('@module-federation/utilities');
23

3-
module.exports = new Promise((resolve, reject) => {
44
//Logging the delegate being called for the resourceQuery from the webpack runtime ID
55
console.log('Delegate being called for', __resourceQuery, 'from', __webpack_runtime_id__);
66
//Getting the current request by getting the 'remote' query parameter using URLSearchParams

‎nextjs-ssr-delegate-modules/shop/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@
88
"start": "NODE_ENV=production next start -p 3002"
99
},
1010
"dependencies": {
11-
"@module-federation/nextjs-mf": "6.1.1",
12-
"@module-federation/utilities": "1.3.0",
11+
"@module-federation/nextjs-mf": "^7.0.0",
12+
"@module-federation/utilities": "^2.0.0",
1313
"lodash": "4.17.21",
1414
"next": "13.3.1",
1515
"react": "^18.2.0",

‎nextjs-ssr-delegate-modules/shop/remote-delegate.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { importDelegatedModule } from '@module-federation/utilities';
1+
module.exports = new Promise(async (resolve, reject) => {
2+
const { importDelegatedModule } = await import('@module-federation/utilities');
23

3-
module.exports = new Promise((resolve, reject) => {
44
//Logging the delegate being called for the resourceQuery from the webpack runtime ID
55
console.log('Delegate being called for', __resourceQuery, 'from', __webpack_runtime_id__);
66
//Getting the current request by getting the 'remote' query parameter using URLSearchParams

‎nextjs-ssr/checkout/components/exposedTitle.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
import React, { useEffect } from 'react';
2+
import styles from './sample.module.css'
23
const ExportredTitle = () => {
34
console.log('---------loading remote component---------');
45
useEffect(() => {
56
console.log('HOOKS WORKS');
67
}, []);
78
return (
89
<div className="hero">
9-
<h1 className="title">
10+
<h1 className={"title " + styles.thing}>
1011
{' '}
1112
This came fom <code>checkout</code> !!!
1213
</h1>

‎nextjs-ssr/checkout/components/sample.module.css

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.thing {
2+
color: red;
3+
}

‎nextjs-ssr/checkout/components/test.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
export default function ClientOnlyComponent() {
2+
console.log('it render')
3+
return <span>Hello Client!</span>;
4+
}

‎nextjs-ssr/checkout/next.config.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ const remotes = isServer => {
66
return {
77
home: `home@http://localhost:3001/_next/static/${location}/remoteEntry.js`,
88
shop: `shop@http://localhost:3002/_next/static/${location}/remoteEntry.js`,
9-
checkout: `checkout@http://localhost:3000/_next/static/${location}/remoteEntry.js`,
9+
// checkout: `checkout@http://localhost:3000/_next/static/${location}/remoteEntry.js`,
1010
};
1111
};
1212
module.exports = {
@@ -23,7 +23,8 @@ module.exports = {
2323
remotes: remotes(options.isServer),
2424
shared: {},
2525
extraOptions:{
26-
automaticAsyncBoundary: true
26+
automaticAsyncBoundary: true,
27+
exposePages: true
2728
}
2829
}),
2930
);

‎nextjs-ssr/checkout/package.json

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,16 @@
33
"version": "0.1.0",
44
"private": true,
55
"scripts": {
6-
"dev": "next dev",
6+
"dev": "rm -rf .next;next dev",
77
"build": "next build",
88
"start": "NODE_ENV=production next start"
99
},
1010
"dependencies": {
11-
"@module-federation/nextjs-mf": "6.0.7",
11+
"@module-federation/nextjs-mf": "^6.5.2-rc6.0",
1212
"lodash": "4.17.21",
13-
"next": "12.3.4",
13+
"next": "13.3.0",
1414
"react": "^18.2.0",
1515
"react-dom": "^18.2.0",
16-
"webpack": "5.80.0",
17-
"webpack-merge": "^5.8.0"
16+
"webpack": "5.80.0"
1817
}
1918
}

‎nextjs-ssr/checkout/pages/_app.js

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,27 @@
11
import {Suspense,lazy} from "react";
22
import App from 'next/app';
33
import dynamic from 'next/dynamic';
4-
const Nav = dynamic(() => {
4+
const Nav = lazy(() => {
5+
console.log(import('home/nav'));
56
return import('home/nav');
6-
},{suspense:true});
7+
});
8+
79

810
function MyApp({ Component, pageProps }) {
11+
console.log('in app');
912
return (
1013
<>
1114
<Suspense fallback={'loading'}>
1215
<Nav />
1316
</Suspense>
1417
<Component {...pageProps} />
18+
<div className="test">test</div>
1519
</>
1620
);
1721
}
1822

1923
MyApp.getInitialProps = async ctx => {
24+
console.log('in app getInitialProps');
2025
const appProps = await App.getInitialProps(ctx);
2126
return appProps;
2227
};

‎nextjs-ssr/checkout/pages/_document.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import Document, { Html, Head, Main, NextScript } from "next/document";
22
import React from "react";
33
import { revalidate, FlushedChunks, flushChunks } from "@module-federation/nextjs-mf/utils";
44

5-
65
class MyDocument extends Document {
76
static async getInitialProps(ctx) {
87
if(process.env.NODE_ENV === "development" && !ctx.req.url.includes("_next")) {
@@ -17,14 +16,14 @@ class MyDocument extends Document {
1716
revalidate()
1817
});
1918
}
20-
19+
const initialProps = await Document.getInitialProps(ctx);
2120
const chunks = await flushChunks()
2221

23-
const initialProps = await Document.getInitialProps(ctx);
2422
return {
2523
...initialProps,
2624
chunks
2725
};
26+
2827
}
2928

3029
render() {

‎nextjs-ssr/checkout/pages/checkout.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from 'react';
22
import Head from 'next/head';
3-
3+
import dynamic from 'next/dynamic';
4+
const CC = dynamic(() => import('../components/test'),{ssr:false});
45
const Checkout = props => (
56
<div>
67
<Head>
@@ -10,6 +11,7 @@ const Checkout = props => (
1011

1112
<div className="hero">
1213
<h1>checkout page</h1>
14+
<CC />
1315
<h3 className="title">This is a federated page owned by localhost:3000</h3>
1416
<span>
1517
{' '}
@@ -39,7 +41,6 @@ const Checkout = props => (
3941
);
4042
Checkout.getInitialProps = async () => {
4143
const swapi = await fetch('https://jsonplaceholder.typicode.com/todos/1').then(res => res.json());
42-
console.log(swapi);
4344
console.log('swapi');
4445
return swapi;
4546
};

‎nextjs-ssr/checkout/pages/index.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
11
import HomePage from 'home/home';
22
const Home = HomePage;
3-
Home.getInitialProps = HomePage.getInitialProps;
3+
console.log('SSS',__webpack_share_scopes__);
4+
console.log(Home);
5+
Home.getInitialPrrops = HomePage.gmetInitialProps;
46
export default Home;

‎nextjs-ssr/checkout/pages/shop.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
11
import ShopPage from 'shop/shop';
2+
3+
4+
console.log('SARE SCOP{E', __webpack_share_scopes__);
25
const Shop = ShopPage;
36
Shop.getInitialProps = ShopPage.getInitialProps;
47
export default Shop;

‎nextjs-ssr/home/components/nav.js

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
1-
import React, {Suspense} from 'react';
1+
import React, {Suspense,lazy} from 'react';
22
import Link from 'next/link';
33
import dynamic from 'next/dynamic';
4+
console.log('fromHome',__webpack_share_scopes__, Link);
45

5-
export const HelloWorld = dynamic(() => import('./helloWorld').then(mod => {
6+
export const HelloWorld = lazy(() => import('./helloWorld').then(mod => {
67
return {default: mod.HelloWorld}
7-
}),{suspense: true});
8+
}));
89
const links = [
910
{ href: 'https://zeit.co/now', label: 'ZEIT' },
1011
{ href: 'https://github.com/zeit/next.js', label: 'GitHub' },
@@ -21,13 +22,13 @@ const Nav = () => (
2122
<ul>
2223
<li>
2324
<Link href="/">
24-
<a>Home</a>
25+
Home
2526
</Link>
2627
<Link href="/shop">
27-
<a>Shop</a>
28+
Shop
2829
</Link>
2930
<Link href="/checkout">
30-
<a>Checkout</a>
31+
Checkout
3132
</Link>
3233
</li>
3334
{links.map(({ key, href, label }) => (

‎nextjs-ssr/home/next.config.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ const remotes = isServer => {
1010
};
1111
};
1212
module.exports = {
13-
webpack5: true,
1413
webpack(config, options) {
1514
config.plugins.push(
1615
new NextFederationPlugin({
@@ -24,7 +23,8 @@ module.exports = {
2423
remotes: remotes(options.isServer),
2524
shared: {},
2625
extraOptions:{
27-
automaticAsyncBoundary: true
26+
automaticAsyncBoundary: true,
27+
exposePages: true
2828
}
2929
}),
3030
);

‎nextjs-ssr/home/package.json

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,16 @@
33
"version": "0.1.0",
44
"private": true,
55
"scripts": {
6-
"dev": "next dev -p 3001",
6+
"dev": "rm -rf .next; next dev -p 3001",
77
"build": "next build",
88
"start": "NODE_ENV=production next start -p 3001"
99
},
1010
"dependencies": {
11-
"@module-federation/nextjs-mf": "6.0.7",
11+
"@module-federation/nextjs-mf": "^6.5.2-rc6.0",
1212
"lodash": "4.17.21",
13-
"next": "12.3.4",
13+
"next": "13.3.0",
1414
"react": "^18.2.0",
1515
"react-dom": "^18.2.0",
16-
"webpack": "5.80.0",
17-
"webpack-merge": "^5.8.0"
16+
"webpack": "5.80.0"
1817
}
1918
}

0 commit comments

Comments
 (0)