@module-federation/utilities 1.2.0 → 1.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/CHANGELOG.md +33 -95
  2. package/README.md +27 -5
  3. package/package.json +7 -6
  4. package/src/Logger.d.ts +1 -1
  5. package/src/components/ErrorBoundary.d.ts +19 -0
  6. package/src/components/ErrorBoundary.js +34 -0
  7. package/src/components/ErrorBoundary.js.map +1 -0
  8. package/src/components/FederationBoundary.d.ts +14 -0
  9. package/src/components/FederationBoundary.js +33 -0
  10. package/src/components/FederationBoundary.js.map +1 -0
  11. package/src/types/index.d.ts +23 -23
  12. package/src/utils/importRemote.d.ts +1 -1
  13. package/src/utils/react.d.ts +1 -10
  14. package/src/utils/react.js +5 -38
  15. package/src/utils/react.js.map +1 -1
package/CHANGELOG.md CHANGED
@@ -2,81 +2,67 @@
2
2
 
3
3
  This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
4
4
 
5
- # [1.2.0](https://github.com/module-federation/nextjs-mf/compare/utils-1.1.2...utils-1.2.0) (2023-01-31)
5
+ ## [1.2.1](https://github.com/module-federation/nextjs-mf/compare/utils-1.2.0...utils-1.2.1) (2023-02-09)
6
6
 
7
7
 
8
8
  ### Bug Fixes
9
9
 
