Skip to content

Commit c22ce23

Browse files
AdministratorAdministrator
Administrator
authored and
Administrator
committed
Create nx react 'remote' app to test native fedeartion plugin
1 parent 0187e67 commit c22ce23

21 files changed

+322
-0
lines changed

‎dashboard-example/apps/remote/.babelrc

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"presets": [
3+
[
4+
"@nrwl/react/babel",
5+
{
6+
"runtime": "automatic"
7+
}
8+
]
9+
],
10+
"plugins": []
11+
}

‎dashboard-example/apps/remote/.browserslistrc

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
# This file is used by:
2+
# 1. autoprefixer to adjust CSS to support the below specified browsers
3+
# 2. babel preset-env to adjust included polyfills
4+
#
5+
# For additional information regarding the format and rule options, please see:
6+
# https://github.com/browserslist/browserslist#queries
7+
#
8+
# If you need to support different browsers in production, you may tweak the list below.
9+
10+
last 1 Chrome version
11+
last 1 Firefox version
12+
last 2 Edge major versions
13+
last 2 Safari major version
14+
last 2 iOS major versions
15+
Firefox ESR
16+
not IE 9-11 # For IE 9-11 support, remove 'not'.

‎dashboard-example/apps/remote/.eslintrc.json

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"extends": ["plugin:@nrwl/nx/react", "../../.eslintrc.json"],
3+
"ignorePatterns": ["!**/*"],
4+
"overrides": [
5+
{
6+
"files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
7+
"rules": {}
8+
},
9+
{
10+
"files": ["*.ts", "*.tsx"],
11+
"rules": {}
12+
},
13+
{
14+
"files": ["*.js", "*.jsx"],
15+
"rules": {}
16+
}
17+
]
18+
}

‎dashboard-example/apps/remote/federation.config.js

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
const {
2+
withNativeFederation,
3+
shareAll,
4+
} = require("@softarc/native-federation/build");
5+
6+
module.exports = withNativeFederation({
7+
name: "remote",
8+
9+
exposes: {
10+
"./module": "apps/remote/src/app/is-long-weekend.ts",
11+
"./react-remote": "apps/remote/src/app/react-app.tsx",
12+
},
13+
14+
shared: {
15+
...shareAll({
16+
singleton: true,
17+
strictVersion: true,
18+
requiredVersion: "auto",
19+
includeSecondaries: false,
20+
}),
21+
},
22+
23+
skip: ["@softarc/native-federation-runtime"],
24+
});

‎dashboard-example/apps/remote/jest.config.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/* eslint-disable */
2+
export default {
3+
displayName: "remote",
4+
preset: "../../jest.preset.js",
5+
transform: {
6+
"^(?!.*\\.(js|jsx|ts|tsx|css|json)$)": "@nrwl/react/plugins/jest",
7+
"^.+\\.[tj]sx?$": ["babel-jest", { presets: ["@nrwl/react/babel"] }],
8+
},
9+
moduleFileExtensions: ["ts", "tsx", "js", "jsx"],
10+
coverageDirectory: "../../coverage/apps/remote",
11+
};

‎dashboard-example/apps/remote/project.json

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
{
2+
"$schema": "../../node_modules/nx/schemas/project-schema.json",
3+
"sourceRoot": "apps/remote/src",
4+
"projectType": "application",
5+
"targets": {
6+
"build": {
7+
"executor": "native-federation-plugin:build",
8+
"outputs": ["{options.outputPath}"],
9+
"defaultConfiguration": "development",
10+
"options": {
11+
"baseUrl": "/"
12+
},
13+
"configurations": {
14+
"development": {
15+
"extractLicenses": false,
16+
"optimization": false,
17+
"sourceMap": true,
18+
"vendorChunk": true
19+
},
20+
"production": {
21+
"fileReplacements": [
22+
{
23+
"replace": "apps/remote/src/environments/environment.ts",
24+
"with": "apps/remote/src/environments/environment.prod.ts"
25+
}
26+
],
27+
"optimization": true,
28+
"outputHashing": "all",
29+
"sourceMap": false,
30+
"namedChunks": false,
31+
"extractLicenses": true,
32+
"vendorChunk": false
33+
}
34+
}
35+
},
36+
"serve": {
37+
"executor": "@nrwl/webpack:dev-server",
38+
"defaultConfiguration": "development",
39+
"options": {
40+
"buildTarget": "remote:build",
41+
"hmr": true
42+
},
43+
"configurations": {
44+
"development": {
45+
"buildTarget": "remote:build:development"
46+
},
47+
"production": {
48+
"buildTarget": "remote:build:production",
49+
"hmr": false
50+
}
51+
}
52+
},
53+
"lint": {
54+
"executor": "@nrwl/linter:eslint",
55+
"outputs": ["{options.outputFile}"],
56+
"options": {
57+
"lintFilePatterns": ["apps/remote/**/*.{ts,tsx,js,jsx}"]
58+
}
59+
},
60+
"test": {
61+
"executor": "@nrwl/jest:jest",
62+
"outputs": ["coverage/apps/remote"],
63+
"options": {
64+
"jestConfig": "apps/remote/jest.config.ts",
65+
"passWithNoTests": true
66+
}
67+
}
68+
},
69+
"tags": []
70+
}

‎dashboard-example/apps/remote/src/app/app.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { format, parseISO } from "date-fns";
2+
import { isLongWeekend } from "./is-long-weekend";
3+
4+
const isoDate = "2023-01-01";
5+
const date = parseISO(isoDate);
6+
const weekday = format(date, "EEE");
7+
console.log(`${isoDate} is a ${weekday}.`);
8+
9+
if (isLongWeekend(date)) {
10+
console.log("Long weekend 😎");
11+
} else {
12+
console.log("No long weekend ☹");
13+
}

‎dashboard-example/apps/remote/src/app/index.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { initFederation } from "@softarc/native-federation";
2+
3+
initFederation()
4+
.catch((err) => console.error("err", err))
5+
.then(() => import("./app"))
6+
.catch((err) => console.error("err", err));

‎dashboard-example/apps/remote/src/app/is-long-weekend.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { format } from "date-fns";
2+
3+
export function isLongWeekend(date) {
4+
const weekday = format(date, "EEE");
5+
return weekday === "Mon" || weekday === "Fri";
6+
}

‎dashboard-example/apps/remote/src/app/react-app.tsx

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import React from "react";
2+
3+
export function App() {
4+
return (
5+
<div className="App">
6+
<header className="App-header">
7+
<p>I'm the remote's React Component!</p>
8+
<a
9+
className="App-link"
10+
href="https://reactjs.org"
11+
target="_blank"
12+
rel="noopener noreferrer"
13+
>
14+
Learn React
15+
</a>
16+
</header>
17+
</div>
18+
);
19+
}

0 commit comments

Comments
 (0)