Skip to content

Commit 790d0e4

Browse files
manfredsteyermanfredsteyer
committed
add share helper
1 parent 02399a6 commit 790d0e4

File tree

16 files changed

+366
-47
lines changed

16 files changed

+366
-47
lines changed

‎.vscode/settings.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"spellright.language": [
3+
"en"
4+
],
5+
"spellright.documentTypes": [
6+
"markdown",
7+
"latex",
8+
"plaintext"
9+
]
10+
}

‎libs/mf-runtime/LICENSE

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
Copyright 2021 Softarc Consulting GmbH
2+
3+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
4+
5+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
6+
7+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
8+

‎libs/mf-runtime/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "@angular-architects/module-federation-runtime",
33

44
"license": "MIT",
5-
"version": "12.1.1",
5+
"version": "12.2.0",
66
"peerDependencies": {
77
"@angular/common": ">=12.0.0",
88
"@angular/core": ">=12.0.0"

‎libs/mf-tools/LICENSE

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
Copyright 2021 Softarc Consulting GmbH
2+
3+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
4+
5+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
6+
7+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
8+

‎libs/mf-tools/package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"name": "@angular-architects/module-federation-tools",
3-
"version": "12.0.0",
3+
"version": "12.2.0",
4+
"license": "MIT",
45
"peerDependencies": {
56
"@angular/common": ">=11.0.0",
67
"@angular/core": ">=11.0.0",

‎libs/mf/LICENSE

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
Copyright 2021 Softarc Consulting GmbH
2+
3+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
4+
5+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
6+
7+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
8+

‎libs/mf/README.md

Lines changed: 108 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -203,8 +203,116 @@ plugins: [
203203
],
204204
```
205205

206+
### Share Helper
207+
208+
The helper function share adds some additional options for the shared dependencies:
209+
210+
```json
211+
shared: share({
212+
"@angular/common": {
213+
singleton: true,
214+
strictVersion: true,
215+
requireVersion: 'auto',
216+
includeSecondaries: true
217+
},
218+
[...]
219+
})
220+
```
221+
222+
The added options are ``requireVersion: 'auto'`` and ``includeSecondaries``.
223+
224+
#### requireVersion: 'auto'
225+
226+
If you set ``requireVersion`` to ``'auto'``, the helper takes the version defined in your ``package.json``.
227+
228+
This helps to solve issues with not (fully) met peer dependencies and secondary entry points (see Pitfalls section below).
229+
230+
By default, it takes the ``package.json`` that is closest to the caller (normally the ``webpack.config.js``). However, you can pass the path to an other ``package.json`` using the second optional parameter. Also, you need to define the shared libray within the node dependencies in your ``package.json``.
231+
232+
Instead of setting requireVersion to auto time and again, you can also skip this option and call ``setInferVersion(true)`` before:
233+
234+
```typescript
235+
setInferVersion(true);
236+
```
237+
238+
#### includeSecondaries
239+
240+
If set to ``true``, all secondary entry points are added too. In the case of ``@angular/common`` this is also ``@angular/common/http``, ``@angular/common/http/testing``, ``@angular/common/testing``, ``@angular/common/http/upgrade``, and ``@angular/common/locales``. This exhaustive list shows that using this option for ``@angular/common`` is not the best idea because normally, you don't need most of them.
241+
242+
However, this option can come in handy for quick experiments or if you want to quickly share a package like ``@angular/material`` that comes with a myriad of secondary entry points.
243+
244+
Even if you share too much, Module Federation will only load the needed ones at runtime. However, please keep in mind that shared packages can not be tree-shaken.
245+
246+
To skip some secondary entry points, you can assign a configuration option instead of ``true``:
247+
248+
```typescript
249+
shared: share({
250+
"@angular/common": {
251+
singleton: true,
252+
strictVersion: true,
253+
requireVersion: 'auto',
254+
includeSecondaries: {
255+
skip: ['@angular/http/testing']
256+
}
257+
},
258+
[...]
259+
})
260+
```
261+
262+
#### shareAll
263+
264+
The ``shareAll`` helper shares all your dependencies defined in your ``package.json``. The ``package.json`` is look up as described above:
265+
266+
```json
267+
shared: {
268+
...shareAll({
269+
singleton: true,
270+
strictVersion: true,
271+
requiredVersion: 'auto'
272+
}),
273+
...sharedMappings.getDescriptors()
274+
}
275+
```
276+
277+
The options passed to shareAll are applied to all dependencies found in your ``package.json``.
278+
279+
This might come in handy in an monorepo scenario and when doing some experiments/ trouble shooting.
280+
281+
206282
### Pitfalls when sharing libraries of a Monorepo
207283

284+
#### Warning: No required version specified
285+
286+
If you get the warning _No required version specified and unable to automatically determine one_, Module Federation needs some help with finding out the version of a shared library to use. Reasons are not fitting peer dependencies or using secondary entry points like ``@angular/common/http``.
287+
288+
To avoid this warning you can specify to used version by hand:
289+
290+
```json
291+
shared: {
292+
"@angular/common": {
293+
singleton: true,
294+
strictVersion: true,
295+
requireVersion: '12.0.0
296+
},
297+
[...]
298+
},
299+
```
300+
301+
You can also use our ``share`` helper that infers the version number from your ``package.json`` when setting ``requireVersion`` to ``'auto'``:
302+
303+
```json
304+
shared: share({
305+
"@angular/common": {
306+
singleton: true,
307+
strictVersion: true,
308+
requireVersion: 'auto'
309+
},
310+
[...]
311+
})
312+
```
313+
314+
315+
208316
#### Not exported Components
209317

210318
If you use a shared component without exporting it via your library's barrel (``index.ts`` or ``public-api.ts``), you get the following error at runtime:

‎libs/mf/package.json

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@angular-architects/module-federation",
3-
"version": "12.1.1",
3+
"version": "12.2.0",
44
"license": "MIT",
55
"repository": {
66
"type": "GitHub",
@@ -18,7 +18,8 @@
1818
"builders": "./builders.json",
1919
"dependencies": {
2020
"ngx-build-plus": "^12.0.0",
21-
"@angular-architects/module-federation-runtime": "^12.1.1",
22-
"word-wrap": "^1.2.3"
21+
"@angular-architects/module-federation-runtime": "^12.2.0",
22+
"word-wrap": "^1.2.3",
23+
"callsite": "^1.0.0"
2324
}
2425
}

‎libs/mf/src/schematics/mf/schematic.ts

Lines changed: 32 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -7,44 +7,44 @@ import {
77

88
import { strings } from '@angular-devkit/core';
99

10-
import { spawn } from 'cross-spawn';
10+
// import { spawn } from 'cross-spawn';
1111
import * as path from 'path';
1212

1313
import { createConfig } from '../../utils/create-config';
1414
import { prodConfig } from './prod-config';
1515
import { MfSchematicSchema } from './schema';
1616

17-
export async function npmInstall(packageName: string) {
18-
await new Promise<boolean>((resolve) => {
19-
console.log('Installing packages...');
20-
spawn('npm', ['install', packageName, '-D'])
21-
.on('close', (code: number) => {
22-
if (code === 0) {
23-
console.log('Packages installed successfully ✅');
24-
resolve(true);
25-
} else {
26-
throw new Error(
27-
`Error installing '${packageName}'`
28-
);
29-
}
30-
});
31-
});
32-
}
33-
34-
export async function yarnAdd(packageName: string) {
35-
await new Promise<boolean>((resolve) => {
36-
spawn('npm', ['install', packageName, '-D'])
37-
.on('close', (code: number) => {
38-
if (code === 0) {
39-
resolve(true);
40-
} else {
41-
throw new Error(
42-
`Error installing '${packageName}'`
43-
);
44-
}
45-
});
46-
});
47-
}
17+
// export async function npmInstall(packageName: string) {
18+
// await new Promise<boolean>((resolve) => {
19+
// console.log('Installing packages...');
20+
// spawn('npm', ['install', packageName, '-D'])
21+
// .on('close', (code: number) => {
22+
// if (code === 0) {
23+
// console.log('Packages installed successfully ✅');
24+
// resolve(true);
25+
// } else {
26+
// throw new Error(
27+
// `Error installing '${packageName}'`
28+
// );
29+
// }
30+
// });
31+
// });
32+
// }
33+
34+
// export async function yarnAdd(packageName: string) {
35+
// await new Promise<boolean>((resolve) => {
36+
// spawn('npm', ['install', packageName, '-D'])
37+
// .on('close', (code: number) => {
38+
// if (code === 0) {
39+
// resolve(true);
40+
// } else {
41+
// throw new Error(
42+
// `Error installing '${packageName}'`
43+
// );
44+
// }
45+
// });
46+
// });
47+
// }
4848

4949
export function add(options: MfSchematicSchema): Rule {
5050
return config(options);

‎libs/mf/src/utils/create-config.ts

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ export function createConfig(projectName: string, remotes: string, tsConfigName:
55
return `const ModuleFederationPlugin = require("webpack/lib/container/ModuleFederationPlugin");
66
const mf = require("@angular-architects/module-federation/webpack");
77
const path = require("path");
8+
const share = mf.share;
89
910
const sharedMappings = new mf.SharedMappings();
1011
sharedMappings.register(
@@ -39,14 +40,14 @@ module.exports = {
3940
${remotes}
4041
// },
4142
42-
shared: {
43-
"@angular/core": { singleton: true, strictVersion: true },
44-
"@angular/common": { singleton: true, strictVersion: true },
45-
"@angular/common/http": { singleton: true, strictVersion: true },
46-
"@angular/router": { singleton: true, strictVersion: true },
43+
shared: share({
44+
"@angular/core": { singleton: true, strictVersion: true, requiredVersion: 'auto' },
45+
"@angular/common": { singleton: true, strictVersion: true, requiredVersion: 'auto' },
46+
"@angular/common/http": { singleton: true, strictVersion: true, requiredVersion: 'auto' },
47+
"@angular/router": { singleton: true, strictVersion: true, requiredVersion: 'auto' },
4748
4849
...sharedMappings.getDescriptors()
49-
}
50+
})
5051
5152
}),
5253
sharedMappings.getPlugin()

0 commit comments

Comments
 (0)