Skip to content

Commit c399b9a

Browse files
ScriptedAlchemyScriptedAlchemy
authored
perf: switch to ESM by default (#3688)
1 parent 451b4f5 commit c399b9a

Some content is hidden

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

52 files changed

+865
-190
lines changed

‎.changeset/gold-bottles-promise.md

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
---
2+
'@module-federation/inject-external-runtime-core-plugin': minor
3+
'@module-federation/webpack-bundler-runtime': minor
4+
'@module-federation/data-prefetch': minor
5+
'@module-federation/runtime-tools': minor
6+
'@module-federation/runtime-core': minor
7+
'@module-federation/enhanced': minor
8+
'bundle-size': minor
9+
'@module-federation/runtime': minor
10+
'@module-federation/node': minor
11+
'@module-federation/sdk': minor
12+
'@module-federation/esbuild': patch
13+
---
14+
15+
Switch to esm modules by default

‎.cursorignore

+2-9
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,9 @@
55
**/dist/
66

77
# Documentation and config files
8-
**/*.md
98
**/*.yaml
109
**/*.yml
11-
**/.eslintrc*
12-
**/.prettierrc*
13-
**/.swcrc
14-
**/jest.config.*
15-
**/tsconfig.*
16-
**/*/stats.json
10+
1711

1812
# Explicitly ignore specific packages
1913
packages/typescript/
@@ -24,7 +18,6 @@ packages/native-federation-typescript/
2418
packages/esbuild/
2519

2620
# Ignore specific directories
27-
apps/
2821
webpack/tooling/
2922
webpack/setup/
3023
webpack/test/
@@ -35,7 +28,7 @@ tools/
3528
.vscode/
3629
.verdaccio/
3730

38-
!apps/manifest-demo/*.ts
31+
3932

4033
# Ignore specific files
4134
.cursorignore

‎apps/bundle-size/.babelrc

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

‎apps/bundle-size/cypress.config.ts

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
2+
import { defineConfig } from 'cypress';
3+
4+
export default defineConfig({
5+
e2e: nxE2EPreset(__filename, { cypressDir: 'cypress' }),
6+
defaultCommandTimeout: 20000,
7+
});

‎apps/bundle-size/cypress/e2e/app.cy.ts

+80
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
import { getH1, getH3 } from '../support/app.po';
2+
3+
describe('3005-runtime-host/', () => {
4+
beforeEach(() => cy.visit('/'));
5+
6+
describe('Welcome message', () => {
7+
it('should display welcome message', () => {
8+
getH1().contains('Runtime Demo');
9+
});
10+
});
11+
12+
describe('Image checks', () => {
13+
it('should check that the home-webpack-png and remote1-webpack-png images are not 404', () => {
14+
// Get the src attribute of the home-webpack-png image
15+
cy.get('img.home-webpack-png')
16+
.invoke('attr', 'src')
17+
.then((src) => {
18+
if (!src) {
19+
throw new Error('src must not be empty');
20+
}
21+
cy.log(src);
22+
cy.request(src).its('status').should('eq', 200);
23+
});
24+
25+
// Get the src attribute of the shop-webpack-png image
26+
cy.get('img.remote1-webpack-png')
27+
.invoke('attr', 'src')
28+
.then((src) => {
29+
if (!src) {
30+
throw new Error('src must not be empty');
31+
}
32+
// Send a GET request to the src URL
33+
cy.request(src).its('status').should('eq', 200);
34+
});
35+
});
36+
37+
it('should check that the home-webpack-svg and remote1-webpack-svg images are not 404', () => {
38+
// Get the src attribute of the home-webpack-png image
39+
cy.get('img.home-webpack-svg')
40+
.invoke('attr', 'src')
41+
.then((src) => {
42+
if (!src) {
43+
throw new Error('src must not be empty');
44+
}
45+
cy.log(src);
46+
cy.request(src).its('status').should('eq', 200);
47+
});
48+
49+
// Get the src attribute of the shop-webpack-png image
50+
cy.get('img.remote1-webpack-svg')
51+
.invoke('attr', 'src')
52+
.then((src) => {
53+
if (!src) {
54+
throw new Error('src must not be empty');
55+
}
56+
// Send a GET request to the src URL
57+
cy.request(src).its('status').should('eq', 200);
58+
});
59+
});
60+
});
61+
62+
describe('Shared react hook check', () => {
63+
it('should display text which comes from remote1 hook', () => {
64+
cy.get('.remote1-text')
65+
.invoke('html')
66+
.should('equal', 'Custom hook from localhost:3006 works!');
67+
});
68+
});
69+
70+
describe('dynamic remote check', () => {
71+
describe('dynamic-remote/ButtonOldAnt', () => {
72+
it('should display remote button', () => {
73+
cy.get('button.test-remote2').contains('Button');
74+
});
75+
it('should use host shared(antd)', () => {
76+
cy.get('button.test-remote2').contains('Button from [email protected]');
77+
});
78+
});
79+
});
80+
});

‎apps/bundle-size/cypress/fixtures/example.json

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"name": "Using fixtures to represent data",
3+
"email": "[email protected]",
4+
"body": "Fixtures are a great way to mock data for responses to routes"
5+
}

‎apps/bundle-size/cypress/support/app.po.ts

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export const getH1 = () => cy.get('h1');
2+
export const getH2 = () => cy.get('h2');
3+
export const getH3 = () => cy.get('h3');

‎apps/bundle-size/cypress/support/commands.ts

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
/// <reference types="cypress" />
2+
3+
// ***********************************************
4+
// This example commands.ts shows you how to
5+
// create various custom commands and overwrite
6+
// existing commands.
7+
//
8+
// For more comprehensive examples of custom
9+
// commands please read more here:
10+
// https://on.cypress.io/custom-commands
11+
// ***********************************************
12+
13+
// eslint-disable-next-line @typescript-eslint/no-namespace
14+
declare namespace Cypress {
15+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
16+
interface Chainable<Subject> {
17+
login(email: string, password: string): void;
18+
}
19+
}
20+
21+
// -- This is a parent command --
22+
Cypress.Commands.add('login', (email, password) => {
23+
// console.log('Custom command example: Login', email, password);
24+
});
25+
//
26+
// -- This is a child command --
27+
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
28+
//
29+
//
30+
// -- This is a dual command --
31+
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
32+
//
33+
//
34+
// -- This will overwrite an existing command --
35+
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })

‎apps/bundle-size/cypress/support/e2e.ts

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
// ***********************************************************
2+
// This example support/e2e.ts is processed and
3+
// loaded automatically before your test files.
4+
//
5+
// This is a great place to put global configuration and
6+
// behavior that modifies Cypress.
7+
//
8+
// You can change the location of this file or turn off
9+
// automatically serving support files with the
10+
// 'supportFile' configuration option.
11+
//
12+
// You can read more here:
13+
// https://on.cypress.io/configuration
14+
// ***********************************************************
15+
16+
// Import commands.ts using ES2015 syntax:
17+
import './commands';

‎apps/bundle-size/cypress/tsconfig.json

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"extends": "../tsconfig.json",
3+
"compilerOptions": {
4+
"allowJs": true,
5+
"outDir": "../../dist/out-tsc",
6+
"module": "commonjs",
7+
"types": ["cypress", "node"],
8+
"sourceMap": false
9+
},
10+
"include": [
11+
"**/*.ts",
12+
"**/*.js",
13+
"../cypress.config.ts",
14+
"../**/*.cy.ts",
15+
"../**/*.cy.tsx",
16+
"../**/*.cy.js",
17+
"../**/*.cy.jsx",
18+
"../**/*.d.ts"
19+
]
20+
}

