mirror of https://github.com/alibaba/ice.git
feat: big upgrate
This commit is contained in:
parent
58cbbe2344
commit
629a20617a
|
@ -21,6 +21,6 @@
|
|||
"@types/react-dom": "^18.0.2",
|
||||
"express": "^4.19.2",
|
||||
"tslib": "^2.5.0",
|
||||
"tsx": "^3.12.1"
|
||||
"tsx": "^4.19.0"
|
||||
}
|
||||
}
|
|
@ -61,7 +61,7 @@
|
|||
"react-dom": "^18.2.0",
|
||||
"rimraf": "^3.0.2",
|
||||
"stylelint": "^15.10.1",
|
||||
"tsx": "^3.12.1",
|
||||
"tsx": "^4.19.0",
|
||||
"typescript": "^4.7.4",
|
||||
"vitest": "^0.15.2"
|
||||
},
|
||||
|
@ -71,7 +71,6 @@
|
|||
"packageManager": "pnpm@8.9.2",
|
||||
"pnpm": {
|
||||
"patchedDependencies": {
|
||||
"@rspack/core@0.5.7": "patches/@rspack__core@0.5.7.patch",
|
||||
"unplugin@1.6.0": "patches/unplugin@1.6.0.patch"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -49,9 +49,9 @@
|
|||
"mime-types": "2.1.35"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rspack/plugin-react-refresh": "0.5.7",
|
||||
"@rspack/dev-server": "0.5.7",
|
||||
"@rspack/core": "0.5.7",
|
||||
"@rspack/plugin-react-refresh": "1.0.0",
|
||||
"@rspack/dev-server": "1.0.3",
|
||||
"@rspack/core": "1.0.3",
|
||||
"@types/less": "^3.0.3",
|
||||
"@types/lodash": "^4.14.181",
|
||||
"@types/webpack-bundle-analyzer": "^4.4.1",
|
||||
|
@ -82,9 +82,9 @@
|
|||
"terser-webpack-plugin": "5.3.5",
|
||||
"typescript": "^4.6.4",
|
||||
"trusted-cert": "1.1.3",
|
||||
"webpack": "5.88.2",
|
||||
"webpack": "5.94.0",
|
||||
"webpack-bundle-analyzer": "4.5.0",
|
||||
"webpack-dev-server": "4.15.0",
|
||||
"webpack-dev-server": "5.1.0",
|
||||
"unplugin": "1.6.0",
|
||||
"bonjour-service": "^1.0.13",
|
||||
"colorette": "^2.0.10",
|
||||
|
|
|
@ -4,7 +4,6 @@ import { fileURLToPath } from 'url';
|
|||
import fs from 'fs-extra';
|
||||
import ncc from '@vercel/ncc';
|
||||
import chalk from 'chalk';
|
||||
import * as dts from 'dts-bundle';
|
||||
import glob from 'glob';
|
||||
import findUp from 'find-up';
|
||||
import tasks, { taskExternals } from './tasks';
|
||||
|
@ -121,14 +120,14 @@ export async function packDependency(options: Options): Promise<void> {
|
|||
if (pkgJson.types) {
|
||||
dtsName = 'index.d.ts';
|
||||
console.log(chalk.green(`bundle dts file for ${pkgName || file}`));
|
||||
dts.bundle({
|
||||
name: pkgJson.name,
|
||||
outputAsModuleFolder: true,
|
||||
out: path.join(targetPath, dtsName),
|
||||
main: path.join(packageRoot, pkgJson.types),
|
||||
headerPath: '',
|
||||
headerText: '',
|
||||
});
|
||||
// dts.bundle({
|
||||
// name: pkgJson.name,
|
||||
// outputAsModuleFolder: true,
|
||||
// out: path.join(targetPath, dtsName),
|
||||
// main: path.join(packageRoot, pkgJson.types),
|
||||
// headerPath: '',
|
||||
// headerText: '',
|
||||
// });
|
||||
} else {
|
||||
try {
|
||||
const typesRoot = path.dirname(require.resolve(`@types/${pkgName}/package.json`, {
|
||||
|
|
|
@ -147,7 +147,7 @@ const tasks = [
|
|||
const targetPath = path.join(__dirname, '../compiled/mini-css-extract-plugin');
|
||||
const entryPath = path.join(targetPath, 'dist/index.js');
|
||||
fs.copySync(path.join(pkgPath, 'dist'), path.join(targetPath, 'dist'));
|
||||
fs.copyFileSync(path.join(targetPath, 'index.d.ts'), path.join(targetPath, 'dist/index.d.ts'));
|
||||
fs.copySync(path.join(pkgPath, 'types'), path.join(targetPath, 'types'));
|
||||
fs.writeFileSync(entryPath, fs.readFileSync(entryPath, 'utf-8').replace('schema-utils', '@ice/bundles/compiled/schema-utils/index.js'));
|
||||
},
|
||||
},
|
||||
|
@ -295,22 +295,23 @@ const tasks = [
|
|||
const sourcePath = path.join(pkgPath, filePath);
|
||||
const targetPath = path.join(__dirname, `../compiled/@rspack/plugin-react-refresh/${filePath}`);
|
||||
if (path.extname(filePath) === '.js') {
|
||||
const fileContent = fs.readFileSync(sourcePath, 'utf8');
|
||||
fs.writeFileSync(targetPath,
|
||||
replaceDeps(fileContent, webpackDevServerDeps.concat([
|
||||
...commonDeps,
|
||||
'@rspack/core',
|
||||
])),
|
||||
);
|
||||
// const fileContent = fs.readFileSync(sourcePath, 'utf8');
|
||||
// fs.writeFileSync(targetPath,
|
||||
// replaceDeps(fileContent, webpackDevServerDeps.concat([
|
||||
// ...commonDeps,
|
||||
// // '@rspack/core',
|
||||
// ])),
|
||||
// );
|
||||
fs.copyFileSync(sourcePath, targetPath);
|
||||
} else {
|
||||
fs.copyFileSync(sourcePath, targetPath);
|
||||
}
|
||||
});
|
||||
// Overwrite RefreshUtils.js which is customized for ice.js.
|
||||
fs.copyFileSync(
|
||||
path.join(__dirname, '../override/RefreshUtils.js'),
|
||||
path.join(__dirname, '../compiled/@rspack/plugin-react-refresh/client/refreshUtils.js'),
|
||||
);
|
||||
// fs.copyFileSync(
|
||||
// path.join(__dirname, '../override/RefreshUtils.js'),
|
||||
// path.join(__dirname, '../compiled/@rspack/plugin-react-refresh/client/refreshUtils.js'),
|
||||
// );
|
||||
},
|
||||
},
|
||||
];
|
||||
|
|
|
@ -97,9 +97,9 @@
|
|||
"sass": "^1.50.0",
|
||||
"unplugin": "^1.6.0",
|
||||
"webpack": "^5.88.0",
|
||||
"webpack-dev-server": "4.15.0",
|
||||
"@rspack/core": "0.5.7",
|
||||
"@rspack/dev-server": "0.5.7"
|
||||
"webpack-dev-server": "5.1.0",
|
||||
"@rspack/core": "1.0.3",
|
||||
"@rspack/dev-server": "1.0.3"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=18.0.0",
|
||||
|
|
|
@ -19,7 +19,7 @@ const getUrls = ({
|
|||
devServerConfig,
|
||||
}: Options) => {
|
||||
const urlPathname = getRouterBasename(taskConfig, appConfig) || '/';
|
||||
const protocol = devServerConfig.https ? 'https' : 'http';
|
||||
const protocol = typeof devServerConfig?.server === 'object' && devServerConfig?.server.type === 'https' ? 'https' : 'http';
|
||||
const enabledHashRouter = appConfig.router?.type === 'hash';
|
||||
const urls = prepareURLs(
|
||||
protocol,
|
||||
|
|
|
@ -1,13 +1,11 @@
|
|||
import chalk from 'chalk';
|
||||
import type { Stats, MultiStats } from '@rspack/core';
|
||||
import type { StatsCompilation } from 'webpack';
|
||||
import formatWebpackMessages from '../../utils/formatWebpackMessages.js';
|
||||
|
||||
function formatStats(stats: Stats | MultiStats, showWarnings = true) {
|
||||
const statsData = stats.toJson({
|
||||
preset: 'errors-warnings',
|
||||
}) as StatsCompilation;
|
||||
|
||||
});
|
||||
const { errors, warnings } = formatWebpackMessages(statsData);
|
||||
|
||||
if (errors.length) {
|
||||
|
|
|
@ -22,7 +22,7 @@ async function bundler(
|
|||
let compiler: MultiCompiler;
|
||||
let dataLoaderCompiler: Compiler;
|
||||
let devServer: RspackDevServer;
|
||||
const { rspack } = await import('@ice/bundles/esm/rspack.js');
|
||||
const { rspack } = await import('@rspack/core');
|
||||
// Override the type of rspack, because of rspack is imported from pre-compiled bundle.
|
||||
const rspackConfigs = await getConfig(context, options, rspack as unknown as typeof Rspack);
|
||||
try {
|
||||
|
@ -65,7 +65,6 @@ async function bundler(
|
|||
rspackConfigs,
|
||||
};
|
||||
if (command === 'start') {
|
||||
// @ts-expect-error dev-server has been pre-packed, so it will have different type.
|
||||
devServer = await start(buildOptions, dataLoaderCompiler);
|
||||
} else if (command === 'build') {
|
||||
await build(buildOptions);
|
||||
|
|
|
@ -55,7 +55,7 @@ const start = async ({
|
|||
...hooksAPI,
|
||||
});
|
||||
|
||||
const { RspackDevServer } = await import('@ice/bundles/esm/dev-server.js');
|
||||
const { RspackDevServer } = await import('@rspack/dev-server');
|
||||
const devServer = new RspackDevServer(devServerConfig, compiler);
|
||||
|
||||
compiler.hooks.done.tap('done', async stats => {
|
||||
|
|
|
@ -74,7 +74,6 @@ const getWebpackConfig: GetWebpackConfig = async (context, options) => {
|
|||
let webpackConfig = getDefaultWebpackConfig({
|
||||
config,
|
||||
rootDir,
|
||||
// @ts-expect-error fix type error of compiled webpack
|
||||
webpack,
|
||||
runtimeTmpDir: RUNTIME_TMP_DIR,
|
||||
userConfigHash,
|
||||
|
|
|
@ -32,7 +32,6 @@ export async function startDevServer(
|
|||
// Sort by length, shortest path first.
|
||||
a.split('/').filter(Boolean).length - b.split('/').filter(Boolean).length);
|
||||
const webTaskConfig = taskConfigs.find(({ name }) => name === WEB);
|
||||
// @ts-expect-error webpack-dev-server types in Configuration is missing.
|
||||
const originalDevServer: DevServerConfiguration = webpackConfigs[0].devServer;
|
||||
const customMiddlewares = originalDevServer?.setupMiddlewares;
|
||||
const defaultDevServerConfig = await getDefaultServerConfig(originalDevServer, commandArgs);
|
||||
|
|
|
@ -562,7 +562,6 @@ const cliOption = [
|
|||
if (host && host !== 'localhost') {
|
||||
hosts.push(host);
|
||||
}
|
||||
// @ts-expect-error certificateFor types
|
||||
const certInfo = await certificateFor(hosts, { silent: true });
|
||||
const key = await fse.readFile(certInfo.keyFilePath, 'utf8');
|
||||
const cert = await fse.readFile(certInfo.certFilePath, 'utf8');
|
||||
|
|
|
@ -38,13 +38,15 @@ export default function createDataLoaderMiddleware(compiler: Compiler): Middlewa
|
|||
if (method !== 'GET') {
|
||||
return next();
|
||||
}
|
||||
const publicPath = compiler.options.output?.publicPath
|
||||
? `${compiler.options.output.publicPath.replace(/\/$/, '')}/`
|
||||
const orginalPublicPath = compiler.options.output?.publicPath;
|
||||
const publicPath = orginalPublicPath && typeof orginalPublicPath === 'string'
|
||||
? `${orginalPublicPath.replace(/\/$/, '')}/`
|
||||
: '/';
|
||||
const filePath = parse(url || '').pathname;
|
||||
const filename = filePath?.startsWith(publicPath) ? filePath.slice(publicPath.length) : filePath.slice(1);
|
||||
// Mark sure the compiler is ready.
|
||||
await compileTask;
|
||||
// @ts-expect-error
|
||||
const buffer = compiler.getAsset(filename);
|
||||
|
||||
if (!buffer) {
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
// This file is based on https://github.com/facebook/create-react-app/blob/main/packages/react-dev-utils/formatWebpackMessages.js
|
||||
// It's been rewrite to ts and ICE specific logic
|
||||
import type { StatsCompilation } from 'webpack';
|
||||
import type { StatsCompilation as RspackStatsCompilation } from '@rspack/core';
|
||||
|
||||
const friendlySyntaxErrorLabel = 'Syntax error:';
|
||||
|
||||
|
@ -8,7 +9,7 @@ type IsLikelyASyntaxError = (message: string) => boolean;
|
|||
type Message = string | { message: string } | { message: string }[];
|
||||
type FormatMessage = (message: Message) => string;
|
||||
type FormatWebpackMessages = (
|
||||
json: StatsCompilation,
|
||||
json: StatsCompilation | RspackStatsCompilation,
|
||||
) => { errors: string[]; warnings: string[] };
|
||||
|
||||
const isLikelyASyntaxError: IsLikelyASyntaxError = message => {
|
||||
|
|
|
@ -59,7 +59,6 @@ export default class ServerCompilerPlugin {
|
|||
compiler.hooks.watchRun.tap(pluginName, () => {
|
||||
this.isCompiling = true;
|
||||
});
|
||||
// @ts-expect-error webpack hooks type not match.
|
||||
compiler.hooks.emit.tapPromise(pluginName, async (compilation: Compilation) => {
|
||||
this.isCompiling = false;
|
||||
await this.compileTask(compilation);
|
||||
|
|
|
@ -53,7 +53,7 @@
|
|||
"@types/accept-language-parser": "^1.5.3",
|
||||
"@types/react": "^18.0.33",
|
||||
"cross-env": "^7.0.3",
|
||||
"webpack-dev-server": "4.15.0"
|
||||
"webpack-dev-server": "5.1.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@ice/app": "^3.4.11",
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
"build-scripts": "^2.1.2-0",
|
||||
"esbuild": "^0.17.16",
|
||||
"webpack": "^5.88.0",
|
||||
"webpack-dev-server": "4.15.0"
|
||||
"webpack-dev-server": "5.1.0"
|
||||
},
|
||||
"repository": {
|
||||
"type": "http",
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
"@ice/shared-config": "1.2.8"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rspack/core": "0.5.7"
|
||||
"@rspack/core": "1.0.3"
|
||||
},
|
||||
"scripts": {
|
||||
"watch": "tsc -w --sourceMap",
|
||||
|
|
|
@ -6,6 +6,7 @@ import type { Configuration, rspack as Rspack } from '@rspack/core';
|
|||
import lodash from '@ice/bundles/compiled/lodash/index.js';
|
||||
import { coreJsPath } from '@ice/bundles';
|
||||
import RefreshPlugin from '@ice/bundles/esm/plugin-refresh.js';
|
||||
// import RefreshPlugin from '@ice/bundles/node_modules/@rspack/plugin-react-refresh/dist/index.js';
|
||||
import getSplitChunks, { getFrameworkBundles } from './splitChunks.js';
|
||||
import getAssetsRule from './assetsRule.js';
|
||||
import getCssRules from './cssRules.js';
|
||||
|
@ -204,6 +205,7 @@ const getConfig: GetConfig = async (options) => {
|
|||
},
|
||||
}];
|
||||
}
|
||||
console.log('excludeRule', [...compileExclude, 'bundles/compiled']);
|
||||
const config: Configuration = {
|
||||
entry: entry || {
|
||||
main: [path.join(rootDir, runtimeTmpDir, 'entry.client.tsx')],
|
||||
|
@ -223,9 +225,47 @@ const getConfig: GetConfig = async (options) => {
|
|||
context: rootDir,
|
||||
module: {
|
||||
rules: [
|
||||
// {
|
||||
// test: /\.ts$/,
|
||||
// exclude: [/node_modules/],
|
||||
// loader: 'builtin:swc-loader',
|
||||
// options: {
|
||||
// jsc: {
|
||||
// parser: {
|
||||
// syntax: 'typescript',
|
||||
// },
|
||||
// },
|
||||
// },
|
||||
// type: 'javascript/auto',
|
||||
// },
|
||||
// {
|
||||
// test: /\.(jsx?|tsx?|mjs)$/,
|
||||
// use: {
|
||||
// loader: 'builtin:compilation-loader',
|
||||
// options: {
|
||||
// jsc: {
|
||||
// parser: {
|
||||
// syntax: 'typescript',
|
||||
// jsx: true,
|
||||
// },
|
||||
// transform: {
|
||||
// react: {
|
||||
// pragma: 'React.createElement',
|
||||
// pragmaFrag: 'React.Fragment',
|
||||
// throwIfNamespace: true,
|
||||
// development: false,
|
||||
// useBuiltins: false,
|
||||
// },
|
||||
// },
|
||||
// },
|
||||
// },
|
||||
// },
|
||||
// type: 'javascript/auto',
|
||||
// },
|
||||
{
|
||||
test: /\.(jsx?|tsx?|mjs)$/,
|
||||
...(excludeRule ? { exclude: new RegExp(excludeRule) } : {}),
|
||||
...(excludeRule ? { exclude: new RegExp('node_module') } : {}),
|
||||
// exclude: /compiled/,
|
||||
use: {
|
||||
loader: 'builtin:compilation-loader',
|
||||
options: {
|
||||
|
@ -239,22 +279,22 @@ const getConfig: GetConfig = async (options) => {
|
|||
},
|
||||
type: 'javascript/auto',
|
||||
},
|
||||
{
|
||||
test: /__barrel_optimize__/,
|
||||
use: ({ realResource }: { realResource: string }) => {
|
||||
const names = (
|
||||
realResource.match(/\?names=([^&]+)!=!/)?.[1] || ''
|
||||
).split(',');
|
||||
return [{
|
||||
loader: 'builtin:barrel-loader',
|
||||
options: {
|
||||
names,
|
||||
cacheDir,
|
||||
},
|
||||
}];
|
||||
},
|
||||
type: 'javascript/auto',
|
||||
},
|
||||
// {
|
||||
// test: /__barrel_optimize__/,
|
||||
// use: ({ realResource }: { realResource: string }) => {
|
||||
// const names = (
|
||||
// realResource.match(/\?names=([^&]+)!=!/)?.[1] || ''
|
||||
// ).split(',');
|
||||
// return [{
|
||||
// loader: 'builtin:barrel-loader',
|
||||
// options: {
|
||||
// names,
|
||||
// cacheDir,
|
||||
// },
|
||||
// }];
|
||||
// },
|
||||
// type: 'javascript/auto',
|
||||
// },
|
||||
...getAssetsRule(),
|
||||
...getCssRules({
|
||||
rootDir,
|
||||
|
@ -262,6 +302,11 @@ const getConfig: GetConfig = async (options) => {
|
|||
postcssOptions: postcss,
|
||||
}),
|
||||
],
|
||||
generator: {
|
||||
'css/auto': {
|
||||
localIdentName,
|
||||
},
|
||||
},
|
||||
},
|
||||
resolve: {
|
||||
extensions: ['...', '.ts', '.tsx', '.jsx'],
|
||||
|
@ -279,7 +324,6 @@ const getConfig: GetConfig = async (options) => {
|
|||
minimize: !!minify,
|
||||
...(splitChunksStrategy ? { splitChunks: splitChunksStrategy } : {}),
|
||||
},
|
||||
// @ts-expect-error plugin instance defined by default in not compatible with rspack.
|
||||
plugins: [
|
||||
...plugins,
|
||||
// Unplugin should be compatible with rspack.
|
||||
|
@ -308,10 +352,8 @@ const getConfig: GetConfig = async (options) => {
|
|||
}],
|
||||
}),
|
||||
].filter(Boolean),
|
||||
builtins: {
|
||||
css: {
|
||||
modules: { localIdentName },
|
||||
},
|
||||
experiments: {
|
||||
css: true,
|
||||
},
|
||||
stats: 'none',
|
||||
infrastructureLogging: {
|
||||
|
@ -334,11 +376,14 @@ const getConfig: GetConfig = async (options) => {
|
|||
client: {
|
||||
logging: 'info',
|
||||
},
|
||||
https,
|
||||
server: typeof https === 'object' ? {
|
||||
type: 'https',
|
||||
options: https,
|
||||
} : undefined,
|
||||
...devServer,
|
||||
setupMiddlewares: middlewares,
|
||||
},
|
||||
features: builtinFeatures,
|
||||
// features: builtinFeatures,
|
||||
};
|
||||
// Compatible with API configureWebpack.
|
||||
const ctx = {
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
"esbuild": "^0.17.16",
|
||||
"postcss": "^8.4.31",
|
||||
"webpack": "^5.86.0",
|
||||
"webpack-dev-server": "4.15.0"
|
||||
"webpack-dev-server": "5.1.0"
|
||||
},
|
||||
"scripts": {
|
||||
"watch": "tsc -w --sourceMap",
|
||||
|
|
|
@ -348,7 +348,10 @@ export function getWebpackConfig(options: GetWebpackConfigOptions): Configuratio
|
|||
logging: 'info',
|
||||
},
|
||||
setupMiddlewares: middlewares,
|
||||
https,
|
||||
server: typeof https === 'object' ? {
|
||||
type: 'https',
|
||||
options: https,
|
||||
} : undefined,
|
||||
}, devServer || {}) as Config['devServer'],
|
||||
} as Configuration;
|
||||
// tnpm / cnpm 安装时,webpack 5 的持久缓存无法生成,长时间将导致 OOM
|
||||
|
|
14574
pnpm-lock.yaml
14574
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue