config: Replace webpack configs with FEC config
This migrates from previously used webpack configs to one fec.config.js. This will allow us to bump `frontend-components-config` dependency to version 6.x and stay supported in the future.
This commit is contained in:
regexowl
Klara Simickova
parent
a8fea7c377
commit
ba29232c91
6 changed files with 741 additions and 397 deletions
3
.gitignore
vendored
3
.gitignore
vendored
|
|
@ -12,6 +12,9 @@ node_modules
|
|||
# production
|
||||
dist
|
||||
|
||||
# cache
|
||||
.cache
|
||||
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
|
|
|||
|
|
@ -1,40 +0,0 @@
|
|||
/* eslint-disable @typescript-eslint/no-var-requires */
|
||||
const { resolve } = require('path');
|
||||
|
||||
const config = require('@redhat-cloud-services/frontend-components-config');
|
||||
|
||||
const { config: webpackConfig, plugins } = config({
|
||||
rootFolder: resolve(__dirname, '../'),
|
||||
debug: true,
|
||||
useFileHash: false,
|
||||
sassPrefix: '.imageBuilder',
|
||||
deployment: 'beta/apps',
|
||||
appUrl: '/preview/insights/image-builder',
|
||||
env: 'stage-beta',
|
||||
useProxy: true,
|
||||
useAgent: true,
|
||||
bounceProd: false,
|
||||
proxyVerbose: true,
|
||||
routes: {
|
||||
'/api/image-builder/v1': { host: 'http://localhost:8086' },
|
||||
},
|
||||
});
|
||||
|
||||
plugins.push(
|
||||
require('@redhat-cloud-services/frontend-components-config/federated-modules')(
|
||||
{
|
||||
root: resolve(__dirname, '../'),
|
||||
useFileHash: false,
|
||||
exposes: {
|
||||
'./RootApp': resolve(__dirname, '../src/AppEntry.tsx'),
|
||||
},
|
||||
shared: [{ 'react-router-dom': { singleton: true } }],
|
||||
exclude: ['react-router-dom'],
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
module.exports = {
|
||||
...webpackConfig,
|
||||
plugins,
|
||||
};
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
/* eslint-disable @typescript-eslint/no-var-requires */
|
||||
const { resolve } = require('path');
|
||||
|
||||
const config = require('@redhat-cloud-services/frontend-components-config');
|
||||
const { config: webpackConfig, plugins } = config({
|
||||
rootFolder: resolve(__dirname, '../'),
|
||||
sassPrefix: '.imageBuilder',
|
||||
});
|
||||
|
||||
plugins.push(
|
||||
require('@redhat-cloud-services/frontend-components-config/federated-modules')(
|
||||
{
|
||||
root: resolve(__dirname, '../'),
|
||||
exposes: {
|
||||
'./RootApp': resolve(__dirname, '../src/AppEntry.tsx'),
|
||||
},
|
||||
shared: [{ 'react-router-dom': { singleton: true } }],
|
||||
exclude: ['react-router-dom'],
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
module.exports = {
|
||||
...webpackConfig,
|
||||
plugins,
|
||||
};
|
||||
|
|
@ -1,66 +1,10 @@
|
|||
/* eslint-disable @typescript-eslint/no-var-requires */
|
||||
const { resolve } = require('path');
|
||||
const path = require('path');
|
||||
|
||||
const config = require('@redhat-cloud-services/frontend-components-config');
|
||||
const CopyPlugin = require('copy-webpack-plugin');
|
||||
const webpack = require('webpack');
|
||||
|
||||
const webpackProxy = {
|
||||
useProxy: true,
|
||||
proxyVerbose: true,
|
||||
env: `${process.env.STAGE ? 'stage' : 'prod'}-${
|
||||
process.env.BETA ? 'beta' : 'stable'
|
||||
}`,
|
||||
appUrl: [
|
||||
'/insights/image-builder',
|
||||
'/beta/insights/image-builder',
|
||||
'/preview/insights/image-builder',
|
||||
],
|
||||
routes: {
|
||||
...(process.env.CONFIG_PORT && {
|
||||
[`${process.env.BETA ? '/beta' : ''}/config`]: {
|
||||
host: `http://localhost:${process.env.CONFIG_PORT}`,
|
||||
},
|
||||
}),
|
||||
...(process.env.LOCAL_API && {
|
||||
...(process.env.LOCAL_API.split(',') || []).reduce((acc, curr) => {
|
||||
const [appName, appConfig] = (curr || '').split(':');
|
||||
const [appPort = 8003, protocol = 'http', host = 'localhost'] =
|
||||
appConfig.split('~');
|
||||
return {
|
||||
...acc,
|
||||
[`/apps/${appName}`]: { host: `${protocol}://${host}:${appPort}` },
|
||||
[`/beta/apps/${appName}`]: {
|
||||
host: `${protocol}://${host}:${appPort}`,
|
||||
},
|
||||
};
|
||||
}, {}),
|
||||
}),
|
||||
},
|
||||
};
|
||||
|
||||
const { config: webpackConfig, plugins } = config({
|
||||
rootFolder: resolve(__dirname, '../'),
|
||||
debug: true,
|
||||
useFileHash: false,
|
||||
sassPrefix: '.imageBuilder',
|
||||
deployment: process.env.BETA ? 'beta/apps' : 'apps',
|
||||
...(process.env.PROXY ? webpackProxy : {}),
|
||||
});
|
||||
|
||||
plugins.push(
|
||||
require('@redhat-cloud-services/frontend-components-config/federated-modules')(
|
||||
{
|
||||
root: resolve(__dirname, '../'),
|
||||
useFileHash: false,
|
||||
exposes: {
|
||||
'./RootApp': resolve(__dirname, '../src/AppEntry.tsx'),
|
||||
},
|
||||
shared: [{ 'react-router-dom': { singleton: true } }],
|
||||
exclude: ['react-router-dom'],
|
||||
}
|
||||
)
|
||||
);
|
||||
const plugins = [];
|
||||
|
||||
if (process.env.MSW) {
|
||||
// Copy mockServiceWorker.js to ./dist/ so it is served with the bundle
|
||||
|
|
@ -72,19 +16,6 @@ if (process.env.MSW) {
|
|||
})
|
||||
);
|
||||
|
||||
/*
|
||||
mockServiceWorker.js will be served from /beta/apps/image-builder, which
|
||||
will become its default scope. Setting the Service-Worker-Allowed header to
|
||||
'/' allows the worker's scope to be expanded to the root route '/'.
|
||||
|
||||
The default webpackConfig for stage does not contain any headers.
|
||||
|
||||
Caution: The default webpackConfig for prod *does* contain headers, so this
|
||||
code will need to be modified if using MSW in prod-beta or prod-stable so that
|
||||
those headers are not overwritten.
|
||||
*/
|
||||
webpackConfig.devServer.headers = { 'Service-Worker-Allowed': '/' };
|
||||
|
||||
/*
|
||||
We would like the client to be able to determine whether or not to start
|
||||
the service worker at run time based on the value of process.env.MSW. We can
|
||||
|
|
@ -108,6 +39,55 @@ if (process.env.MSW) {
|
|||
}
|
||||
|
||||
module.exports = {
|
||||
...webpackConfig,
|
||||
plugins,
|
||||
sassPrefix: '.imageBuilder',
|
||||
debug: true,
|
||||
useFileHash: false,
|
||||
/*
|
||||
mockServiceWorker.js will be served from /beta/apps/image-builder, which
|
||||
will become its default scope. Setting the Service-Worker-Allowed header to
|
||||
'/' allows the worker's scope to be expanded to the root route '/'.
|
||||
|
||||
The default webpackConfig for stage does not contain any headers.
|
||||
|
||||
Caution: The default webpackConfig for prod *does* contain headers, so this
|
||||
code will need to be modified if using MSW in prod-beta or prod-stable so that
|
||||
those headers are not overwritten.
|
||||
*/
|
||||
devServer: process.env.MSW && {
|
||||
headers: { 'Service-Worker-Allowed': '/' },
|
||||
},
|
||||
appUrl: '/insights/image-builder',
|
||||
useProxy: true,
|
||||
useAgent: true,
|
||||
bounceProd: false,
|
||||
proxyVerbose: true,
|
||||
routes: {
|
||||
...(process.env.CONFIG_PORT && {
|
||||
[`${process.env.BETA ? '/beta' : ''}/config`]: {
|
||||
host: `http://localhost:${process.env.CONFIG_PORT}`,
|
||||
},
|
||||
}),
|
||||
...(process.env.LOCAL_API && {
|
||||
...(process.env.LOCAL_API.split(',') || []).reduce((acc, curr) => {
|
||||
const [appName, appConfig] = (curr || '').split(':');
|
||||
const [appPort = 8003, protocol = 'http', host = 'localhost'] =
|
||||
appConfig.split('~');
|
||||
return {
|
||||
...acc,
|
||||
[`/apps/${appName}`]: { host: `${protocol}://${host}:${appPort}` },
|
||||
[`/beta/apps/${appName}`]: {
|
||||
host: `${protocol}://${host}:${appPort}`,
|
||||
},
|
||||
};
|
||||
}, {}),
|
||||
}),
|
||||
},
|
||||
plugins: plugins,
|
||||
moduleFederation: {
|
||||
exposes: {
|
||||
'./RootApp': path.resolve(__dirname, './src/AppEntry.tsx'),
|
||||
},
|
||||
shared: [{ 'react-router-dom': { singleton: true, version: '*' } }],
|
||||
exclude: ['react-router-dom'],
|
||||
},
|
||||
};
|
||||
922
package-lock.json
generated
922
package-lock.json
generated
File diff suppressed because it is too large
Load diff
21
package.json
21
package.json
|
|
@ -36,7 +36,8 @@
|
|||
"@babel/preset-typescript": "7.24.7",
|
||||
"@patternfly/react-icons": "5.3.2",
|
||||
"@redhat-cloud-services/eslint-config-redhat-cloud-services": "2.0.4",
|
||||
"@redhat-cloud-services/frontend-components-config": "5.0.5",
|
||||
"@redhat-cloud-services/frontend-components-config": "6.0.16",
|
||||
"@redhat-cloud-services/tsc-transform-imports": "1.0.11",
|
||||
"@rtk-query/codegen-openapi": "1.2.0",
|
||||
"@testing-library/dom": "10.3.2",
|
||||
"@testing-library/jest-dom": "6.4.6",
|
||||
|
|
@ -79,6 +80,7 @@
|
|||
"stylelint": "15.11.0",
|
||||
"stylelint-config-recommended-scss": "13.1.0",
|
||||
"ts-node": "10.9.2",
|
||||
"ts-patch": "3.2.0",
|
||||
"typescript": "5.5.3",
|
||||
"uuid": "10.0.0",
|
||||
"vitest": "1.6.0",
|
||||
|
|
@ -88,23 +90,20 @@
|
|||
},
|
||||
"scripts": {
|
||||
"lint": "npm-run-all lint:*",
|
||||
"lint:js": "eslint config src",
|
||||
"lint:js:fix": "eslint config src --fix",
|
||||
"lint:js": "eslint src",
|
||||
"lint:js:fix": "eslint src --fix",
|
||||
"lint:sass": "stylelint 'src/**/*.scss' --config .stylelintrc.json",
|
||||
"devel": "webpack serve --config config/devel.webpack.config.js",
|
||||
"prod-beta": "BETA=true PROXY=true webpack serve --config config/dev.webpack.config.js",
|
||||
"prod-stable": "PROXY=true webpack serve --config config/dev.webpack.config.js",
|
||||
"stage-stable": "STAGE=true npm run prod-stable",
|
||||
"stage-beta": "STAGE=true npm run prod-beta",
|
||||
"stage-beta:msw": "MSW=TRUE npm run stage-beta",
|
||||
"start": "fec dev",
|
||||
"start:msw": "MSW=TRUE fec dev",
|
||||
"test": "TZ=UTC vitest run",
|
||||
"test:watch": "TZ=UTC vitest",
|
||||
"test:coverage": "TZ=UTC vitest run --coverage",
|
||||
"build": "webpack --config config/prod.webpack.config.js",
|
||||
"build": "fec build",
|
||||
"api": "npm-run-all api:pull api:generate",
|
||||
"api:generate": "bash api/codegen.sh",
|
||||
"api:pull": "bash api/pull.sh",
|
||||
"verify": "npm-run-all build lint test"
|
||||
"verify": "npm-run-all build lint test",
|
||||
"postinstall": "ts-patch install"
|
||||
},
|
||||
"insights": {
|
||||
"appname": "image-builder"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue