This commit is contained in:
vm-silicons
2025-12-20 05:24:18 -08:00
parent ae446584b0
commit a1fae079c0
5 changed files with 2690 additions and 2452 deletions
+17 -25
View File
@@ -21,41 +21,33 @@
"tgui:eslint-fix": "eslint --fix packages --ext .js,.cjs,.ts,.jsx,.tsx"
},
"dependencies": {
"@babel/core": "^7.15.0",
"@babel/eslint-parser": "^7.15.0",
"@babel/plugin-proposal-class-properties": "^7.14.5",
"@babel/plugin-transform-jscript": "^7.14.5",
"@babel/preset-env": "^7.15.0",
"@babel/preset-typescript": "^7.15.0",
"@rspack/cli": "^1.6.8",
"@rspack/core": "^1.6.8",
"@types/jest": "^27.0.1",
"@types/jsdom": "^16.2.13",
"@types/node": "^14.17.9",
"@types/react": "^19.2.7",
"@types/react-dom": "^19.2.3",
"@typescript-eslint/parser": "^4.29.1",
"babel-jest": "^27.0.6",
"babel-loader": "^8.2.2",
"babel-plugin-inferno": "^6.3.0",
"babel-plugin-transform-remove-console": "^6.9.4",
"common": "workspace:*",
"css-loader": "^5.2.7",
"eslint": "^7.32.0",
"dompurify": "^3.3.1",
"eslint": "^9.39.2",
"eslint-config-prettier": "^10.1.8",
"eslint-plugin-radar": "^0.2.1",
"eslint-plugin-react": "^7.24.0",
"file-loader": "^6.2.0",
"inferno": "^7.4.8",
"eslint-plugin-react": "^7.37.5",
"eslint-plugin-simple-import-sort": "^12.1.1",
"eslint-plugin-sonarjs": "^3.0.5",
"eslint-plugin-unused-imports": "^4.3.0",
"jest": "^27.0.6",
"jest-circus": "^27.0.6",
"jsdom": "^16.7.0",
"jsdom": "^27.3.0",
"katex": "^0.15.1",
"mini-css-extract-plugin": "^1.6.2",
"prettier": "^3.7.4",
"react": "^19.2.3",
"react-dom": "^19.2.3",
"sass": "^1.37.5",
"sass-loader": "^11.1.1",
"style-loader": "^2.0.0",
"terser-webpack-plugin": "^5.1.4",
"typescript": "5.8.3",
"url-loader": "^4.1.1",
"webpack": "^5.76.0",
"webpack-bundle-analyzer": "^4.4.2",
"webpack-cli": "^4.7.2"
"tgui-core": "^5.6.0",
"typescript": "5.8.3"
},
"packageManager": "yarn@3.4.1"
}
+119
View File
@@ -0,0 +1,119 @@
const { defineConfig } = require('@rspack/cli');
const { rspack } = require('@rspack/core');
const createStats = (verbose) => ({
assets: verbose,
builtAt: verbose,
cached: false,
children: false,
chunks: false,
colors: true,
entrypoints: true,
hash: false,
modules: false,
performance: false,
timings: verbose,
version: verbose,
});
/**
* 04/25/2025
* There is a bug in rspack, possibly only ours, with the experimental css
* feature that throws an error in tgui-dev. This prevents hot reloading from
* working properly and there doesn't seem to be any way to fix it.
*
* This config exists to switch to the old css loader during development.
*
* `TypeError: Cannot read properties of null (reading 'removeChild')`
*/
module.exports = (env = {}, argv) => {
/** @type {import('@rspack/core').Configuration} */
const config = defineConfig({
cache: false,
experiments: undefined,
mode: 'development',
module: {
rules: [
{
test: /\.([tj]s(x)?|cjs)$/,
use: [
{
loader: 'builtin:swc-loader',
options: {
isModule: 'unknown',
jsc: {
parser: {
syntax: 'typescript',
tsx: true,
},
transform: {
react: {
runtime: 'automatic',
},
},
},
},
},
],
type: 'javascript/auto',
},
{
test: /\.(s)?css$/,
use: [
{
loader: rspack.CssExtractRspackPlugin.loader,
},
{
loader: require.resolve('css-loader'),
},
{
loader: require.resolve('sass-loader'),
options: {
api: 'modern-compiler',
implementation: 'sass-embedded',
},
},
],
type: 'javascript/auto',
},
{
test: /\.(png|jpg)$/,
type: 'asset/resource',
},
{
test: /\.svg$/,
oneOf: [
{
issuer: /\.(s)?css$/,
type: 'asset/inline',
},
{
type: 'asset/resource',
},
],
},
],
},
plugins: [
new rspack.EnvironmentPlugin({
NODE_ENV: 'development',
WEBPACK_HMR_ENABLED: env.WEBPACK_HMR_ENABLED || argv.hot || false,
DEV_SERVER_IP: env.DEV_SERVER_IP || null,
}),
new rspack.CssExtractRspackPlugin({
filename: '[name].bundle.css',
chunkFilename: '[name].bundle.css',
}),
],
});
config.devtool = 'cheap-module-source-map';
config.devServer = {
progress: false,
quiet: false,
noInfo: false,
clientLogLevel: 'silent',
stats: createStats(false),
};
return config;
};
+168
View File
@@ -0,0 +1,168 @@
/**
* @file
* @copyright 2020 Aleksej Komarov
* @license MIT
*/
const path = require('path');
const { defineConfig } = require('@rspack/cli');
const { rspack } = require('@rspack/core');
const createStats = (verbose) => ({
assets: verbose,
builtAt: verbose,
cached: false,
children: false,
chunks: false,
colors: true,
entrypoints: true,
hash: false,
modules: false,
performance: false,
timings: verbose,
version: verbose,
});
module.exports = (env = {}, argv) => {
const mode = argv.mode || 'production';
const bench = env.TGUI_BENCH;
/** @type {import('@rspack/core').Configuration} */
const config = defineConfig({
cache: true,
experiments: {
cache: {
type: 'persistent',
storage: {
type: 'filesystem',
directory: path.resolve(__dirname, '.yarn/rspack'),
},
},
css: true,
},
mode: mode === 'production' ? 'production' : 'development',
context: path.resolve(__dirname),
target: ['web', 'browserslist:edge >= 123'],
entry: {
tgui: ['./packages/tgui'],
'tgui-panel': ['./packages/tgui-panel'],
},
output: {
path: argv.useTmpFolder
? path.resolve(__dirname, './public/.tmp')
: path.resolve(__dirname, './public'),
filename: '[name].bundle.js',
chunkFilename: '[name].bundle.js',
chunkLoadTimeout: 15000,
publicPath: '/',
assetModuleFilename: '[name][ext]',
},
resolve: {
pnp: true,
extensions: ['.tsx', '.ts', '.js', '.jsx'],
alias: {
tgui: path.resolve(__dirname, './packages/tgui'),
'tgui-panel': path.resolve(__dirname, './packages/tgui-panel'),
'tgui-dev-server': path.resolve(
__dirname,
'./packages/tgui-dev-server',
),
},
},
module: {
rules: [
{
test: /\.([tj]s(x)?|cjs)$/,
use: [
{
loader: 'builtin:swc-loader',
options: {
jsc: {
parser: {
syntax: 'typescript',
tsx: true,
},
transform: {
react: {
runtime: 'automatic',
},
},
},
},
},
],
type: 'javascript/auto',
},
{
test: /\.(s)?css$/,
use: [
{
loader: require.resolve('sass-loader'),
options: {
api: 'modern-compiler',
implementation: 'sass-embedded',
},
},
],
type: 'css',
},
{
test: /\.(png|jpg)$/,
type: 'asset/resource',
},
{
test: /\.svg$/,
oneOf: [
{
issuer: /\.(s)?css$/,
type: 'asset/inline',
},
{
type: 'asset/resource',
},
],
},
],
},
optimization: {
emitOnErrors: false,
},
performance: {
hints: false,
},
devtool: false,
stats: createStats(true),
plugins: [
new rspack.EnvironmentPlugin({
NODE_ENV: env.NODE_ENV || mode,
WEBPACK_HMR_ENABLED: env.WEBPACK_HMR_ENABLED || argv.hot || false,
DEV_SERVER_IP: env.DEV_SERVER_IP || null,
}),
],
});
if (bench) {
config.entry = {
'tgui-bench': ['./packages/tgui-bench/entrypoint'],
};
}
// Development build specific options
if (mode !== 'production') {
config.devtool = 'cheap-module-source-map';
}
// Development server specific options
if (argv.devServer) {
config.devServer = {
progress: false,
quiet: false,
noInfo: false,
clientLogLevel: 'silent',
stats: createStats(false),
};
}
return config;
};
-167
View File
@@ -1,167 +0,0 @@
/**
* @file
* @copyright 2020 Aleksej Komarov
* @license MIT
*/
const webpack = require('webpack');
const path = require('path');
const ExtractCssPlugin = require('mini-css-extract-plugin');
const { createBabelConfig } = require('./babel.config.js');
const createStats = verbose => ({
assets: verbose,
builtAt: verbose,
cached: false,
children: false,
chunks: false,
colors: true,
entrypoints: true,
hash: false,
modules: false,
performance: false,
timings: verbose,
version: verbose,
});
module.exports = (env = {}, argv) => {
const mode = argv.mode === 'production' ? 'production' : 'development';
const config = {
mode,
context: path.resolve(__dirname),
target: ['web', 'browserslist:edge >= 123'],
entry: {
'tgui': [
'./packages/tgui',
],
'tgui-panel': [
'./packages/tgui-panel',
],
},
output: {
path: argv.useTmpFolder
? path.resolve(__dirname, './public/.tmp')
: path.resolve(__dirname, './public'),
filename: '[name].bundle.js',
chunkFilename: '[name].bundle.js',
chunkLoadTimeout: 15000,
},
resolve: {
extensions: ['.tsx', '.ts', '.js'],
alias: {},
},
module: {
rules: [
{
test: /\.(js|cjs|ts|tsx)$/,
use: [
{
loader: require.resolve('babel-loader'),
options: createBabelConfig({ mode }),
},
],
},
{
test: /\.scss$/,
use: [
{
loader: ExtractCssPlugin.loader,
options: {
esModule: false,
},
},
{
loader: require.resolve('css-loader'),
options: {
esModule: false,
},
},
{
loader: require.resolve('sass-loader'),
},
],
},
{
test: /\.(png|jpg|svg)$/,
use: [
{
loader: require.resolve('url-loader'),
options: {
esModule: false,
},
},
],
},
],
},
optimization: {
emitOnErrors: false,
},
performance: {
hints: false,
},
devtool: false,
cache: {
type: 'filesystem',
cacheLocation: path.resolve(__dirname, `.yarn/webpack/${mode}`),
buildDependencies: {
config: [__filename],
},
},
stats: createStats(true),
plugins: [
new webpack.EnvironmentPlugin({
NODE_ENV: env.NODE_ENV || argv.mode || 'development',
WEBPACK_HMR_ENABLED: env.WEBPACK_HMR_ENABLED || argv.hot || false,
DEV_SERVER_IP: env.DEV_SERVER_IP || null,
}),
new ExtractCssPlugin({
filename: '[name].bundle.css',
chunkFilename: '[name].bundle.css',
}),
],
};
// Add a bundle analyzer to the plugins array
if (argv.analyze) {
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
config.plugins = [
...config.plugins,
new BundleAnalyzerPlugin(),
];
}
// Production build specific options
if (argv.mode === 'production') {
const TerserPlugin = require('terser-webpack-plugin');
config.optimization.minimizer = [
new TerserPlugin({
extractComments: false,
terserOptions: {
output: {
ascii_only: true,
comments: false,
},
},
}),
];
}
// Development build specific options
if (argv.mode !== 'production') {
config.devtool = 'cheap-module-source-map';
}
// Development server specific options
if (argv.devServer) {
config.devServer = {
progress: false,
quiet: false,
noInfo: false,
clientLogLevel: 'silent',
stats: createStats(false),
};
}
return config;
};
+2386 -2260
View File
File diff suppressed because it is too large Load Diff