Skip to content

Commit

Permalink
Remove mixed React components and other exports.
Browse files Browse the repository at this point in the history
  • Loading branch information
@Hyperkid123
Hyperkid123 committed Oct 2, 2024
1 parent 539f5cc commit e565443
Show file tree
Hide file tree
Showing 24 changed files with 428 additions and 1,143 deletions.
4 changes: 2 additions & 2 deletions .eslintrc.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,10 @@ module.exports = {
{
files: ['**/*.ts', '**/*.tsx', '**/*.js'],
parser: '@typescript-eslint/parser',
plugins: ['@typescript-eslint', 'react-refresh'],
plugins: ['@typescript-eslint'],
extends: ['plugin:@typescript-eslint/recommended'],
rules: {
'react-refresh/only-export-components': 'warn',
'react/react-in-jsx-scope': 'off',
'react/prop-types': 'off',
'@typescript-eslint/no-unused-vars': ['error', { ignoreRestSiblings: true, args: 'after-used' }],
'@typescript-eslint/no-explicit-any': 'warn',
Expand Down
145 changes: 36 additions & 109 deletions config/rspack.config.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
/* eslint-disable @typescript-eslint/no-var-requires */
const path = require('path');
const rspack = require('@rspack/core');
const { defineConfig } = require('@rspack/cli');
const plugins = require('./rspack.plugins.js');
const { createJoinFunction, createJoinImplementation, asGenerator, defaultJoinGenerator } = require('resolve-url-loader');
const searchIgnoredStyles = require('@redhat-cloud-services/frontend-components-config-utilities/search-ignored-styles');
Expand Down Expand Up @@ -62,47 +63,33 @@ const commonConfig = ({ dev }) => {
}),
},
});
// console.log(pc.onBeforeSetupMiddleware);
pc.setupMiddlewares = (middlewares, { app, compiler, options }) => {
app.enable('strict routing');

return middlewares;
};
// not in v1 release
delete pc.onBeforeSetupMiddleware;