10
- * **typescript:** throw error when `vue-tsc` is requested and is not available ([#547](https://github.com/module-federation/nextjs-mf/issues/547)) ([c6f7998](https://github.com/module-federation/nextjs-mf/commit/c6f79981f84fd0042447037c1323fa750566ac0d))
11
-
10
+ * **federation-boundary:** make custom boundary optional ([#570](https://github.com/module-federation/nextjs-mf/issues/570)) ([e43a387](https://github.com/module-federation/nextjs-mf/commit/e43a387f90587d62a78c40584ed9104328202f8e))
11
+ * **utilities:** fix FederationBoundary implementation ([#575](https://github.com/module-federation/nextjs-mf/issues/575)) ([b94fc28](https://github.com/module-federation/nextjs-mf/commit/b94fc282503c4f5ce2ae267518f7d6f5d4746c24))
12
12
 
13
- ### Features
14
13
 
15
- * add getModule and getContainer to utilities ([#476](https://github.com/module-federation/nextjs-mf/issues/476)) ([fe381e3](https://github.com/module-federation/nextjs-mf/commit/fe381e33cfb20b3b723daffca2f5c4fb4b843cfb))
16
- * **typescript:** support vue typescript compiler ([#542](https://github.com/module-federation/nextjs-mf/issues/542)) ([cde5952](https://github.com/module-federation/nextjs-mf/commit/cde5952c42ec19f87c5bc4dddb8d8be6f97c1c55)), closes [#502](https://github.com/module-federation/nextjs-mf/issues/502)
17
14
 
15
+ # [1.2.0](https://github.com/module-federation/nextjs-mf/compare/utils-1.1.2...utils-1.2.0) (2023-01-31)
18
16
 
17
+ ### Bug Fixes
19
18
 
20
- ## [1.1.2](https://github.com/module-federation/nextjs-mf/compare/utils-1.1.1...utils-1.1.2) (2023-01-21)
19
+ - **typescript:** throw error when `vue-tsc` is requested and is not available ([#547](https://github.com/module-federation/nextjs-mf/issues/547)) ([c6f7998](https://github.com/module-federation/nextjs-mf/commit/c6f79981f84fd0042447037c1323fa750566ac0d))
21
20
 
21
+ ### Features
22
22
 
23
- ### Bug Fixes
23
+ - add getModule and getContainer to utilities ([#476](https://github.com/module-federation/nextjs-mf/issues/476)) ([fe381e3](https://github.com/module-federation/nextjs-mf/commit/fe381e33cfb20b3b723daffca2f5c4fb4b843cfb))
24
+ - **typescript:** support vue typescript compiler ([#542](https://github.com/module-federation/nextjs-mf/issues/542)) ([cde5952](https://github.com/module-federation/nextjs-mf/commit/cde5952c42ec19f87c5bc4dddb8d8be6f97c1c55)), closes [#502](https://github.com/module-federation/nextjs-mf/issues/502)
24
25
 
25
- * Utilities - Remove module side effect ([#488](https://github.com/module-federation/nextjs-mf/issues/488)) ([3554de7](https://github.com/module-federation/nextjs-mf/commit/3554de7912eaf7b379a6a863677c4b01da0ccf2c)), closes [#487](https://github.com/module-federation/nextjs-mf/issues/487) [#500](https://github.com/module-federation/nextjs-mf/issues/500) [#496](https://github.com/module-federation/nextjs-mf/issues/496) [#495](https://github.com/module-federation/nextjs-mf/issues/495) [#492](https://github.com/module-federation/nextjs-mf/issues/492) [#455](https://github.com/module-federation/nextjs-mf/issues/455) [#491](https://github.com/module-federation/nextjs-mf/issues/491) [#496](https://github.com/module-federation/nextjs-mf/issues/496) [#495](https://github.com/module-federation/nextjs-mf/issues/495)
26
+ ## [1.1.2](https://github.com/module-federation/nextjs-mf/compare/utils-1.1.1...utils-1.1.2) (2023-01-21)
26
27
 
28
+ ### Bug Fixes
27
29
 
30
+ - Utilities - Remove module side effect ([#488](https://github.com/module-federation/nextjs-mf/issues/488)) ([3554de7](https://github.com/module-federation/nextjs-mf/commit/3554de7912eaf7b379a6a863677c4b01da0ccf2c)), closes [#487](https://github.com/module-federation/nextjs-mf/issues/487) [#500](https://github.com/module-federation/nextjs-mf/issues/500) [#496](https://github.com/module-federation/nextjs-mf/issues/496) [#495](https://github.com/module-federation/nextjs-mf/issues/495) [#492](https://github.com/module-federation/nextjs-mf/issues/492) [#455](https://github.com/module-federation/nextjs-mf/issues/455) [#491](https://github.com/module-federation/nextjs-mf/issues/491) [#496](https://github.com/module-federation/nextjs-mf/issues/496) [#495](https://github.com/module-federation/nextjs-mf/issues/495)
28
31
 
29
32
  ## [1.1.1](https://github.com/module-federation/nextjs-mf/compare/utils-1.1.0...utils-1.1.1) (2023-01-11)
30
33
 
31
-
32
-
33
34
  # [1.1.0](https://github.com/module-federation/nextjs-mf/compare/utils-1.0.4...utils-1.1.0) (2022-12-30)
34
35
 
35
-
36
36
  ### Bug Fixes
37
37
 
38
- * **utilities:** move tslib from peer deps into deps ([#474](https://github.com/module-federation/nextjs-mf/issues/474)) ([792806c](https://github.com/module-federation/nextjs-mf/commit/792806c805c746cd681d6345bec88a47462cb26f))
39
- * **utilities:** set webpack peer dep to ^5.40.0 ([#473](https://github.com/module-federation/nextjs-mf/issues/473)) ([d1ae77e](https://github.com/module-federation/nextjs-mf/commit/d1ae77e63993b6f67d329bce5a30d04776a02b76))
40
-
38
+ - **utilities:** move tslib from peer deps into deps ([#474](https://github.com/module-federation/nextjs-mf/issues/474)) ([792806c](https://github.com/module-federation/nextjs-mf/commit/792806c805c746cd681d6345bec88a47462cb26f))
39
+ - **utilities:** set webpack peer dep to ^5.40.0 ([#473](https://github.com/module-federation/nextjs-mf/issues/473)) ([d1ae77e](https://github.com/module-federation/nextjs-mf/commit/d1ae77e63993b6f67d329bce5a30d04776a02b76))
41
40
 
42
41
  ### Features
43
42
 
44
- * Utilities - Add async callback to importRemote ([#459](https://github.com/module-federation/nextjs-mf/issues/459)) ([508d83c](https://github.com/module-federation/nextjs-mf/commit/508d83ca1060e1fcc80cde44978b186bdf1feefc)), closes [#461](https://github.com/module-federation/nextjs-mf/issues/461) [#451](https://github.com/module-federation/nextjs-mf/issues/451) [#463](https://github.com/module-federation/nextjs-mf/issues/463)
45
-
46
-
43
+ - Utilities - Add async callback to importRemote ([#459](https://github.com/module-federation/nextjs-mf/issues/459)) ([508d83c](https://github.com/module-federation/nextjs-mf/commit/508d83ca1060e1fcc80cde44978b186bdf1feefc)), closes [#461](https://github.com/module-federation/nextjs-mf/issues/461) [#451](https://github.com/module-federation/nextjs-mf/issues/451) [#463](https://github.com/module-federation/nextjs-mf/issues/463)
47
44
 
48
45
  ## [1.0.4](https://github.com/module-federation/nextjs-mf/compare/utils-1.0.3...utils-1.0.4) (2022-12-29)
49
46
 
50
-
51
-
52
47
  ## [1.0.3](https://github.com/module-federation/nextjs-mf/compare/utils-1.0.2...utils-1.0.3) (2022-12-27)
53
48
 
54
-
55
49
  ### Bug Fixes
56
50
 
57
- * bad references to webpack globals ([#458](https://github.com/module-federation/nextjs-mf/issues/458)) ([8ef224b](https://github.com/module-federation/nextjs-mf/commit/8ef224bd08f1e39475cac3795f09debae50bbc0f))
58
-
59
-
51
+ - bad references to webpack globals ([#458](https://github.com/module-federation/nextjs-mf/issues/458)) ([8ef224b](https://github.com/module-federation/nextjs-mf/commit/8ef224bd08f1e39475cac3795f09debae50bbc0f))
60
52
 
61
53
  ## [1.0.2](https://github.com/module-federation/nextjs-mf/compare/utils-1.0.1...utils-1.0.2) (2022-12-27)
62
54
 
63
-
64
-
65
55
  ## [1.0.1](https://github.com/module-federation/nextjs-mf/compare/utils-1.0.0...utils-1.0.1) (2022-11-20)
66
56
 
67
-
68
-
69
57
  # [1.0.0](https://github.com/module-federation/nextjs-mf/compare/utils-0.5.0...utils-1.0.0) (2022-11-20)
70
58
 
71
-
72
59
  ### Features
73
60
 
74
- * **typescript:** excessive recompilation prevention ([#306](https://github.com/module-federation/nextjs-mf/issues/306)) ([6e1967f](https://github.com/module-federation/nextjs-mf/commit/6e1967f019afb25dfbcfe83627b08ae8b1fe97b2))
75
-
61
+ - **typescript:** excessive recompilation prevention ([#306](https://github.com/module-federation/nextjs-mf/issues/306)) ([6e1967f](https://github.com/module-federation/nextjs-mf/commit/6e1967f019afb25dfbcfe83627b08ae8b1fe97b2))
76
62
 
77
63
  ### BREAKING CHANGES
78
64
 
79
- * **typescript:** Reimplemented the whole plugin from round-up to enhance performance, prevent excessive recompilation and other issues.
65
+ - **typescript:** Reimplemented the whole plugin from round-up to enhance performance, prevent excessive recompilation and other issues.
80
66
 
81
67
  Some key changes to the plugin includes:
82
68
 
@@ -86,19 +72,15 @@ Some key changes to the plugin includes:
86
72
 
87
73
  Please go through plugin `readme.md` file to understand what's changed and how to use the plugin.
88
74
 
89
-
90
-
91
75
  # [1.0.0](https://github.com/module-federation/nextjs-mf/compare/utils-0.5.0...utils-1.0.0) (2022-11-20)
92
76
 
93
-
94
77
  ### Features
95
78
 
96
- * **typescript:** excessive recompilation prevention ([#306](https://github.com/module-federation/nextjs-mf/issues/306)) ([6e1967f](https://github.com/module-federation/nextjs-mf/commit/6e1967f019afb25dfbcfe83627b08ae8b1fe97b2))
97
-
79
+ - **typescript:** excessive recompilation prevention ([#306](https://github.com/module-federation/nextjs-mf/issues/306)) ([6e1967f](https://github.com/module-federation/nextjs-mf/commit/6e1967f019afb25dfbcfe83627b08ae8b1fe97b2))
98
80
 
99
81
  ### BREAKING CHANGES
100
82
 
101
- * **typescript:** Reimplemented the whole plugin from round-up to enhance performance, prevent excessive recompilation and other issues.
83
+ - **typescript:** Reimplemented the whole plugin from round-up to enhance performance, prevent excessive recompilation and other issues.
102
84
 
103
85
  Some key changes to the plugin includes:
104
86
 
@@ -108,125 +90,81 @@ Some key changes to the plugin includes:
108
90
 
109
91
  Please go through plugin `readme.md` file to understand what's changed and how to use the plugin.
110
92
 
111
-
112
-
113
93
  # [0.5.0](https://github.com/module-federation/nextjs-mf/compare/utils-0.4.1...utils-0.5.0) (2022-10-31)
114
94
 
115
-
116
95
  ### Features
117
96
 
118
- * **utils:** configurable logger using webpack infrastructure logger ([#355](https://github.com/module-federation/nextjs-mf/issues/355)) ([d6ffcd0](https://github.com/module-federation/nextjs-mf/commit/d6ffcd0de1662c410f33a7742db1fd02aba24aef)), closes [#243](https://github.com/module-federation/nextjs-mf/issues/243)
119
-
120
-
97
+ - **utils:** configurable logger using webpack infrastructure logger ([#355](https://github.com/module-federation/nextjs-mf/issues/355)) ([d6ffcd0](https://github.com/module-federation/nextjs-mf/commit/d6ffcd0de1662c410f33a7742db1fd02aba24aef)), closes [#243](https://github.com/module-federation/nextjs-mf/issues/243)
121
98
 
122
99
  ## [0.4.1](https://github.com/module-federation/nextjs-mf/compare/utils-0.4.0...utils-0.4.1) (2022-10-26)
123
100
 
124
-
125
101
  ### Bug Fixes
126
102
 
127
- * set peer dependencies ([#341](https://github.com/module-federation/nextjs-mf/issues/341)) ([fec9608](https://github.com/module-federation/nextjs-mf/commit/fec960813a4e3859a5fb24863bb55e463a2fdfa3))
128
-
129
-
103
+ - set peer dependencies ([#341](https://github.com/module-federation/nextjs-mf/issues/341)) ([fec9608](https://github.com/module-federation/nextjs-mf/commit/fec960813a4e3859a5fb24863bb55e463a2fdfa3))
130
104
 
131
105
  # [0.4.0](https://github.com/module-federation/nextjs-mf/compare/utils-0.3.4...utils-0.4.0) (2022-10-26)
132
106
 
133
-
134
107
  ### Features
135
108
 
136
- * Automatic Async boundary loader ([#330](https://github.com/module-federation/nextjs-mf/issues/330)) ([7e3c08c](https://github.com/module-federation/nextjs-mf/commit/7e3c08cf7835c0407bdce7ed6865b864153074a4))
137
-
138
-
109
+ - Automatic Async boundary loader ([#330](https://github.com/module-federation/nextjs-mf/issues/330)) ([7e3c08c](https://github.com/module-federation/nextjs-mf/commit/7e3c08cf7835c0407bdce7ed6865b864153074a4))
139
110
 
140
111
  ## [0.3.4](https://github.com/module-federation/nextjs-mf/compare/utils-0.3.3...utils-0.3.4) (2022-10-17)
141
112
 
142
-
143
113
  ### Bug Fixes
144
114
 
145
- * remove exports field from package.json ([#318](https://github.com/module-federation/nextjs-mf/issues/318)) ([a9148ae](https://github.com/module-federation/nextjs-mf/commit/a9148ae27f1c05fe4c1586ed5769c79054a7033e))
146
-
147
-
115
+ - remove exports field from package.json ([#318](https://github.com/module-federation/nextjs-mf/issues/318)) ([a9148ae](https://github.com/module-federation/nextjs-mf/commit/a9148ae27f1c05fe4c1586ed5769c79054a7033e))
148
116
 
149
117
  ## [0.3.3](https://github.com/module-federation/nextjs-mf/compare/utils-0.3.2...utils-0.3.3) (2022-10-13)
150
118
 
151
-
152
119
  ### Bug Fixes
153
120
 
154
- * **typescript:** fix exposePages type ([#309](https://github.com/module-federation/nextjs-mf/issues/309)) ([c0be839](https://github.com/module-federation/nextjs-mf/commit/c0be839787f97c5e23cea3d7cf501caaa469972f))
155
-
156
-
121
+ - **typescript:** fix exposePages type ([#309](https://github.com/module-federation/nextjs-mf/issues/309)) ([c0be839](https://github.com/module-federation/nextjs-mf/commit/c0be839787f97c5e23cea3d7cf501caaa469972f))
157
122
 
158
123
  ## [0.3.2](https://github.com/module-federation/nextjs-mf/compare/utils-0.3.1...utils-0.3.2) (2022-10-12)
159
124
 
160
-
161
-
162
125
  ## [0.3.1](https://github.com/module-federation/nextjs-mf/compare/utils-0.3.0...utils-0.3.1) (2022-10-11)
163
126
 
164
-
165
-
166
127
  # [0.3.0](https://github.com/module-federation/nextjs-mf/compare/utils-0.2.1...utils-0.3.0) (2022-10-07)
167
128
 
168
-
169
129
  ### Features
170
130
 
171
- * implement __webpack_require__.l functionality in server builds ([99d1231](https://github.com/module-federation/nextjs-mf/commit/99d12314f68ac526000fa5410a14072a11b260a4))
172
-
173
-
131
+ - implement **webpack_require**.l functionality in server builds ([99d1231](https://github.com/module-federation/nextjs-mf/commit/99d12314f68ac526000fa5410a14072a11b260a4))
174
132
 
175
133
  ## [0.2.1](https://github.com/module-federation/nextjs-mf/compare/utils-0.2.0...utils-0.2.1) (2022-10-07)
176
134
 
177
-
178
135
  ### Bug Fixes
179
136
 
180
- * fix node plugin fs augments when outside next child compiler ([#284](https://github.com/module-federation/nextjs-mf/issues/284)) ([dfa99c8](https://github.com/module-federation/nextjs-mf/commit/dfa99c86fdd8d73091764532d52be5f81b89a508))
181
- * **package.json:** fix package export fields for utils ([#285](https://github.com/module-federation/nextjs-mf/issues/285)) ([99d6b77](https://github.com/module-federation/nextjs-mf/commit/99d6b779696b5dbebea9cf3c870a5caa5d9d7c6f))
182
-
183
-
137
+ - fix node plugin fs augments when outside next child compiler ([#284](https://github.com/module-federation/nextjs-mf/issues/284)) ([dfa99c8](https://github.com/module-federation/nextjs-mf/commit/dfa99c86fdd8d73091764532d52be5f81b89a508))
138
+ - **package.json:** fix package export fields for utils ([#285](https://github.com/module-federation/nextjs-mf/issues/285)) ([99d6b77](https://github.com/module-federation/nextjs-mf/commit/99d6b779696b5dbebea9cf3c870a5caa5d9d7c6f))
184
139
 
185
140
  ## [0.2.1](https://github.com/module-federation/nextjs-mf/compare/utils-0.2.0...utils-0.2.1) (2022-10-07)
186
141
 
187
-
188
142
  ### Bug Fixes
189
143
 
190
- * fix node plugin fs augments when outside next child compiler ([#284](https://github.com/module-federation/nextjs-mf/issues/284)) ([dfa99c8](https://github.com/module-federation/nextjs-mf/commit/dfa99c86fdd8d73091764532d52be5f81b89a508))
191
- * **package.json:** fix package export fields for utils ([#285](https://github.com/module-federation/nextjs-mf/issues/285)) ([99d6b77](https://github.com/module-federation/nextjs-mf/commit/99d6b779696b5dbebea9cf3c870a5caa5d9d7c6f))
192
-
193
-
144
+ - fix node plugin fs augments when outside next child compiler ([#284](https://github.com/module-federation/nextjs-mf/issues/284)) ([dfa99c8](https://github.com/module-federation/nextjs-mf/commit/dfa99c86fdd8d73091764532d52be5f81b89a508))
145
+ - **package.json:** fix package export fields for utils ([#285](https://github.com/module-federation/nextjs-mf/issues/285)) ([99d6b77](https://github.com/module-federation/nextjs-mf/commit/99d6b779696b5dbebea9cf3c870a5caa5d9d7c6f))
194
146
 
195
147
  ## [0.2.1](https://github.com/module-federation/nextjs-mf/compare/utils-0.2.0...utils-0.2.1) (2022-10-06)
196
148
 
197
-
198
149
  ### Bug Fixes
199
150
 
200
- * fix node plugin fs augments when outside next child compiler ([#284](https://github.com/module-federation/nextjs-mf/issues/284)) ([dfa99c8](https://github.com/module-federation/nextjs-mf/commit/dfa99c86fdd8d73091764532d52be5f81b89a508))
201
- * **package.json:** fix package export fields for utils ([#285](https://github.com/module-federation/nextjs-mf/issues/285)) ([99d6b77](https://github.com/module-federation/nextjs-mf/commit/99d6b779696b5dbebea9cf3c870a5caa5d9d7c6f))
202
-
203
-
151
+ - fix node plugin fs augments when outside next child compiler ([#284](https://github.com/module-federation/nextjs-mf/issues/284)) ([dfa99c8](https://github.com/module-federation/nextjs-mf/commit/dfa99c86fdd8d73091764532d52be5f81b89a508))
152
+ - **package.json:** fix package export fields for utils ([#285](https://github.com/module-federation/nextjs-mf/issues/285)) ([99d6b77](https://github.com/module-federation/nextjs-mf/commit/99d6b779696b5dbebea9cf3c870a5caa5d9d7c6f))
204
153
 
205
154
  ## [0.2.1](https://github.com/module-federation/nextjs-mf/compare/utils-0.2.0...utils-0.2.1) (2022-10-06)
206
155
 
207
-
208
156
  ### Bug Fixes
209
157
 
210
- * fix node plugin fs augments when outside next child compiler ([#284](https://github.com/module-federation/nextjs-mf/issues/284)) ([dfa99c8](https://github.com/module-federation/nextjs-mf/commit/dfa99c86fdd8d73091764532d52be5f81b89a508))
211
-
212
-
158
+ - fix node plugin fs augments when outside next child compiler ([#284](https://github.com/module-federation/nextjs-mf/issues/284)) ([dfa99c8](https://github.com/module-federation/nextjs-mf/commit/dfa99c86fdd8d73091764532d52be5f81b89a508))
213
159
 
214
160
  # [0.2.0](https://github.com/module-federation/nextjs-mf/compare/utils-0.1.0...utils-0.2.0) (2022-10-06)
215
161
 
216
-
217
-
218
162
  ## [0.1.1](https://github.com/module-federation/nextjs-mf/compare/utils-0.1.0...utils-0.1.1) (2022-10-06)
219
163
 
220
-
221
-
222
164
  ## [0.1.1](https://github.com/module-federation/nextjs-mf/compare/utils-0.1.0...utils-0.1.1) (2022-10-06)
223
165
 
224
-
225
-
226
166
  ## [0.1.1](https://github.com/module-federation/nextjs-mf/compare/utils-0.1.0...utils-0.1.1) (2022-10-06)
227
167
 
228
-
229
-
230
168
  ## [0.1.1](https://github.com/module-federation/nextjs-mf/compare/utils-0.1.0...utils-0.1.1) (2022-10-06)
231
169
 
232
170
  # [0.2.0](https://github.com/module-federation/nextjs-mf/compare/utils-0.1.0...utils-0.2.0) (2022-10-05)
package/README.md CHANGED
@@ -25,15 +25,19 @@ Any extra props will be passed directly to the imported module.
25
25
  Usage looks something like this:
26
26
 
27
27
  ```js
28
- import { FederationBoundary } from '@module-federation/utilities/src/react';
28
+ import { FederationBoundary } from '@module-federation/utilities/src/utils/react';
29
+
30
+ // defining dynamicImport and fallback outside the Component to keep the component identity
31
+ // another alternative would be to use useMemo
32
+ const dynamicImport = () =>
33
+ import('some_remote_host_name').then((m) => m.Component);
34
+ const fallback = () => import('@npm/backup').then((m) => m.Component);
29
35
 
30
36
  const MyPage = () => {
31
37
  return (
32
38
  <FederationBoundary
33
- dynamicImport={() =>
34
- import('some_remote_host_name').then((m) => m.Component)
35
- }
36
- fallback={() => import('@npm/backup').then((m) => m.Component)}
39
+ dynamicImporter={dynamicImport}
40
+ fallback={fallback}
37
41
  customBoundary={CustomErrorBoundary}
38
42
  />
39
43
  );
@@ -114,6 +118,24 @@ return (
114
118
  );
115
119
  ```
116
120
 
121
+ ```js
122
+ // You can also combine importRemote and FederationBoundary to have a dynamic remote URL and a fallback when there is an error on the remote
123
+
124
+ const dynamicImporter = () =>
125
+ importRemote({
126
+ url: 'http://localhost:3001',
127
+ scope: 'Foo',
128
+ module: 'Bar',
129
+ });
130
+ const fallback = () => import('@npm/backup').then((m) => m.Component);
131
+
132
+ const Bar = () => {
133
+ return (
134
+ <FederationBoundary dynamicImporter={dynamicImporter} fallback={fallback} />
135
+ );
136
+ };
137
+ ```
138
+
117
139
  Apart from **url**, **scope** and **module** you can also pass additional options to the **importRemote()** function:
118
140
 
119
141
  - **remoteEntryFileName**: The name of the remote entry file. Defaults to "remoteEntry.js".
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@module-federation/utilities",
3
- "version": "1.2.0",
3
+ "version": "1.2.1",
4
4
  "type": "commonjs",
5
5
  "main": "src/index.js",
6
6
  "types": "src/index.d.ts",
@@ -14,14 +14,15 @@
14
14
  "next": "^12 || ^13"
15
15
  },
16
16
  "devDependencies": {
17
- "react": "18.2.0",
18
- "next": "13.1.6"
17
+ "next": "13.1.6",
18
+ "react": "18.2.0"
19
19
  },
20
20
  "peerDependencies": {
21
- "webpack": "^5.40.0",
22
- "next": "13.1.6"
21
+ "next": "13.1.6",
22
+ "webpack": "^5.40.0"
23
23
  },
24
24
  "dependencies": {
25
- "tslib": "2.4.0"
25
+ "react": "18.2.0",
26
+ "react-dom": "18.2.0"
26
27
  }
27
28
  }
package/src/Logger.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { Compilation } from 'webpack';
2
- export declare type LoggerInstance = Compilation['logger'] | Console;
2
+ export type LoggerInstance = Compilation['logger'] | Console;
3
3
  export declare class Logger {
4
4
  private static loggerInstance;
5
5
  static getLogger(): LoggerInstance;
package/src/components/ErrorBoundary.d.ts ADDED
@@ -0,0 +1,19 @@
1
+ import React, { type ErrorInfo } from 'react';
2
+ export interface ErrorBoundaryProps {
3
+ children: React.ReactNode;
4
+ }
5
+ export interface ErrorBoundaryState {
6
+ hasError: boolean;
7
+ }
8
+ /**
9
+ * Generic error boundary component.
10
+ */
11
+ declare class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
12
+ constructor(props: ErrorBoundaryProps);
13
+ static getDerivedStateFromError(): {
14
+ hasError: boolean;
15
+ };
16
+ componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
17
+ render(): React.ReactNode;
18
+ }
19
+ export default ErrorBoundary;
package/src/components/ErrorBoundary.js ADDED
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ var tslib_1 = require("tslib");
4
+ var react_1 = tslib_1.__importDefault(require("react"));
5
+ /**
6
+ * Generic error boundary component.
7
+ */
8
+ var ErrorBoundary = /** @class */ (function (_super) {
9
+ tslib_1.__extends(ErrorBoundary, _super);
10
+ function ErrorBoundary(props) {
11
+ var _this = _super.call(this, props) || this;
12
+ _this.state = {
13
+ hasError: false,
14
+ };
15
+ return _this;
16
+ }
17
+ ErrorBoundary.getDerivedStateFromError = function ( /*error: Error*/) {
18
+ return {
19
+ hasError: true,
20
+ };
21
+ };
22
+ ErrorBoundary.prototype.componentDidCatch = function (error, errorInfo) {
23
+ console.error(error, errorInfo);
24
+ };
25
+ ErrorBoundary.prototype.render = function () {
26
+ if (this.state.hasError) {
27
+ return 'An error has occurred.';
28
+ }
29
+ return this.props.children;
30
+ };
31
+ return ErrorBoundary;
32
+ }(react_1.default.Component));
33
+ exports.default = ErrorBoundary;
34
+ //# sourceMappingURL=ErrorBoundary.js.map
package/src/components/ErrorBoundary.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ErrorBoundary.js","sourceRoot":"","sources":["../../../../../packages/utilities/src/components/ErrorBoundary.tsx"],"names":[],"mappings":";;;AAAA,wDAA8C;AAU9C;;GAEG;AACH;IAA4B,yCAG3B;IACC,uBAAY,KAAyB;QAArC,YACE,kBAAM,KAAK,CAAC,SAIb;QAHC,KAAI,CAAC,KAAK,GAAG;YACX,QAAQ,EAAE,KAAK;SAChB,CAAC;;IACJ,CAAC;IAEM,sCAAwB,GAA/B,WAAgC,gBAAgB;QAC9C,OAAO;YACL,QAAQ,EAAE,IAAI;SACf,CAAC;IACJ,CAAC;IAEQ,yCAAiB,GAA1B,UAA2B,KAAY,EAAE,SAAoB;QAC3D,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;IAClC,CAAC;IAEQ,8BAAM,GAAf;QACE,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;YACvB,OAAO,wBAAwB,CAAC;SACjC;QAED,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;IAC7B,CAAC;IACH,oBAAC;AAAD,CAAC,AA5BD,CAA4B,eAAK,CAAC,SAAS,GA4B1C;AAED,kBAAe,aAAa,CAAC"}
package/src/components/FederationBoundary.d.ts ADDED
@@ -0,0 +1,14 @@
1
+ import React from 'react';
2
+ import type { ComponentClass, ComponentType, PropsWithChildren } from 'react';
3
+ export interface FederationBoundaryProps {
4
+ dynamicImporter: () => Promise<ComponentType<any>>;
5
+ fallback?: () => Promise<ComponentType<any>>;
6
+ customBoundary?: ComponentClass<PropsWithChildren<any>>;
7
+ [props: string]: any;
8
+ }
9
+ /**
10
+ * Wrapper around dynamic import.
11
+ * Adds error boundaries and fallback options.
12
+ */
13
+ declare const FederationBoundary: React.FC<FederationBoundaryProps>;
14
+ export default FederationBoundary;
package/src/components/FederationBoundary.js ADDED
@@ -0,0 +1,33 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ var tslib_1 = require("tslib");
4
+ var react_1 = tslib_1.__importStar(require("react"));
5
+ var dynamic_1 = tslib_1.__importDefault(require("next/dynamic"));
6
+ var ErrorBoundary_1 = tslib_1.__importDefault(require("./ErrorBoundary"));
7
+ /**
8
+ * A fallback component that renders nothing.
9
+ */
10
+ var FallbackComponent = function () {
11
+ return null;
12
+ };
13
+ /**
14
+ * Wrapper around dynamic import.
15
+ * Adds error boundaries and fallback options.
16
+ */
17
+ var FederationBoundary = function (_a) {
18
+ var dynamicImporter = _a.dynamicImporter, _b = _a.fallback, fallback = _b === void 0 ? function () { return Promise.resolve(FallbackComponent); } : _b, _c = _a.customBoundary, CustomBoundary = _c === void 0 ? ErrorBoundary_1.default : _c, rest = tslib_1.__rest(_a, ["dynamicImporter", "fallback", "customBoundary"]);
19
+ var ImportResult = (0, react_1.useMemo)(function () {
20
+ return (0, dynamic_1.default)(function () {
21
+ return dynamicImporter().catch(function (e) {
22
+ console.error(e);
23
+ return fallback();
24
+ });
25
+ }, {
26
+ ssr: false,
27
+ });
28
+ }, [dynamicImporter, fallback]);
29
+ return (react_1.default.createElement(CustomBoundary, null,
30
+ react_1.default.createElement(ImportResult, tslib_1.__assign({}, rest))));
31
+ };
32
+ exports.default = FederationBoundary;
33
+ //# sourceMappingURL=FederationBoundary.js.map
package/src/components/FederationBoundary.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FederationBoundary.js","sourceRoot":"","sources":["../../../../../packages/utilities/src/components/FederationBoundary.tsx"],"names":[],"mappings":";;;AAAA,qDAAuC;AAEvC,iEAAmC;AACnC,0EAA4C;AAE5C;;GAEG;AACH,IAAM,iBAAiB,GAAa;IAClC,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAaF;;;GAGG;AACH,IAAM,kBAAkB,GAAsC,UAAC,EAK9D;IAJC,IAAA,eAAe,qBAAA,EACf,gBAAmD,EAAnD,QAAQ,mBAAG,cAAM,OAAA,OAAO,CAAC,OAAO,CAAC,iBAAiB,CAAC,EAAlC,CAAkC,KAAA,EACnD,sBAA8C,EAA9B,cAAc,mBAAG,uBAAa,KAAA,EAC3C,IAAI,sBAJsD,iDAK9D,CADQ;IAEP,IAAM,YAAY,GAAG,IAAA,eAAO,EAAC;QAC3B,OAAO,IAAA,iBAAO,EACZ;YACE,OAAA,eAAe,EAAE,CAAC,KAAK,CAAC,UAAC,CAAQ;gBAC/B,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;gBACjB,OAAO,QAAQ,EAAE,CAAC;YACpB,CAAC,CAAC;QAHF,CAGE,EACJ;YACE,GAAG,EAAE,KAAK;SACX,CACF,CAAC;IACJ,CAAC,EAAE,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEhC,OAAO,CACL,8BAAC,cAAc;QACb,8BAAC,YAAY,uBAAK,IAAI,EAAI,CACX,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,kBAAkB,CAAC"}
package/src/types/index.d.ts CHANGED
@@ -1,10 +1,10 @@
1
1
  /// <reference types="webpack/module" />
2
2
  import type { container, WebpackOptionsNormalized } from 'webpack';
3
- export declare type ModuleFederationPluginOptions = ConstructorParameters<typeof container.ModuleFederationPlugin>['0'];
4
- export declare type WebpackRequire = {
3
+ export type ModuleFederationPluginOptions = ConstructorParameters<typeof container.ModuleFederationPlugin>['0'];
4
+ export type WebpackRequire = {
5
5
  l: (url: string, cb: (event: any) => void, id: string) => Record<string, unknown>;
6
6
  };
7
- export declare type WebpackShareScopes = Record<string, Record<string, {
7
+ export type WebpackShareScopes = Record<string, Record<string, {
8
8
  loaded?: 1;
9
9
  get: () => Promise<unknown>;
10
10
  from: string;
@@ -24,41 +24,41 @@ export interface NextFederationPluginExtraOptions {
24
24
  export interface NextFederationPluginOptions extends ModuleFederationPluginOptions {
25
25
  extraOptions: NextFederationPluginExtraOptions;
26
26
  }
27
- export declare type Shared = ModuleFederationPluginOptions['shared'];
28
- export declare type Remotes = ModuleFederationPluginOptions['remotes'];
29
- export declare type SharedObject = Extract<Shared, ModuleFederationPluginOptions>;
30
- export declare type SharedConfig = Extract<SharedObject[keyof SharedObject], {
27
+ export type Shared = ModuleFederationPluginOptions['shared'];
28
+ export type Remotes = ModuleFederationPluginOptions['remotes'];
29
+ export type SharedObject = Extract<Shared, ModuleFederationPluginOptions>;
30
+ export type SharedConfig = Extract<SharedObject[keyof SharedObject], {
31
31
  eager?: boolean;
32
32
  }>;
33
- export declare type ExternalsType = Required<ModuleFederationPluginOptions['remoteType']>;
34
- declare type ModulePath = string;
35
- export declare type WebpackRemoteContainer = {
33
+ export type ExternalsType = Required<ModuleFederationPluginOptions['remoteType']>;
34
+ type ModulePath = string;
35
+ export type WebpackRemoteContainer = {
36
36
  get(modulePath: ModulePath): () => any;
37
37
  init: (obj?: typeof __webpack_share_scopes__) => void;
38
38
  };
39
- export declare type AsyncContainer = Promise<WebpackRemoteContainer>;
40
- export declare type RemoteData = {
39
+ export type AsyncContainer = Promise<WebpackRemoteContainer>;
40
+ export type RemoteData = {
41
41
  global: string;
42
42
  url: string;
43
43
  uniqueKey?: string;
44
44
  };
45
- export declare type RuntimeRemote = Partial<RemoteData> & {
45
+ export type RuntimeRemote = Partial<RemoteData> & {
46
46
  asyncContainer?: AsyncContainer;
47
47
  };
48
- export declare type RuntimeRemotesMap = Record<string, RuntimeRemote>;
49
- declare type Module = WebpackOptionsNormalized['module'];
50
- declare type Rules = Module['rules'];
51
- export declare type RuleSetRuleUnion = Rules[0];
52
- declare type RuleSetRule = Extract<RuleSetRuleUnion, {
48
+ export type RuntimeRemotesMap = Record<string, RuntimeRemote>;
49
+ type Module = WebpackOptionsNormalized['module'];
50
+ type Rules = Module['rules'];
51
+ export type RuleSetRuleUnion = Rules[0];
52
+ type RuleSetRule = Extract<RuleSetRuleUnion, {
53
53
  loader?: string;
54
54
  }>;
55
- export declare type Loader = Extract<RuleSetRule['use'], {
55
+ export type Loader = Extract<RuleSetRule['use'], {
56
56
  loader?: string;
57
57
  }>;
58
- export declare type EventTypes = 'loadStart' | 'loadComplete' | 'loadError';
59
- declare type NextRoute = string;
60
- export declare type PageMap = Record<NextRoute, ModulePath>;
61
- export declare type GetModuleOptions = {
58
+ export type EventTypes = 'loadStart' | 'loadComplete' | 'loadError';
59
+ type NextRoute = string;
60
+ export type PageMap = Record<NextRoute, ModulePath>;
61
+ export type GetModuleOptions = {
62
62
  modulePath: string;
63
63
  exportName?: string;
64
64
  remoteContainer: string | RemoteData;
package/src/utils/importRemote.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- declare type RemoteUrl = string | (() => Promise<string>);
1
+ type RemoteUrl = string | (() => Promise<string>);
2
2
  export interface ImportRemoteOptions {
3
3
  url: RemoteUrl;
4
4
  scope: string;
package/src/utils/react.d.ts CHANGED
@@ -1,10 +1 @@
1
- import type { ComponentType } from 'react';
2
- /**
3
- * Wrapper around dynamic import.
4
- * Adds error boundaries and fallback options
5
- */
6
- export declare const FederationBoundary: ({ dynamicImporter, fallback, customBoundary: CustomBoundary, ...rest }: {
7
- dynamicImporter: () => Promise<any>;
8
- fallback: () => Promise<any> | null;
9
- customBoundary: ComponentType;
10
- }) => JSX.Element;
1
+ export { default as FederationBoundary } from '../components/FederationBoundary';
package/src/utils/react.js CHANGED
@@ -1,42 +1,9 @@
1
1
  "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
2
5
  Object.defineProperty(exports, "__esModule", { value: true });
3
6
  exports.FederationBoundary = void 0;
4
- var tslib_1 = require("tslib");
5
- var react_1 = tslib_1.__importStar(require("react"));
6
- var dynamic_1 = tslib_1.__importDefault(require("next/dynamic"));
7
- var ErrorBoundary = /** @class */ (function (_super) {
8
- tslib_1.__extends(ErrorBoundary, _super);
9
- function ErrorBoundary(props) {
10
- return _super.call(this, props) || this;
11
- }
12
- ErrorBoundary.prototype.componentDidCatch = function (error, errorInfo) {
13
- // You can also log the error to an error reporting service
14
- console.error(error, errorInfo);
15
- };
16
- ErrorBoundary.prototype.render = function () {
17
- return this.props['children'];
18
- };
19
- return ErrorBoundary;
20
- }(react_1.default.Component));
21
- /**
22
- * Wrapper around dynamic import.
23
- * Adds error boundaries and fallback options
24
- */
25
- var FederationBoundary = function (_a) {
26
- var dynamicImporter = _a.dynamicImporter, _b = _a.fallback, fallback = _b === void 0 ? function () { return null; } : _b, CustomBoundary = _a.customBoundary, rest = tslib_1.__rest(_a, ["dynamicImporter", "fallback", "customBoundary"]);
27
- return (0, react_1.useMemo)(function () {
28
- var ImportResult = (0, dynamic_1.default)(function () {
29
- return dynamicImporter().catch(function (e) {
30
- console.error(e);
31
- return fallback();
32
- });
33
- }, {
34
- ssr: false,
35
- });
36
- var Boundary = CustomBoundary !== undefined ? CustomBoundary : ErrorBoundary;
37
- return (react_1.default.createElement(Boundary, null,
38
- react_1.default.createElement(ImportResult, tslib_1.__assign({}, rest))));
39
- }, [dynamicImporter, fallback]);
40
- };
41
- exports.FederationBoundary = FederationBoundary;
7
+ var FederationBoundary_1 = require("../components/FederationBoundary");
8
+ Object.defineProperty(exports, "FederationBoundary", { enumerable: true, get: function () { return __importDefault(FederationBoundary_1).default; } });
42
9
  //# sourceMappingURL=react.js.map
package/src/utils/react.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"react.js","sourceRoot":"","sources":["../../../../../packages/utilities/src/utils/react.tsx"],"names":[],"mappings":";;;;AACA,qDAAuC;AACvC,iEAAmC;AAQnC;IAA4B,yCAAyB;IACnD,uBAAY,KAAoB;eAC9B,kBAAM,KAAK,CAAC;IACd,CAAC;IAEQ,yCAAiB,GAA1B,UAA2B,KAAY,EAAE,SAAc;QACrD,2DAA2D;QAC3D,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;IAClC,CAAC;IAEQ,8BAAM,GAAf;QACE,OAAO,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;IAChC,CAAC;IACH,oBAAC;AAAD,CAAC,AAbD,CAA4B,eAAK,CAAC,SAAS,GAa1C;AAED;;;GAGG;AAEI,IAAM,kBAAkB,GAAG,UAAC,EAS9B;IARH,IAAA,eAAe,qBAAA,EACf,gBAAqB,EAArB,QAAQ,mBAAG,cAAM,OAAA,IAAI,EAAJ,CAAI,KAAA,EACL,cAAc,oBAAA,EAC3B,IAAI,sBAJ0B,iDAKlC,CADQ;IAMP,OAAO,IAAA,eAAO,EAAC;QACb,IAAM,YAAY,GAAG,IAAA,iBAAO,EAC1B;YACE,OAAA,eAAe,EAAE,CAAC,KAAK,CAAC,UAAC,CAAQ;gBAC/B,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;gBACjB,OAAO,QAAQ,EAAE,CAAC;YACpB,CAAC,CAAC;QAHF,CAGE,EACJ;YACE,GAAG,EAAE,KAAK;SACX,CACF,CAAC;QACF,IAAM,QAAQ,GACZ,cAAc,KAAK,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,CAAC;QAChE,OAAO,CACL,8BAAC,QAAQ;YACP,8BAAC,YAAY,uBAAK,IAAI,EAAI,CACjB,CACZ,CAAC;IACJ,CAAC,EAAE,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC;AAClC,CAAC,CAAC;AA7BW,QAAA,kBAAkB,sBA6B7B"}
1
+ {"version":3,"file":"react.js","sourceRoot":"","sources":["../../../../../packages/utilities/src/utils/react.tsx"],"names":[],"mappings":";;;;;;AAAA,uEAAiF;AAAxE,yIAAA,OAAO,OAAsB"}