Skip to content

Commit c732196

Browse files
izaeraizaera
authored
Merge pull request #382 from izaera/IFI-2310
feat: provide a mechanism to extend the `remotes` and `shared` fields of webpack config
2 parents f45ed82 + c79aaea commit c732196

File tree

4 files changed

+163
-29
lines changed

4 files changed

+163
-29
lines changed

‎projects/npm-tools/packages/npm-scripts/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@
5151
"metal-tools-soy": "4.3.2",
5252
"mini-css-extract-plugin": "0.11.2",
5353
"minimist": "^1.2.0",
54+
"path-browserify": "^1.0.1",
5455
"prettier": "^2.1.2",
5556
"react": "*",
5657
"react-dom": "*",

‎projects/npm-tools/packages/npm-scripts/src/transform/js/relocateImports.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,7 @@ module.exports = function (previousDirRelPath) {
5050

5151
if (
5252
NODE_TYPES.has(node.type) &&
53+
source &&
5354
source.value.startsWith('./')
5455
) {
5556
source.value = source.value.replace(/^\./, dotReplacement);

‎projects/npm-tools/packages/npm-scripts/src/utils/createFederationConfig.js‎

Lines changed: 156 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -9,37 +9,153 @@ const {
99
} = require('webpack');
1010

1111
const createTempFile = require('./createTempFile');
12+
const getMergedConfig = require('./getMergedConfig');
1213
const parseBnd = require('./parseBnd');
1314
const writeWebpackFederationEntryPoint = require('./writeWebpackFederationEntryPoint');
1415

1516
/**
16-
* This object must represent the current configuration status of the portal's
17-
* project if we don't want to break the build. It contains, for each
18-
* federation-enabled project, the packages that are federated.
17+
* The following two arrays are roughly equivalent to the old default preset
18+
* imports for bundler 2.
1919
*
20-
* Note that there's no real need to define federated packages per project as
21-
* the relation is not used for anything. However, it is better to do it this
22-
* way, because if we mix all together we end up with a very entangled
23-
* configuration.
20+
* In the case of `DEFAULT_REMOTES` it serves the same purpose as the `"/"`
21+
* imports.
2422
*
25-
* Note also that when you want to include a project in the federated build to
26-
* consume other packages (even if it doesn't publish any package) you must
27-
* declare it here.
23+
* The `DEFAULT_SHARED` array contains the list of external dependencies that
24+
* must be shared across all projects.
2825
*/
29-
const FEDERATED_PACKAGES = {
30-
'frontend-js-react-web': [
31-
'classnames',
32-
'formik',
33-
'prop-types',
34-
'react',
35-
'react-dnd',
36-
'react-dnd-html5-backend',
37-
'react-dom',
38-
],
39-
'frontend-js-web': [],
40-
'frontend-taglib-clay': ['@clayui/icon'],
41-
'portal-template-react-renderer-impl': [],
42-
};
26+
const DEFAULT_REMOTES = [
27+
'frontend-js-components-web',
28+
'frontend-js-metal-web',
29+
'frontend-js-react-web',
30+
'frontend-js-spa-web',
31+
'frontend-js-web',
32+
'frontend-taglib',
33+
'frontend-taglib-chart',
34+
'frontend-taglib-clay',
35+
];
36+
const DEFAULT_SHARED = [
37+
'@clayui/alert',
38+
'@clayui/autocomplete',
39+
'@clayui/badge',
40+
'@clayui/breadcrumb',
41+
'@clayui/button',
42+
'@clayui/card',
43+
'@clayui/charts',
44+
'@clayui/color-picker',
45+
'@clayui/css',
46+
'@clayui/data-provider',
47+
'@clayui/date-picker',
48+
'@clayui/drop-down',
49+
'@clayui/empty-state',
50+
'@clayui/form',
51+
'@clayui/icon',
52+
'@clayui/label',
53+
'@clayui/layout',
54+
'@clayui/link',
55+
'@clayui/list',
56+
'@clayui/loading-indicator',
57+
'@clayui/management-toolbar',
58+
'@clayui/modal',
59+
'@clayui/multi-select',
60+
'@clayui/multi-step-nav',
61+
'@clayui/nav',
62+
'@clayui/navigation-bar',
63+
'@clayui/pagination',
64+
'@clayui/pagination-bar',
65+
'@clayui/panel',
66+
'@clayui/popover',
67+
'@clayui/progress-bar',
68+
'@clayui/shared',
69+
'@clayui/slider',
70+
'@clayui/sticker',
71+
'@clayui/table',
72+
'@clayui/tabs',
73+
'@clayui/time-picker',
74+
'@clayui/tooltip',
75+
'@clayui/upper-toolbar',
76+
'classnames',
77+
'clay',
78+
'clay-alert',
79+
'clay-autocomplete',
80+
'clay-badge',
81+
'clay-button',
82+
'clay-card',
83+
'clay-card-grid',
84+
'clay-checkbox',
85+
'clay-collapse',
86+
'clay-component',
87+
'clay-data-provider',
88+
'clay-dataset-display',
89+
'clay-dropdown',
90+
'clay-icon',
91+
'clay-label',
92+
'clay-link',
93+
'clay-list',
94+
'clay-loading-indicator',
95+
'clay-management-toolbar',
96+
'clay-modal',
97+
'clay-multi-select',
98+
'clay-navigation-bar',
99+
'clay-pagination',
100+
'clay-pagination-bar',
101+
'clay-portal',
102+
'clay-progress-bar',
103+
'clay-radio',
104+
'clay-select',
105+
'clay-sticker',
106+
'clay-table',
107+
'clay-tooltip',
108+
'formik',
109+
'incremental-dom',
110+
'incremental-dom-string',
111+
'lodash.escape',
112+
'lodash.groupby',
113+
'lodash.isequal',
114+
'lodash.memoize',
115+
'lodash.unescape',
116+
'metal',
117+
'metal-affix',
118+
'metal-ajax',
119+
'metal-anim',
120+
'metal-aop',
121+
'metal-assertions',
122+
'metal-clipboard',
123+
'metal-component',
124+
'metal-debounce',
125+
'metal-dom',
126+
'metal-drag-drop',
127+
'metal-events',
128+
'metal-incremental-dom',
129+
'metal-jsx',
130+
'metal-key',
131+
'metal-keyboard-focus',
132+
'metal-multimap',
133+
'metal-pagination',
134+
'metal-path-parser',
135+
'metal-position',
136+
'metal-promise',
137+
'metal-router',
138+
'metal-scrollspy',
139+
'metal-soy',
140+
'metal-soy-bundle',
141+
'metal-state',
142+
'metal-storage',
143+
'metal-structs',
144+
'metal-throttle',
145+
'metal-toggler',
146+
'metal-uri',
147+
'metal-useragent',
148+
'metal-web-component',
149+
'prop-types',
150+
'querystring',
151+
'react',
152+
'react-dnd',
153+
'react-dnd-html5-backend',
154+
'react-dom',
155+
'svg4everybody',
156+
'uuid',
157+
'xss-filters',
158+
];
43159

44160
/**
45161
* Create a webpack configuration to inject federation support to the build.
@@ -63,6 +179,11 @@ module.exports = async function () {
63179

64180
await writeWebpackFederationEntryPoint(mainFilePath);
65181

182+
let {remotes, shared} = getMergedConfig('npmscripts', 'federation');
183+
184+
remotes = remotes || [];
185+
shared = shared || [];
186+
66187
return {
67188
context: process.cwd(),
68189
devtool: 'source-map',
@@ -108,7 +229,7 @@ module.exports = async function () {
108229
},
109230
name,
110231
remoteType: 'script',
111-
remotes: Object.keys(FEDERATED_PACKAGES).reduce(
232+
remotes: [...DEFAULT_REMOTES, ...remotes].reduce(
112233
(remotes, name) => {
113234
remotes[
114235
name
@@ -118,14 +239,20 @@ module.exports = async function () {
118239
},
119240
{}
120241
),
121-
shared: []
122-
.concat(...Object.values(FEDERATED_PACKAGES))
123-
.reduce((shared, name) => {
242+
shared: [...DEFAULT_SHARED, ...shared].reduce(
243+
(shared, name) => {
124244
shared[name] = {singleton: true};
125245

126246
return shared;
127-
}, {}),
247+
},
248+
{}
249+
),
128250
}),
129251
],
252+
resolve: {
253+
fallback: {
254+
path: require.resolve('path-browserify'),
255+
},
256+
},
130257
};
131258
};

‎yarn.lock‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11804,6 +11804,11 @@ passwd-user@^3.0.0:
1180411804
dependencies:
1180511805
execa "^1.0.0"
1180611806

11807+
path-browserify@^1.0.1:
11808+
version "1.0.1"
11809+
resolved "https://registry.yarnpkg.com/path-browserify/-/path-browserify-1.0.1.tgz#d98454a9c3753d5790860f16f68867b9e46be1fd"
11810+
integrity sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==
11811+
1180711812
path-dirname@^1.0.0:
1180811813
version "1.0.2"
1180911814
resolved "https://registry.yarnpkg.com/path-dirname/-/path-dirname-1.0.2.tgz#cc33d24d525e099a5388c0336c6e32b9160609e0"

0 commit comments

Comments
 (0)