/** @type { import("rspack").Configuration } */
return {
entry: dev
? // HMR request react, react-dom and react-refresh/runtime to be in the same chunk
{
main: path.resolve(__dirname, '../src/index.ts'),
// vendors: ['react', 'react-dom', 'react-refresh/runtime'],
}
: path.resolve(__dirname, '../src/index.ts'),
return defineConfig({
entry: {
main: path.resolve(__dirname, '../src/index.ts'),
},
output: {
uniqueName: 'chrome-root',
path: path.resolve(__dirname, '../build/js'),
// the HMR needs dynamic entry filename to remove name conflicts
filename: dev ? '[name].js' : 'chrome-root.[contenthash].js',
hashFunction: 'xxhash64',
...(!dev
? {
filename: 'chrome-root.[contenthash].js',
hashFunction: 'xxhash64',
chunkFilename: '[name].[contenthash].js',
}
: {}),
publicPath,
chunkFilename: dev ? '[name].js' : '[name].[contenthash].js',
},
...(dev
? {
cache: true,
}
: {}),
devtool: false,
// cache: true,
// devtool: false,
experiments: {
css: true,
// lazyCompilation: true,
// rspackFuture: {
// disableTransformByDefault: true,
// },
},
resolve: {
extensions: ['.js', '.ts', '.tsx'],
extensions: ['...', '.js', '.ts', '.tsx'],
alias: {
...searchIgnoredStyles(path.resolve(__dirname, '../')),
...imageNullLoader(),
Expand All @@ -121,23 +108,16 @@ const commonConfig = ({ dev }) => {
'react-dom': path.resolve(__dirname, '../node_modules/react-dom'),
},
fallback: {
path: require.resolve('path-browserify'),
stream: require.resolve('stream-browserify'),
zlib: require.resolve('browserify-zlib'),
assert: require.resolve('assert/'),
buffer: require.resolve('buffer/'),
url: require.resolve('url/'),
process: require.resolve('process'),
},
},
optimization: {
concatenateModules: false,
...(dev
? {
// for HMR all runtime chunks must be in a single file
// runtimeChunk: 'single',
}
: {}),
minimizer: [new rspack.SwcJsMinimizerRspackPlugin(), new rspack.LightningCssMinimizerRspackPlugin()],
...(dev && {
runtimeChunk: 'single',
}),
},
module: {
rules: [
Expand All @@ -147,18 +127,17 @@ const commonConfig = ({ dev }) => {
use: {
loader: 'builtin:swc-loader',
options: {
transform: {
react: {
runtime: 'automatic',
development: dev,
refresh: dev,
},
},
jsc: {
parser: {
syntax: 'typescript',
tsx: true,
},
transform: {
react: {
runtime: 'automatic',
development: !!dev,
},
},
},
},
},
Expand All @@ -185,12 +164,17 @@ const commonConfig = ({ dev }) => {
},
{
test: /\.(jpe?g|svg|png|gif|ico|eot|ttf|woff2?)(\?v=\d+\.\d+\.\d+)?$/i,
type: 'asset/resource',
type: 'asset',
},
],
},
plugins: plugins(dev, process.env.BETA === 'true', process.env.NODE_ENV === 'restricted'),
devServer: {
// HMR flag
...pc,
client: {
overlay: false,
},
allowedHosts: 'all',
headers: {
'Access-Control-Allow-Origin': '*',
Expand All @@ -199,73 +183,16 @@ const commonConfig = ({ dev }) => {
historyApiFallback: {
index: `${publicPath}index.html`,
},
server: 'https',
server: 'spdy',
port: 1337,
// HMR flag
...pc,
hot: true,
liveReload: true,
},
};
};

// PF node module asset compilation config, no need to compile PF assets more than once during a run
/** @type { import("rspack").Configuration } */
const pfConfig = {
entry: {
'pf4-v5': path.resolve(__dirname, '../src/sass/pf-5-assets.scss'),
},
output: {
path: path.resolve(__dirname, '../build/js/pf'),
// the HMR needs dynamic entry filename to remove name conflicts
filename: '[name].js',
publicPath: `auto`,
},
plugins: [new rspack.CssExtractRspackPlugin()],
stats: {
errorDetails: true,
},
cache: true,
experiments: {
css: true,
},
module: {
rules: [
{
test: /\.s?[ac]ss$/,
use: [
// rspack.CssExtractRspackPlugin.loader,
// 'css-loader',
{
loader: 'resolve-url-loader',
options: {
join: createJoinFunction('myJoinFn', createJoinImplementation(PFGenerator)),
},
},
{
loader: 'sass-loader',
options: {
sassOptions: {
outputStyle: 'compressed',
},
sourceMap: true,
api: 'modern-compiler',
implementation: require.resolve('sass-embedded'),
},
},
],
type: 'css/auto',
},
{
test: /\.(jpe?g|svg|png|gif|ico|eot|ttf|woff2?)(\?v=\d+\.\d+\.\d+)?$/i,
type: 'asset/resource',
},
],
},
});
};

module.exports = function (env) {
const dev = process.env.DEV_SERVER;
const config = commonConfig({ dev, publicPath: env.publicPath });

return [pfConfig, config];
return config;
};
27 changes: 1 addition & 26 deletions config/rspack.plugins.js
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,8 @@
/* eslint-disable @typescript-eslint/no-var-requires */
// const webpack = require('webpack');
const rspack = require('@rspack/core');
const resolve = require('path').resolve;
// const HtmlWebpackPlugin = require('html-webpack-plugin');
const path = require('path');
// const { ProvidePlugin } = require('webpack');
// const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
const getDynamicModules = require('./get-dynamic-modules');
const ReactRefreshPlugin = require('@rspack/plugin-react-refresh');
const { pluginReact } = require('@rsbuild/plugin-react');

// const MFP = require('@module-federation/enhanced').ModuleFederationPlugin;

const deps = require('../package.json').dependencies;

Expand All @@ -21,16 +12,6 @@ const plugins = (dev = false, beta = false, restricted = false) => {
_unstableHotReload: dev,
});
return [
// pluginReact({
// swcReactOptions: {
// refresh: dev,
// development: dev,
// }
// }),
new rspack.CssExtractRspackPlugin({
filename: dev ? '[name].css' : '[name].[contenthash].css',
ignoreOrder: true,
}),
new rspack.container.ModuleFederationPlugin({
library: {
type: 'global',
Expand Down Expand Up @@ -67,7 +48,7 @@ const plugins = (dev = false, beta = false, restricted = false) => {
filename: dev ? 'index.html' : '../index.html',
base: '/',
templateParameters: {
pf4styles: `/${beta ? 'beta/' : ''}apps/chrome/js/pf/pf4-v4.css`,
dev,
pf5styles: `/${beta ? 'beta/' : ''}apps/chrome/js/pf/pf4-v5.css`,
},
}),
Expand All @@ -78,11 +59,6 @@ const plugins = (dev = false, beta = false, restricted = false) => {
minify: false,
template: path.resolve(__dirname, '../src/silent-check-sso.html'),
}),
// new ProvidePlugin({
// process: 'process/browser.js',
// Buffer: ['buffer', 'Buffer'],
// }),
new ForkTsCheckerWebpackPlugin(),
/**
* Removes error for a missing logger function
* https://github.com/getsentry/sentry-javascript/issues/6596
Expand All @@ -91,7 +67,6 @@ const plugins = (dev = false, beta = false, restricted = false) => {
new rspack.DefinePlugin({
__SENTRY_DEBUG__: false,
}),
...(dev ? [new ReactRefreshPlugin()] : []),
];
};

Expand Down
Loading

0 comments on commit e565443

Please sign in to comment.