@qse/edu-scripts 0.0.0-beta.4 → 0.0.0-beta.5

package/asset/template/edu-scripts.override.js.tpl

@@ -1,6 +1,6 @@
-const { defineConfig } = require('@qse/edu-scripts')
+import { defineConfig } from '@qse/edu-scripts'
 
-module.exports = defineConfig({
+export default defineConfig({
   startup: ({ logger, chalk }) => {
     logger.info('本地免登录开发地址:', chalk.cyan(`http://127.0.0.1:${process.env.PORT}/index.html`))
   },

package/asset/template/tailwind.config.js.tpl

@@ -1,5 +1,5 @@
 /** @type {import('tailwindcss').Config} */
-module.exports = {
+export default {
   content: ['./src/**/*.{js,jsx,ts,tsx}'],
   theme: {
     extend: {},

package/dist/cli.mjs

@@ -166,7 +166,13 @@ const PostcssSafeAreaPlugin = () => {
 };
 
 //#endregion
-//#region src/config/webpackConfig.js
+//#region src/utils/resolveModule.ts
+function resolveModule(mod) {
+	return mod.default ? mod.default : mod;
+}
+
+//#endregion
+//#region src/config/webpackConfig.ts
 const require$2 = createRequire(import.meta.url);
 const appPkg$1 = fs.readJsonSync(paths.package);
 const jsMainPath = appConfig.grayscale ? `${appPkg$1.name}/beta/${appPkg$1.name}` : `${appPkg$1.name}/${appPkg$1.name}`;
@@ -191,10 +197,6 @@ const qseCDN = (() => {
 		isUseQsbSchemeRender: include("qsb-scheme-render.min.js")
 	};
 })();
-/**
-* @param {*} args
-* @param {import('../utils/defineConfig.js').Configuration} override
-*/
 function getWebpackConfig(args, override) {
 	const isDev = process.env.NODE_ENV === "development";
 	const isProd = process.env.NODE_ENV === "production";
@@ -225,7 +227,7 @@ function getWebpackConfig(args, override) {
 							isProd && PostcssSafeAreaPlugin(),
 							isProd && [require$2.resolve("postcss-momentum-scrolling"), ["scroll", "auto"]],
 							require$2.resolve("postcss-normalize"),
-							...override.extraPostCSSPlugins
+							...override.extraPostCSSPlugins || []
 						].filter(Boolean)
 					},
 					sourceMap: isDev
@@ -237,7 +239,7 @@ function getWebpackConfig(args, override) {
 			options: {
 				lessOptions: {
 					javascriptEnabled: true,
-					modifyVars: fs.existsSync(paths.theme) ? require$2(paths.theme) : void 0
+					modifyVars: fs.existsSync(paths.theme) ? resolveModule(require$2(paths.theme)) : void 0
 				},
 				sourceMap: true
 			}
@@ -304,7 +306,11 @@ function getWebpackConfig(args, override) {
 				".tsx",
 				".json",
 				".wasm"
-			]
+			],
+			tsConfig: {
+				configFile: paths.tsconfig,
+				references: "auto"
+			}
 		},
 		stats: false,
 		devtool: isDev ? "cheap-module-source-map" : false,
@@ -322,8 +328,9 @@ function getWebpackConfig(args, override) {
 						env: { targets: process.env.BROWSERSLIST },
 						rspackExperiments: { import: [{
 							libraryName: "lodash",
-							customName: "lodash/{{member}}"
-						}, ...override.import] },
+							libraryDirectory: "",
+							camelToDashComponentName: false
+						}, ...override.import || []] },
 						isModule: "unknown",
 						jsc: {
 							parser: {
@@ -537,8 +544,7 @@ const setupMock = debounce(function setupMock() {
 	for (const file of files) {
 		delete require$1.cache[require$1.resolve(file)];
 		try {
-			let mock = require$1(file);
-			mock = mock.default || mock;
+			const mock = resolveModule(require$1(file));
 			for (const key in mock) {
 				const [method, path] = key.split(" ");
 				mockCache[key] = {
@@ -633,7 +639,7 @@ function setupMockServer(middelwaves, _devServer) {
 }
 
 //#endregion
-//#region src/config/webpackDevServerConfig.js
+//#region src/config/webpackDevServerConfig.ts
 function createProxy(context, target, origin) {
 	const url = new URL(origin || target);
 	return {
@@ -647,13 +653,8 @@ function createProxy(context, target, origin) {
 		}
 	};
 }
-/**
-* @param {*} args
-* @param {import('../utils/defineConfig.js').Configuration} override
-*/
 function getWebpackDevServerConfig(args, override) {
 	const host = process.env.HOST || "0.0.0.0";
-	/** @type {import('@rspack/dev-server').Configuration} */
 	const devServer = {
 		allowedHosts: "all",
 		historyApiFallback: true,
@@ -680,10 +681,10 @@ function getWebpackDevServerConfig(args, override) {
 		compress: true
 	};
 	if (override.proxy) {
-		if (Array.isArray(override.proxy)) devServer.proxy = [...override.proxy, ...devServer.proxy];
+		if (Array.isArray(override.proxy)) devServer.proxy = [...override.proxy, ...devServer.proxy || []];
 		else if (typeof override.proxy === "object") devServer.proxy = [...Object.entries(override.proxy).map(([context, target]) => {
 			return createProxy(context, target);
-		}), ...devServer.proxy];
+		}), ...devServer.proxy || []];
 		else throw new Error("proxy 必须是数组或对象");
 		const proxyMap = /* @__PURE__ */ new Map();
 		devServer.proxy = devServer.proxy.filter((item) => {
@@ -713,7 +714,7 @@ function getOverride() {
 	if (override) return override;
 	override = Object.assign({}, defaultOverride);
 	if (fs.existsSync(paths.override)) {
-		const userOverride = require(paths.override);
+		const userOverride = resolveModule(require(paths.override));
 		if (typeof userOverride !== "object") throw new Error("格式错误，请使用 npx edu g override 生成文件");
 		Object.assign(override, userOverride);
 	}
@@ -770,7 +771,7 @@ async function start(args) {
 }
 
 //#endregion
-//#region src/utils/FileSizeReporter.js
+//#region src/utils/FileSizeReporter.ts
 /**
 * Copyright (c) 2015-present, Facebook, Inc.
 *
@@ -781,15 +782,15 @@ function canReadAsset(asset) {
 	return /\.(js|css)$/.test(asset) && !/service-worker\.js/.test(asset) && !/precache-manifest\.[0-9a-f]+\.js/.test(asset);
 }
 function printFileSizesAfterBuild(webpackStats, previousSizeMap, buildFolder, maxBundleGzipSize, maxChunkGzipSize) {
-	var root = previousSizeMap.root;
-	var sizes = previousSizeMap.sizes;
-	var assets = (webpackStats.stats || [webpackStats]).map((stats) => stats.toJson({
+	const root = previousSizeMap.root;
+	const sizes = previousSizeMap.sizes;
+	const assets = (webpackStats.stats || [webpackStats]).map((stats) => stats.toJson({
 		all: false,
 		assets: true
 	}).assets.filter((asset) => canReadAsset(asset.name)).map((asset) => {
-		var size = gzipSizeSync(fs.readFileSync(path.join(root, asset.name)));
-		var previousSize = sizes[removeFileNameHash(root, asset.name)];
-		var difference = getDifferenceLabel(size, previousSize);
+		const size = gzipSizeSync(fs.readFileSync(path.join(root, asset.name)));
+		const previousSize = sizes[removeFileNameHash(root, asset.name)];
+		const difference = getDifferenceLabel(size, previousSize);
 		return {
 			folder: path.join(path.basename(buildFolder), path.dirname(asset.name)),
 			name: path.basename(asset.name),
@@ -800,20 +801,20 @@ function printFileSizesAfterBuild(webpackStats, previousSizeMap, buildFolder, ma
 	if (assets.length === 0) return;
 	console.log("\ngzip 后文件大小:\n");
 	assets.sort((a, b) => b.size - a.size);
-	var mainAssetIdx = assets.findIndex((asset) => /_\d+\.\d+\.\d+/.test(asset.name));
+	const mainAssetIdx = assets.findIndex((asset) => /_\d+\.\d+\.\d+/.test(asset.name));
 	assets.unshift(assets.splice(mainAssetIdx, 1)[0]);
-	var longestSizeLabelLength = Math.max.apply(null, assets.map((a) => stripAnsi(a.sizeLabel).length));
-	var suggestBundleSplitting = false;
+	const longestSizeLabelLength = Math.max.apply(null, assets.map((a) => stripAnsi(a.sizeLabel).length));
+	let suggestBundleSplitting = false;
 	assets.forEach((asset) => {
-		var sizeLabel = asset.sizeLabel;
-		var sizeLength = stripAnsi(sizeLabel).length;
+		let sizeLabel = asset.sizeLabel;
+		const sizeLength = stripAnsi(sizeLabel).length;
 		if (sizeLength < longestSizeLabelLength) {
-			var rightPadding = " ".repeat(longestSizeLabelLength - sizeLength);
+			const rightPadding = " ".repeat(longestSizeLabelLength - sizeLength);
 			sizeLabel += rightPadding;
 		}
-		var isMainBundle = /_\d+\.\d+\.\d+\./.test(asset.name);
-		var maxRecommendedSize = isMainBundle ? maxBundleGzipSize : maxChunkGzipSize;
-		var isLarge = maxRecommendedSize && asset.size > maxRecommendedSize;
+		const isMainBundle = /_\d+\.\d+\.\d+\./.test(asset.name);
+		const maxRecommendedSize = isMainBundle ? maxBundleGzipSize : maxChunkGzipSize;
+		const isLarge = maxRecommendedSize && asset.size > maxRecommendedSize;
 		if (isLarge && path.extname(asset.name) === ".js") suggestBundleSplitting = true;
 		console.log("  " + (isLarge ? chalk.yellow(sizeLabel) : sizeLabel) + "  " + chalk.dim(asset.folder + path.sep) + chalk.cyan(asset.name));
 		if (isMainBundle) console.log("");
@@ -830,9 +831,9 @@ function removeFileNameHash(buildFolder, fileName) {
 	return fileName.replace(buildFolder, "").replace(/\\/g, "/").replace(/\/\d+\.\d+\.\d+\//, "/").replace(/\/?(.*)(\.[0-9a-f]+)(\.chunk)?(\.js|\.css)/, (match, p1, p2, p3, p4) => p1 + p4);
 }
 function getDifferenceLabel(currentSize, previousSize) {
-	var FIFTY_KILOBYTES = 1024 * 50;
-	var difference = currentSize - previousSize;
-	var fileSize = !Number.isNaN(difference) ? filesize(difference) : 0;
+	const FIFTY_KILOBYTES = 1024 * 50;
+	const difference = currentSize - previousSize;
+	const fileSize = !Number.isNaN(difference) ? filesize(difference) : 0;
 	if (difference >= FIFTY_KILOBYTES) return chalk.red("+" + fileSize);
 	else if (difference < FIFTY_KILOBYTES && difference > 0) return chalk.yellow("+" + fileSize);
 	else if (difference < 0) return chalk.green(fileSize);
@@ -841,10 +842,10 @@ function getDifferenceLabel(currentSize, previousSize) {
 function measureFileSizesBeforeBuild(buildFolder) {
 	return new Promise((resolve) => {
 		recursive(buildFolder, (err, fileNames) => {
-			var sizes;
+			let sizes;
 			if (!err && fileNames) sizes = fileNames.filter(canReadAsset).reduce((memo, fileName) => {
-				var contents = fs.readFileSync(fileName);
-				var key = removeFileNameHash(buildFolder, fileName);
+				const contents = fs.readFileSync(fileName);
+				const key = removeFileNameHash(buildFolder, fileName);
 				memo[key] = gzipSizeSync(contents);
 				return memo;
 			}, {});
@@ -899,7 +900,7 @@ async function build(args) {
 }
 
 //#endregion
-//#region src/utils/changeDeployVersion.js
+//#region src/utils/changeDeployVersion.ts
 const TARGET_IDENTIFIER_NAME = "project_apiArr";
 const MODULE_IDENTIFIER_NAME = "module";
 function changeDeployVersion(code, pkg) {
@@ -911,9 +912,6 @@ function changeDeployVersion(code, pkg) {
 		throw new Error(`代码解析错误: ${error.message}`, { cause: error });
 	}
 	const keyName = grayscale ? "grayscale" : "main";
-	/**
-	* @return {babel.NodePath<t.VariableDeclarator> | undefined}
-	*/
 	function findTargetDeclarator(ast) {
 		let res;
 		traverse(ast, { VariableDeclarator(path) {
@@ -921,44 +919,33 @@ function changeDeployVersion(code, pkg) {
 		} });
 		return res;
 	}
-	/**
-	* @param {babel.NodePath<t.VariableDeclarator>} path
-	* @return {babel.NodePath<t.ObjectExpression> | undefined}
-	*/
 	function findModuleObject(path) {
 		let res;
 		path.traverse({ ObjectExpression(path) {
-			if (path.node.properties.some((node) => types.isIdentifier(node.key, { name: MODULE_IDENTIFIER_NAME }) && types.isLiteral(node.value, { value: name }))) res = path;
+			if (path.node.properties.some((node) => types.isObjectProperty(node) && types.isIdentifier(node.key, { name: MODULE_IDENTIFIER_NAME }) && types.isLiteral(node.value, { value: name }))) res = path;
 		} });
 		return res;
 	}
-	/**
-	* @param {babel.NodePath<t.ObjectExpression>} path
-	*/
 	function modifyModuleVersion(path) {
 		let hasModify = false;
 		path.traverse({ Property(path) {
-			if (path.node.key.name === keyName) {
-				path.node.value.value = version;
+			if (types.isObjectProperty(path.node) && types.isIdentifier(path.node.key, { name: keyName })) {
+				if (types.isStringLiteral(path.node.value)) path.node.value.value = version;
 				hasModify = true;
 			}
 		} });
 		if (!hasModify) path.node.properties.push(types.objectProperty(types.identifier(keyName), types.stringLiteral(version)));
 	}
-	/**
-	* @param {babel.NodePath<t.ObjectExpression>} path
-	*/
 	function deleteModuleComments(path) {
 		path.traverse({ ObjectExpression(path) {
 			delete path.node.leadingComments;
 		} });
 	}
-	/**
-	* @param {babel.NodePath<t.VariableDeclarator>} path
-	*/
 	function addModuleToTarget(path) {
-		const elements = path.node.init.elements;
-		elements.splice(elements.length - 2, 0, types.objectExpression([types.objectProperty(types.identifier(MODULE_IDENTIFIER_NAME), types.stringLiteral(name)), types.objectProperty(types.identifier(keyName), types.stringLiteral(version))]));
+		if (types.isArrayExpression(path.node.init)) {
+			const elements = path.node.init.elements;
+			elements.splice(elements.length - 2, 0, types.objectExpression([types.objectProperty(types.identifier(MODULE_IDENTIFIER_NAME), types.stringLiteral(name)), types.objectProperty(types.identifier(keyName), types.stringLiteral(version))]));
+		}
 	}
 	const targetPath = findTargetDeclarator(ast);
 	if (!targetPath) throw new Error(`ver.js 不合规范，未找到参数 ${TARGET_IDENTIFIER_NAME}`);
@@ -966,10 +953,12 @@ function changeDeployVersion(code, pkg) {
 	if (moduleObjPath) modifyModuleVersion(moduleObjPath);
 	else addModuleToTarget(targetPath);
 	deleteModuleComments(targetPath);
-	return transformFromAstSync(ast, void 0, {
+	const result = transformFromAstSync(ast, void 0, {
 		filename: "ver.js",
 		minified: true
-	}).code;
+	});
+	if (!result || !result.code) throw new Error("代码转换失败");
+	return result.code;
 }
 
 //#endregion

package/dist/index.d.mts

@@ -1,22 +1,18 @@
 import { Chalk } from "chalk";
-import { Compiler, Configuration } from "@rspack/core";
+import { Compiler, Configuration, SwcLoaderOptions } from "@rspack/core";
 import { Configuration as Configuration$1 } from "@rspack/dev-server";
 import { RequestHandler } from "express";
 
 //#region src/utils/defineConfig.d.ts
 type ProxyConfigArray = NonNullable<Configuration$1['proxy']>;
-type BabelImportPlugin = {
-  libraryName: string;
-  libraryDirectory?: string;
-  customName?: string;
-  style?: boolean | 'css' | string;
-};
 type Configuration$2 = {
   webpack?: (config: Configuration) => Configuration | undefined;
   devServer?: (config: Configuration$1) => Configuration$1 | undefined;
   /**
    * webpack alias 配置，会与内置 alias 合并
    *
+   * 会自动读取 tsconfig 里 baseUrl + paths 的配置
+   *
    * @default
    * { '@': './src' }
    */
@@ -71,12 +67,10 @@ type Configuration$2 = {
   /**
    * 与 babel-plugin-import 类似，但是内部是 rspack 重构，libraryDirectory 默认值是 lib
    *
-   * 如果 libraryDirectory 传 ’‘ 则必须使用 customName 来写
-   *
    * @see https://rspack.rs/zh/guide/features/builtin-swc-loader#rspackexperimentsimport
-   * @default [{libraryName: 'lodash', customName: 'lodash/{{member}}'}]
+   * @default [{libraryName: 'lodash',libraryDirectory: '',camelToDashComponentName: false}]
    */
-  import?: BabelImportPlugin[];
+  import?: NonNullable<SwcLoaderOptions['rspackExperiments']>['import'];
 };
 declare function defineConfig(config: Configuration$2): Configuration$2;
 //#endregion

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qse/edu-scripts",
-  "version": "0.0.0-beta.4",
+  "version": "0.0.0-beta.5",
   "author": "Kinoko",
   "license": "MIT",
   "type": "module",
@@ -15,7 +15,7 @@
     "docs:deploy": "ssh-sftp",
     "build": "tsdown",
     "deploy": "node scripts/deploy.js",
-    "release": "npm run test && npm run build && npm publish && rimraf es",
+    "release": "npm run test && npm run build && npm publish && rimraf dist",
     "prettier": "prettier -c -w \"src/**/*.{js,jsx,tsx,ts,less,md,json}\"",
     "lint": "eslint --fix src",
     "postversion": "npm run release",

package/src/config/plugins/mock-server/index.ts

@@ -9,6 +9,7 @@ import cookieParser from 'cookie-parser'
 import multer from 'multer'
 import { pathToRegexp, type Key } from 'path-to-regexp'
 import { createRequire } from 'node:module'
+import { resolveModule } from '@/utils/resolveModule'
 const require = createRequire(import.meta.url)
 const { register } = require('@swc-node/register/register')
 
@@ -31,8 +32,7 @@ const setupMock = debounce(function setupMock() {
   for (const file of files) {
     delete require.cache[require.resolve(file)]
     try {
-      let mock = require(file)
-      mock = mock.default || mock
+      const mock = resolveModule(require(file))
 
       for (const key in mock) {
         const [method, path] = key.split(' ')

package/src/config/{webpackConfig.js → webpackConfig.ts}

@@ -1,15 +1,19 @@
 import { RsdoctorRspackPlugin } from '@rsdoctor/rspack-plugin'
 import { rspack } from '@rspack/core'
+import type { Configuration, Compiler, RuleSetRule, SwcLoaderOptions } from '@rspack/core'
 import ReactRefreshPlugin from '@rspack/plugin-react-refresh'
 import chalk from 'chalk'
 import fs from 'fs-extra'
 import HtmlWebpackPlugin from 'html-webpack-plugin'
 import { createRequire } from 'node:module'
-import appConfig from '../utils/appConfig.js'
-import paths from './paths.js'
-import PostcssSafeAreaPlugin from './plugins/postcss-safe-area.js'
+import appConfig from '../utils/appConfig'
+import type { Configuration as CustomConfiguration } from '../utils/defineConfig'
+import paths from './paths'
+import PostcssSafeAreaPlugin from './plugins/postcss-safe-area'
+import { resolveModule } from '@/utils/resolveModule'
+
 const require = createRequire(import.meta.url)
-const appPkg = fs.readJsonSync(paths.package)
+const appPkg = fs.readJsonSync(paths.package) as { name: string; version: string }
 
 const jsMainPath = appConfig.grayscale
   ? `${appPkg.name}/beta/${appPkg.name}`
@@ -25,10 +29,19 @@ const lessModuleRegex = /\.module\.less$/
 
 const imageInlineSizeLimit = 10 * 1024
 
-const qseCDN = (() => {
+interface QseCDN {
+  isUseCommon: boolean
+  isUseAxios: boolean
+  isUseMoment: boolean
+  isUseAntd: boolean
+  isUseQsbAntd: boolean
+  isUseQsbSchemeRender: boolean
+}
+
+const qseCDN: QseCDN = (() => {
   const contents = paths.indexHTML.map((url) => fs.readFileSync(url, 'utf-8'))
 
-  function include(pattern) {
+  function include(pattern: string | RegExp): boolean {
     const regexp = new RegExp(pattern)
     return contents.some((content) => regexp.test(content))
   }
@@ -43,16 +56,21 @@ const qseCDN = (() => {
   }
 })()
 
-/**
- * @param {*} args
- * @param {import('../utils/defineConfig.js').Configuration} override
- */
-export default function getWebpackConfig(args, override) {
+interface CSSLoaderOptions {
+  importLoaders: number
+  sourceMap: boolean
+  modules: {
+    mode: 'global' | 'local'
+    localIdentName: string
+  }
+}
+
+export default function getWebpackConfig(args: any, override: CustomConfiguration): Configuration {
   const isDev = process.env.NODE_ENV === 'development'
   const isProd = process.env.NODE_ENV === 'production'
 
   // common function to get style loaders
-  const getStyleLoaders = (cssOptions, preProcessor) => {
+  const getStyleLoaders = (cssOptions: CSSLoaderOptions, preProcessor?: string) => {
     const loaders = [
       {
         loader: require.resolve('style-loader'),
@@ -89,7 +107,7 @@ export default function getWebpackConfig(args, override) {
               isProd && PostcssSafeAreaPlugin(),
               isProd && [require.resolve('postcss-momentum-scrolling'), ['scroll', 'auto']],
               require.resolve('postcss-normalize'),
-              ...override.extraPostCSSPlugins,
+              ...(override.extraPostCSSPlugins || []),
             ].filter(Boolean),
           },
           sourceMap: isDev,
@@ -102,19 +120,20 @@ export default function getWebpackConfig(args, override) {
         options: {
           lessOptions: {
             javascriptEnabled: true,
-            modifyVars: fs.existsSync(paths.theme) ? require(paths.theme) : undefined,
+            modifyVars: fs.existsSync(paths.theme)
+              ? resolveModule(require(paths.theme))
+              : undefined,
           },
           sourceMap: true,
         },
-      })
+      } as any)
     }
     return loaders
   }
 
-  /** @type {import('@rspack/core').Configuration} */
-  const config = {
+  const config: Configuration = {
     context: process.cwd(),
-    mode: process.env.NODE_ENV,
+    mode: process.env.NODE_ENV as 'development' | 'production' | 'none',
     entry: './src/index',
     target: 'browserslist',
     output: {
@@ -184,6 +203,10 @@ export default function getWebpackConfig(args, override) {
         ...override.alias,
       },
       extensions: ['.web.js', '.web.mjs', '.js', '.mjs', '.jsx', '.ts', '.tsx', '.json', '.wasm'],
+      tsConfig: {
+        configFile: paths.tsconfig,
+        references: 'auto',
+      },
     },
     stats: false,
     devtool: isDev ? 'cheap-module-source-map' : false,
@@ -207,9 +230,10 @@ export default function getWebpackConfig(args, override) {
                       import: [
                         {
                           libraryName: 'lodash',
-                          customName: 'lodash/{{member}}',
+                          libraryDirectory: '',
+                          camelToDashComponentName: false,
                         },
-                        ...override.import,
+                        ...(override.import || []),
                       ],
                     },
                     isModule: 'unknown',
@@ -229,7 +253,7 @@ export default function getWebpackConfig(args, override) {
                         },
                       },
                     },
-                  },
+                  } satisfies SwcLoaderOptions,
                 },
               ],
             },
@@ -365,7 +389,7 @@ export default function getWebpackConfig(args, override) {
               test: /\.(?!(?:js|mjs|jsx|ts|tsx|html|json)$)[^.]+$/,
               type: 'asset/resource',
             },
-          ].filter(Boolean),
+          ].filter(Boolean) as RuleSetRule[],
         },
       ],
     },
@@ -417,7 +441,7 @@ export default function getWebpackConfig(args, override) {
         : []),
       process.env.ANALYZE && isProd && new RsdoctorRspackPlugin(),
       isDev &&
-        ((compiler) => {
+        ((compiler: Compiler) => {
           let isFirst = true
           compiler.hooks.afterDone.tap('edu-scripts-startup', (stats) => {
             if (!isFirst) console.clear()

package/src/config/{webpackDevServerConfig.js → webpackDevServerConfig.ts}

@@ -1,6 +1,15 @@
+import type { Configuration } from '@rspack/dev-server'
+import type { Configuration as CustomConfiguration } from '../utils/defineConfig'
 import setupMockServer from './plugins/mock-server'
 
-function createProxy(context, target, origin) {
+interface ProxyConfig {
+  context: string[]
+  target: string
+  changeOrigin: boolean
+  onProxyReq: (proxyReq: any) => void
+}
+
+function createProxy(context: string, target: string, origin?: string): ProxyConfig {
   const url = new URL(origin || target)
 
   return {
@@ -15,15 +24,10 @@ function createProxy(context, target, origin) {
   }
 }
 
-/**
- * @param {*} args
- * @param {import('../utils/defineConfig.js').Configuration} override
- */
-export default function getWebpackDevServerConfig(args, override) {
+export default function getWebpackDevServerConfig(args: any, override: CustomConfiguration): Configuration {
   const host = process.env.HOST || '0.0.0.0'
 
-  /** @type {import('@rspack/dev-server').Configuration} */
-  const devServer = {
+  const devServer: Configuration = {
     allowedHosts: 'all',
     historyApiFallback: true,
     port: args.port,
@@ -56,19 +60,19 @@ export default function getWebpackDevServerConfig(args, override) {
 
   if (override.proxy) {
     if (Array.isArray(override.proxy)) {
-      devServer.proxy = [...override.proxy, ...devServer.proxy]
+      devServer.proxy = [...override.proxy, ...(devServer.proxy || [])]
     } else if (typeof override.proxy === 'object') {
       const proxies = Object.entries(override.proxy).map(([context, target]) => {
-        return createProxy(context, target)
+        return createProxy(context, target as string)
       })
-      devServer.proxy = [...proxies, ...devServer.proxy]
+      devServer.proxy = [...proxies, ...(devServer.proxy || [])]
     } else {
       throw new Error('proxy 必须是数组或对象')
     }
 
     // 清理重复的代理配置
-    const proxyMap = new Map()
-    devServer.proxy = devServer.proxy.filter((item) => {
+    const proxyMap = new Map<string, boolean>()
+    devServer.proxy = (devServer.proxy as ProxyConfig[]).filter((item) => {
       const key = JSON.stringify([...item.context].sort())
       if (!proxyMap.has(key)) {
         proxyMap.set(key, true)

package/src/utils/{FileSizeReporter.js → FileSizeReporter.ts}

@@ -9,11 +9,24 @@ import fs from 'fs-extra'
 import path from 'path'
 import chalk from 'chalk'
 import filesize from 'filesize'
+// @ts-ignore
 import recursive from 'recursive-readdir'
 import stripAnsi from 'strip-ansi'
 import { gzipSizeSync } from 'gzip-size'
 
-function canReadAsset(asset) {
+interface SizeMap {
+  root: string
+  sizes: Record<string, number>
+}
+
+interface WebpackStats {
+  stats?: WebpackStats[]
+  toJson: (options: { all: boolean; assets: boolean }) => {
+    assets: Array<{ name: string }>
+  }
+}
+
+function canReadAsset(asset: string): boolean {
   return (
     /\.(js|css)$/.test(asset) &&
     !/service-worker\.js/.test(asset) &&
@@ -23,24 +36,24 @@ function canReadAsset(asset) {
 
 // Prints a detailed summary of build files.
 function printFileSizesAfterBuild(
-  webpackStats,
-  previousSizeMap,
-  buildFolder,
-  maxBundleGzipSize,
-  maxChunkGzipSize
-) {
-  var root = previousSizeMap.root
-  var sizes = previousSizeMap.sizes
-  var assets = (webpackStats.stats || [webpackStats])
+  webpackStats: WebpackStats,
+  previousSizeMap: SizeMap,
+  buildFolder: string,
+  maxBundleGzipSize: number,
+  maxChunkGzipSize: number
+): void {
+  const root = previousSizeMap.root
+  const sizes = previousSizeMap.sizes
+  const assets = (webpackStats.stats || [webpackStats])
     .map((stats) =>
       stats
         .toJson({ all: false, assets: true })
         .assets.filter((asset) => canReadAsset(asset.name))
         .map((asset) => {
-          var fileContents = fs.readFileSync(path.join(root, asset.name))
-          var size = gzipSizeSync(fileContents)
-          var previousSize = sizes[removeFileNameHash(root, asset.name)]
-          var difference = getDifferenceLabel(size, previousSize)
+          const fileContents = fs.readFileSync(path.join(root, asset.name))
+          const size = gzipSizeSync(fileContents)
+          const previousSize = sizes[removeFileNameHash(root, asset.name)]
+          const difference = getDifferenceLabel(size, previousSize)
           return {
             folder: path.join(path.basename(buildFolder), path.dirname(asset.name)),
             name: path.basename(asset.name),
@@ -58,24 +71,24 @@ function printFileSizesAfterBuild(
   assets.sort((a, b) => b.size - a.size)
 
   // move main file to first
-  var mainAssetIdx = assets.findIndex((asset) => /_\d+\.\d+\.\d+/.test(asset.name))
+  const mainAssetIdx = assets.findIndex((asset) => /_\d+\.\d+\.\d+/.test(asset.name))
   assets.unshift(assets.splice(mainAssetIdx, 1)[0])
 
-  var longestSizeLabelLength = Math.max.apply(
+  const longestSizeLabelLength = Math.max.apply(
     null,
     assets.map((a) => stripAnsi(a.sizeLabel).length)
   )
-  var suggestBundleSplitting = false
+  let suggestBundleSplitting = false
   assets.forEach((asset) => {
-    var sizeLabel = asset.sizeLabel
-    var sizeLength = stripAnsi(sizeLabel).length
+    let sizeLabel = asset.sizeLabel
+    const sizeLength = stripAnsi(sizeLabel).length
     if (sizeLength < longestSizeLabelLength) {
-      var rightPadding = ' '.repeat(longestSizeLabelLength - sizeLength)
+      const rightPadding = ' '.repeat(longestSizeLabelLength - sizeLength)
       sizeLabel += rightPadding
     }
-    var isMainBundle = /_\d+\.\d+\.\d+\./.test(asset.name)
-    var maxRecommendedSize = isMainBundle ? maxBundleGzipSize : maxChunkGzipSize
-    var isLarge = maxRecommendedSize && asset.size > maxRecommendedSize
+    const isMainBundle = /_\d+\.\d+\.\d+\./.test(asset.name)
+    const maxRecommendedSize = isMainBundle ? maxBundleGzipSize : maxChunkGzipSize
+    const isLarge = maxRecommendedSize && asset.size > maxRecommendedSize
     if (isLarge && path.extname(asset.name) === '.js') {
       suggestBundleSplitting = true
     }
@@ -100,7 +113,7 @@ function printFileSizesAfterBuild(
   console.log()
 }
 
-function removeFileNameHash(buildFolder, fileName) {
+function removeFileNameHash(buildFolder: string, fileName: string): string {
   return fileName
     .replace(buildFolder, '')
     .replace(/\\/g, '/')
@@ -110,10 +123,10 @@ function removeFileNameHash(buildFolder, fileName) {
 
 // Input: 1024, 2048
 // Output: "(+1 KB)"
-function getDifferenceLabel(currentSize, previousSize) {
-  var FIFTY_KILOBYTES = 1024 * 50
-  var difference = currentSize - previousSize
-  var fileSize = !Number.isNaN(difference) ? filesize(difference) : 0
+function getDifferenceLabel(currentSize: number, previousSize: number): string {
+  const FIFTY_KILOBYTES = 1024 * 50
+  const difference = currentSize - previousSize
+  const fileSize = !Number.isNaN(difference) ? filesize(difference) : 0
   if (difference >= FIFTY_KILOBYTES) {
     return chalk.red('+' + fileSize)
   } else if (difference < FIFTY_KILOBYTES && difference > 0) {
@@ -125,17 +138,17 @@ function getDifferenceLabel(currentSize, previousSize) {
   }
 }
 
-function measureFileSizesBeforeBuild(buildFolder) {
+function measureFileSizesBeforeBuild(buildFolder: string): Promise<SizeMap> {
   return new Promise((resolve) => {
-    recursive(buildFolder, (err, fileNames) => {
-      var sizes
+    recursive(buildFolder, (err: any, fileNames: any) => {
+      let sizes: Record<string, number> | undefined
       if (!err && fileNames) {
-        sizes = fileNames.filter(canReadAsset).reduce((memo, fileName) => {
-          var contents = fs.readFileSync(fileName)
-          var key = removeFileNameHash(buildFolder, fileName)
+        sizes = fileNames.filter(canReadAsset).reduce((memo: any, fileName: any) => {
+          const contents = fs.readFileSync(fileName)
+          const key = removeFileNameHash(buildFolder, fileName)
           memo[key] = gzipSizeSync(contents)
           return memo
-        }, {})
+        }, {} as Record<string, number>)
       }
       resolve({
         root: buildFolder,

package/src/utils/{changeDeployVersion.js → changeDeployVersion.ts}

@@ -1,24 +1,28 @@
+// @ts-nocheck
 import { parse, traverse, types as t, transformFromAstSync } from '@babel/core'
 
 // ver.js 中定义模块的数组
 const TARGET_IDENTIFIER_NAME = 'project_apiArr'
 const MODULE_IDENTIFIER_NAME = 'module'
 
-function changeDeployVersion(code, pkg) {
+interface PackageInfo {
+  name: string
+  version: string
+  grayscale?: boolean
+}
+
+function changeDeployVersion(code: string, pkg: PackageInfo): string {
   const { name, version, grayscale } = pkg
   let ast
   try {
     ast = parse(code, { filename: 'ver.js' })
-  } catch (error) {
+  } catch (error: any) {
     throw new Error(`代码解析错误: ${error.message}`, { cause: error })
   }
   const keyName = grayscale ? 'grayscale' : 'main'
 
-  /**
-   * @return {babel.NodePath<t.VariableDeclarator> | undefined}
-   */
-  function findTargetDeclarator(ast) {
-    let res
+  function findTargetDeclarator(ast: any): any | undefined {
+    let res: any | undefined
 
     traverse(ast, {
       VariableDeclarator(path) {
@@ -34,18 +38,15 @@ function changeDeployVersion(code, pkg) {
     return res
   }
 
-  /**
-   * @param {babel.NodePath<t.VariableDeclarator>} path
-   * @return {babel.NodePath<t.ObjectExpression> | undefined}
-   */
-  function findModuleObject(path) {
-    let res
+  function findModuleObject(path: any): any | undefined {
+    let res: any | undefined
 
     path.traverse({
       ObjectExpression(path) {
         if (
           path.node.properties.some(
             (node) =>
+              t.isObjectProperty(node) &&
               t.isIdentifier(node.key, { name: MODULE_IDENTIFIER_NAME }) &&
               t.isLiteral(node.value, { value: name })
           )
@@ -58,15 +59,14 @@ function changeDeployVersion(code, pkg) {
     return res
   }
 
-  /**
-   * @param {babel.NodePath<t.ObjectExpression>} path
-   */
-  function modifyModuleVersion(path) {
+  function modifyModuleVersion(path: any): void {
     let hasModify = false
     path.traverse({
       Property(path) {
-        if (path.node.key.name === keyName) {
-          path.node.value.value = version
+        if (t.isObjectProperty(path.node) && t.isIdentifier(path.node.key, { name: keyName })) {
+          if (t.isStringLiteral(path.node.value)) {
+            path.node.value.value = version
+          }
           hasModify = true
         }
       },
@@ -76,10 +76,8 @@ function changeDeployVersion(code, pkg) {
       path.node.properties.push(t.objectProperty(t.identifier(keyName), t.stringLiteral(version)))
     }
   }
-  /**
-   * @param {babel.NodePath<t.ObjectExpression>} path
-   */
-  function deleteModuleComments(path) {
+
+  function deleteModuleComments(path: any): void {
     path.traverse({
       ObjectExpression(path) {
         delete path.node.leadingComments
@@ -87,19 +85,18 @@ function changeDeployVersion(code, pkg) {
     })
   }
 
-  /**
-   * @param {babel.NodePath<t.VariableDeclarator>} path
-   */
-  function addModuleToTarget(path) {
-    const elements = path.node.init.elements
-    elements.splice(
-      elements.length - 2,
-      0,
-      t.objectExpression([
-        t.objectProperty(t.identifier(MODULE_IDENTIFIER_NAME), t.stringLiteral(name)),
-        t.objectProperty(t.identifier(keyName), t.stringLiteral(version)),
-      ])
-    )
+  function addModuleToTarget(path: any): void {
+    if (t.isArrayExpression(path.node.init)) {
+      const elements = path.node.init.elements
+      elements.splice(
+        elements.length - 2,
+        0,
+        t.objectExpression([
+          t.objectProperty(t.identifier(MODULE_IDENTIFIER_NAME), t.stringLiteral(name)),
+          t.objectProperty(t.identifier(keyName), t.stringLiteral(version)),
+        ])
+      )
+    }
   }
 
   const targetPath = findTargetDeclarator(ast)
@@ -113,7 +110,12 @@ function changeDeployVersion(code, pkg) {
   }
   deleteModuleComments(targetPath)
 
-  return transformFromAstSync(ast, undefined, { filename: 'ver.js', minified: true }).code
+  const result = transformFromAstSync(ast, undefined, { filename: 'ver.js', minified: true })
+  if (!result || !result.code) {
+    throw new Error('代码转换失败')
+  }
+
+  return result.code
 }
 
 export default changeDeployVersion

package/src/utils/defineConfig.ts

@@ -1,22 +1,17 @@
 import type { Chalk } from 'chalk'
-import type { Compiler, Configuration as RspackConfiguration } from '@rspack/core'
+import type { Compiler, Configuration as RspackConfiguration, SwcLoaderOptions } from '@rspack/core'
 import type { Configuration as DevServerConfiguration } from '@rspack/dev-server'
 
 type ProxyConfigArray = NonNullable<DevServerConfiguration['proxy']>
 
-export type BabelImportPlugin = {
-  libraryName: string
-  libraryDirectory?: string
-  customName?: string
-  style?: boolean | 'css' | string
-}
-
 export type Configuration = {
   webpack?: (config: RspackConfiguration) => RspackConfiguration | undefined
   devServer?: (config: DevServerConfiguration) => DevServerConfiguration | undefined
   /**
    * webpack alias 配置，会与内置 alias 合并
    *
+   * 会自动读取 tsconfig 里 baseUrl + paths 的配置
+   *
    * @default
    * { '@': './src' }
    */
@@ -76,12 +71,10 @@ export type Configuration = {
   /**
    * 与 babel-plugin-import 类似，但是内部是 rspack 重构，libraryDirectory 默认值是 lib
    *
-   * 如果 libraryDirectory 传 ’‘ 则必须使用 customName 来写
-   *
    * @see https://rspack.rs/zh/guide/features/builtin-swc-loader#rspackexperimentsimport
-   * @default [{libraryName: 'lodash', customName: 'lodash/{{member}}'}]
+   * @default [{libraryName: 'lodash',libraryDirectory: '',camelToDashComponentName: false}]
    */
-  import?: BabelImportPlugin[]
+  import?: NonNullable<SwcLoaderOptions['rspackExperiments']>['import']
 }
 export function defineConfig(config: Configuration) {
   return config

package/src/utils/getOverride.ts

@@ -2,6 +2,7 @@ import fs from 'fs-extra'
 import paths from '../config/paths'
 import { createRequire } from 'node:module'
 import { type Configuration } from './defineConfig'
+import { resolveModule } from './resolveModule'
 
 const require = createRequire(import.meta.url)
 
@@ -21,7 +22,7 @@ export default function getOverride(): Configuration {
   override = Object.assign({}, defaultOverride)
 
   if (fs.existsSync(paths.override)) {
-    const userOverride = require(paths.override)
+    const userOverride = resolveModule(require(paths.override))
     if (typeof userOverride !== 'object')
       throw new Error('格式错误，请使用 npx edu g override 生成文件')
     Object.assign(override, userOverride)

package/src/utils/resolveModule.ts

@@ -0,0 +1,3 @@
+export function resolveModule(mod: any) {
+  return mod.default ? mod.default : mod
+}