‎apps/bundle-size/package.json

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"name": "bundle-size",
3+
"private": true,
4+
"version": "0.0.0",
5+
"devDependencies": {
6+
"@module-federation/core": "workspace:*",
7+
"@module-federation/runtime": "workspace:*",
8+
"@module-federation/typescript": "workspace:*",
9+
"@module-federation/enhanced": "workspace:*",
10+
"@module-federation/dts-plugin": "workspace:*",
11+
"@pmmmwh/react-refresh-webpack-plugin": "0.5.15",
12+
"react-refresh": "0.14.2"
13+
},
14+
"dependencies": {
15+
"antd": "4.24.15"
16+
}
17+
}

‎apps/bundle-size/project.json

+145
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
1+
{
2+
"name": "bundle-size",
3+
"$schema": "../../node_modules/nx/schemas/project-schema.json",
4+
"sourceRoot": "apps/bundle-size/src",
5+
"projectType": "application",
6+
"tags": [],
7+
"targets": {
8+
"build": {
9+
"executor": "@nx/webpack:webpack",
10+
"outputs": ["{options.outputPath}"],
11+
"defaultConfiguration": "production",
12+
"options": {
13+
"compiler": "babel",
14+
"outputPath": "apps/bundle-size/dist",
15+
"index": "apps/bundle-size/src/index.html",
16+
"baseHref": "/",
17+
"main": "apps/bundle-size/src/index.ts",
18+
"tsConfig": "apps/bundle-size/tsconfig.app.json",
19+
"styles": [],
20+
"scripts": [],
21+
"webpackConfig": "apps/bundle-size/webpack.config.js",
22+
"babelUpwardRootMode": true
23+
},
24+
"configurations": {
25+
"development": {
26+
"extractLicenses": false,
27+
"optimization": false,
28+
"sourceMap": true,
29+
"vendorChunk": true
30+
},
31+
"production": {
32+
"optimization": true,
33+
"outputHashing": "all",
34+
"sourceMap": false,
35+
"namedChunks": false,
36+
"extractLicenses": false,
37+
"vendorChunk": false
38+
}
39+
},
40+
"dependsOn": [
41+
{
42+
"target": "build",
43+
"dependencies": true
44+
}
45+
]
46+
},
47+
"serve": {
48+
"executor": "@nx/webpack:dev-server",
49+
"defaultConfiguration": "production",
50+
"options": {
51+
"buildTarget": "bundle-size:build",
52+
"hmr": true,
53+
"port": 3005,
54+
"devRemotes": ["3006-runtime-remote"]
55+
},
56+
"configurations": {
57+
"development": {
58+
"buildTarget": "bundle-size:build:development"
59+
},
60+
"production": {
61+
"buildTarget": "bundle-size:build:production",
62+
"hmr": false
63+
}
64+
},
65+
"dependsOn": [
66+
{
67+
"target": "build",
68+
"dependencies": true
69+
}
70+
]
71+
},
72+
"lint": {
73+
"executor": "@nx/eslint:lint",
74+
"outputs": ["{options.outputFile}"],
75+
"options": {
76+
"lintFilePatterns": ["apps/bundle-size/**/*.{ts,tsx,js,jsx}"]
77+
}
78+
},
79+
"serve-static": {
80+
"executor": "@nx/web:file-server",
81+
"defaultConfiguration": "development",
82+
"options": {
83+
"buildTarget": "bundle-size:build",
84+
"port": 3005
85+
},
86+
"configurations": {
87+
"development": {
88+
"buildTarget": "bundle-size:build:development"
89+
},
90+
"production": {
91+
"buildTarget": "bundle-size:build:production"
92+
}
93+
}
94+
},
95+
"e2e": {
96+
"executor": "@nx/cypress:cypress",
97+
"options": {
98+
"cypressConfig": "apps/bundle-size/cypress.config.ts",
99+
"testingType": "e2e",
100+
"baseUrl": "http://127.0.0.1:3005",
101+
"browser": "chrome"
102+
},
103+
"dependsOn": [
104+
{
105+
"target": "build",
106+
"dependencies": true
107+
}
108+
],
109+
"configurations": {
110+
"development": {
111+
"runnerUi": true,
112+
"browser": "electron",
113+
"exit": false,
114+
"watch": true
115+
}
116+
}
117+
},
118+
"test:e2e": {
119+
"executor": "nx:run-commands",
120+
"options": {
121+
"parallel": true,
122+
"commands": [
123+
{
124+
"command": "lsof -i :3005 || nx run bundle-size:serve",
125+
"forwardAllArgs": false
126+
},
127+
{
128+
"command": "sleep 4 && nx run bundle-size:e2e",
129+
"forwardAllArgs": true
130+
}
131+
]
132+
}
133+
},
134+
"getsize": {
135+
"executor": "nx:run-commands",
136+
"options": {
137+
"commands": [
138+
{
139+
"command": "npx nx build bundle-size --configuration=production && sleep 1 && if [ -f apps/bundle-size/dist/remoteEntry.js ]; then ls -lah apps/bundle-size/dist/remoteEntry.js | awk '{print \"remoteEntry.js size: \" $5}' && gzip -c apps/bundle-size/dist/remoteEntry.js | wc -c | awk '{print \"gzip size: \" $1 \" bytes\"}' && brotli -c apps/bundle-size/dist/remoteEntry.js | wc -c | awk '{print \"brotli size: \" $1 \" bytes\"}'; else echo \"remoteEntry.js not found\"; fi"
140+
}
141+
]
142+
}
143+
}
144+
}
145+
}

0 commit comments

Comments
 (0)