folinhilo/defgov
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mm

Browse Source
This commit is contained in:
folinhilo
2026-05-06 02:59:19 +08:00
parent 015c4fb91e
commit da0a6d0f81
60 changed files with 2406 additions and 323 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
.npmrc
View File

@@ -1 +1,2 @@
registry = https://registry.npmmirror.com/
registry = https://registry.npmmirror.com/
hoist=false

0
templates/vite-react-template/.npmrc → apps/ui-site/.npmrc
View File

0
templates/vite-react-template/.vscode/settings.json → apps/ui-site/.vscode/settings.json vendored
View File

11
apps/ui-site/index.html Normal file
View File

@@ -0,0 +1,11 @@
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<title>DefGov UI Web</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

27
templates/vite-react-template/package.json → apps/ui-site/package.json
View File

@@ -1,34 +1,43 @@
{
"name": "vite-react-template",
"name": "ui-site",
"version": "0.0.0",
"private": true,
"type": "module",
"sideEffects": ["*.css"],
"sideEffects": [
"*.css"
],
"module": "./dist/index.es.js",
"main": "./dist/index.cjs.js",
"types": "./dist/index.d.ts",
"style": "./dist/index.css",
"exports": {
".": {
"types": "./dist/index.d.ts",
"import": "./dist/index.es.js",
"require": "./dist/index.cjs.js",
"types": "./dist/index.d.ts"
"require": "./dist/index.cjs.js"
},
"./index.css": "./dist/index.css"
},
"files": ["dist"],
"files": [
"dist"
],
"scripts": {
"dev": "vite",
"build": "vite build --tsconfig tsconfig.build.json"
"build": "tsc -p tsconfig.build.json && vite build"
},
"devDependencies": {
"@types/node": "^25.6.0",
"@types/react": "^19.2.14",
"@types/react-dom": "^19.2.3",
"@vitejs/plugin-react": "^6.0.1",
"@vitejs/plugin-react": "~5.2.0",
"glob": "^13.0.6",
"typescript": "^6.0.3",
"vite": "^8.0.9",
"typescript": "~6.0.3",
"vite": "~7.3.2",
"vite-plugin-dts": "^4.5.4"
},
"dependencies": {
"@defgov/ui-web": "workspace:*",
"react": "^19.2.5",
"react-dom": "^19.2.5"
}
}

0
packages/ui-web/scripts-plugin/vite-plugin-gen-index-css.ts → apps/ui-site/scripts-plugin/vite-plugin-gen-index-css.ts
View File

0
packages/ui-web/scripts-plugin/vite-plugin-gen-index-ts.ts → apps/ui-site/scripts-plugin/vite-plugin-gen-index-ts.ts
View File

9
apps/ui-site/src/App.tsx Normal file
View File

@@ -0,0 +1,9 @@
import { ButtonGallery } from "./gallery/ButtonGallery";
export default function App() {
return (
<>
<ButtonGallery />
</>
);
}

9
apps/ui-site/src/common/CommonProps.ts Normal file
View File

@@ -0,0 +1,9 @@
import { type CSSProperties, type ReactNode } from "react";
export type CommonProps = {
className?: string;
style?: CSSProperties;
children?: ReactNode;
disabled?: boolean;
key?: string;
};

17
apps/ui-site/src/common/InnerWrapper.tsx Normal file
View File

@@ -0,0 +1,17 @@
import { ReactNode } from "react";
export const InnerWrapper = ({ children }: { children: ReactNode }) => {
return (
<div
style={{
gap: "30px",
display: "flex",
flexWrap: "nowrap",
margin: "50px",
alignItems: "center",
}}
>
{children}
</div>
);
};

16
apps/ui-site/src/common/OuterWrapper.tsx Normal file
View File

@@ -0,0 +1,16 @@
import { ReactNode } from "react";
export const OuterWrapper = ({ children }: { children: ReactNode }) => {
return (
<div
style={{
gap: "30px",
display: "flex",
flexWrap: "nowrap",
flexDirection: "column",
}}
>
{children}
</div>
);
};

22
apps/ui-site/src/gallery/ButtonGallery.tsx Normal file
View File

@@ -0,0 +1,22 @@
import { Button, DownloadSvg } from "@defgov/ui-web";
import { InnerWrapper } from "../common/InnerWrapper";
import { OuterWrapper } from "../common/OuterWrapper";
export const ButtonGallery = () => {
return (
<OuterWrapper>
<InnerWrapper>
<Button size="xs">xsmall</Button>
<Button size="xs" iconSvg={<DownloadSvg />}>
xsmall
</Button>
<Button size="xs" iconSvg={<DownloadSvg />} iconOnly>
xsmall
</Button>
<Button size="sm">sm</Button>
<Button size="md">md</Button>
<Button size="lg">lg</Button>
</InnerWrapper>
</OuterWrapper>
);
};

8
apps/ui-site/src/main.tsx Normal file
View File

@@ -0,0 +1,8 @@
import { createRoot } from "react-dom/client";
import App from "./App";
import "@defgov/ui-web/index.css";
const container = document.getElementById("root")!;
const root = createRoot(container);
root.render(<App />);

0
templates/vite-react-template/src/types/css.d.ts → apps/ui-site/src/types/css.d.ts vendored
View File

0
templates/vite-react-template/src/types/env.d.ts → apps/ui-site/src/types/env.d.ts vendored
View File

26
apps/ui-site/tsconfig.base.json Normal file
View File

@@ -0,0 +1,26 @@
{
// tsconfig.base.json，用于被 tesconfig.json 和 tesconfig.build.json 继承
"compilerOptions": {
// 输出模块语法，使用版本号最新的那个，而不是实验性语法 ESNext
"module": "es2022",
// 模块解析策略，模拟 Vite / Rollup / webpack，支持 exports / imports，不强制 Node ESM 的严格规则
"moduleResolution": "bundler",
// 显式声明使用的类型包
"types": ["node", "react", "react-dom"],
// 允许 ESM 导入 CJS
"esModuleInterop": true,
// 跳过 node_modules 类型检查，加快构建，避免第三方类型污染
"skipLibCheck": true,
/**
* 只做类型检查，不生成 JS 输出
* - 适用于 Vite / Next / Nuxt 等 bundler 场景
* - 防止 tsc 与构建工具重复 emit
*/
"noEmit": true
}
}

108
apps/ui-site/tsconfig.build.json Normal file
View File

@@ -0,0 +1,108 @@
{
// 此文件仅用于类型检查，不用于类型检查，构建时会指定使用 tsconfig.build.json
"extends": "./tsconfig.base.json",
"compilerOptions": {
// Browser api，需要加 "DOM"，"DOM.Iterable"
// Node api，需要加 "ES2025"，始终使用带版本号的最新版本
// NextJs api，属于同构，server 端会预处理 DOM，计算url，三个都需要 "ES2025", "DOM", "DOM.Iterable"
"lib": ["ES2025", "DOM", "DOM.Iterable"],
/**
* 显式声明使用的类型包
* - node：Node.js API
* - react：JSX / React 类型
* - vite/client：import.meta / env
*/
"types": ["node", "react", "react-dom"],
/**
* React JSX 编译模式
* - 使用 React 17+ 新 JSX Transform
* - 不需要手动 import React
*/
"jsx": "react-jsx",
/**
* 编译输出目录
* - tsc / tsc -b 都会用到
*/
"outDir": "./dist",
/**
* 源码根目录
* - 确保 dist 结构与 src 一致
* - 对 declaration 路径至关重要
*/
"rootDir": "./src",
/**
* 生成 .d.ts 类型声明文件
* - 组件库 / npm 包发布必需
* - 对应用项目无害，仅影响类型输出
*/
"declaration": true,
/**
* 强制单文件可独立编译
* - 适配 esbuild / SWC / bundler 编译模型
* - 禁止依赖跨文件类型推断（enum / namespace 等）
*/
"isolatedModules": true
},
/**
* 参与类型检查和编译的文件
* - 只扫描 src
* - 其它目录通过 exclude 排除
*/
"include": ["src"],
/**
* 明确排除非源码内容
* - 避免污染类型系统
* - 防止误入 dist / test / config
* - 保证发布包干净
*/
"exclude": [
"node_modules",
"dist",
// ---------- build / cache ----------
".turbo/**/*",
".cache/**/*",
".vite/**/*",
// ---------- 配置文件 ----------
"vite.config.ts",
"*.config.ts",
"*.config.js",
"tsconfig.*.json",
// ---------- 测试相关 ----------
"__tests__/**/*",
"test/**/*",
"tests/**/*",
"**/*.test.ts",
"**/*.test.tsx",
"**/*.spec.ts",
"**/*.spec.tsx",
// ---------- Storybook ----------
".storybook/**/*",
"stories/**/*",
// ---------- 示例 / 脚本 ----------
"example/**/*",
"examples/**/*",
"scripts/**/*",
// ---------- 环境与静态资源 ----------
".env",
".env.*",
"public/**/*",
// ---------- 文档 ----------
"docs/**/*",
"README.md",
"LICENSE"
]
}

3
templates/vite-react-template/tsconfig.json → apps/ui-site/tsconfig.json
View File

@@ -6,11 +6,12 @@
"lib": ["ES2025", "DOM", "DOM.Iterable"],
//显式声明使用的类型包，避免找不到模块
"types": ["node", "react", "vite/client"],
"types": ["node", "react", "react-dom"],
// React JSX 编译模式
"jsx": "react-jsx"
},
// 将类型检查范围扩大至整个子项目，而不只是 src 文件夹,
"include": ["**/*"]
}

16
apps/ui-site/vite.config.ts Normal file
View File

@@ -0,0 +1,16 @@
import { defineConfig } from "vite"
import react from "@vitejs/plugin-react"
import dts from "vite-plugin-dts"
import { genIndexTsPlugin } from "./scripts-plugin/vite-plugin-gen-index-ts"
import { genIndexCssPlugin } from "./scripts-plugin/vite-plugin-gen-index-css"
export default defineConfig({
plugins: [
genIndexTsPlugin(),
genIndexCssPlugin(),
react(),
dts({
insertTypesEntry: true,
}),
],
})

4
package.json
View File

@@ -12,9 +12,5 @@
"engines": {
"node": ">=20"
},
"workspaces": [
"packages/*",
"app/*"
],
"packageManager": "pnpm@11.0.0-rc.5+sha512.c469fb6aa13a99e57aec935cd7b86ff422701f4602ecac2231d3dc20910586ebfb6b50a7b455d0778ec22ae56912d8d8e88e9f9e0a03c0875a6a41783a94a1bd"
}

17
packages/ui-web/package.json
View File

@@ -12,9 +12,9 @@
"style": "./dist/index.css",
"exports": {
".": {
"types": "./dist/index.d.ts",
"import": "./dist/index.es.js",
"require": "./dist/index.cjs.js",
"types": "./dist/index.d.ts"
"require": "./dist/index.cjs.js"
},
"./index.css": "./dist/index.css"
},
@@ -22,19 +22,22 @@
"dist"
],
"scripts": {
"dev": "vite",
"build": "vite build --tsconfig tsconfig.build.json"
"gen-css": "ts-node scripts/gen-index-css.ts",
"gen-ts": "ts-node scripts/gen-index-ts.ts",
"gen-index": "pnpm run gen-css && pnpm run gen-ts",
"dev": "pnpm run gen-index && vite build --watch",
"build": "pnpm run gen-index && tsc -p tsconfig.build.json && vite build"
},
"devDependencies": {
"@tailwindcss/vite": "^4.2.4",
"@types/node": "^25.6.0",
"@types/react": "^19.2.14",
"@types/react-dom": "^19.2.3",
"@vitejs/plugin-react": "^6.0.1",
"@vitejs/plugin-react": "~5.2.0",
"glob": "^13.0.6",
"ts-node": "^10.9.2",
"typescript": "^6.0.3",
"vite": "^8.0.9",
"typescript": "~6.0.3",
"vite": "~7.3.2",
"vite-plugin-dts": "^4.5.4"
},
"dependencies": {

60
templates/vite-react-template/scripts-plugin/vite-plugin-gen-index-ts.ts → packages/ui-web/scripts/gen-index-css.ts
View File

@@ -1,5 +1,3 @@
// plugins/vite-plugin-gen-index-ts.ts
import type { Plugin } from "vite";
import fs from "fs";
import path from "path";
import { globSync } from "glob";
@@ -68,7 +66,10 @@ function generateIndexFile(dirPath: string) {
});
const validFiles = allFiles.filter(isValidFile);
if (validFiles.length === 0) return;
if (validFiles.length === 0) {
console.log("⚠️ 未找到符合条件的文件，跳过生成 index.ts");
return;
}
validFiles.sort();
@@ -88,42 +89,33 @@ ${exportStatements.join("\n")}
const indexFilePath = path.resolve(dirPath, "index.ts");
// ✅ 内容比对，避免无限 rebuild
// ✅ 内容比对，避免重复写入
if (fs.existsSync(indexFilePath)) {
const old = fs.readFileSync(indexFilePath, "utf8");
if (old === indexContent) return;
if (old === indexContent) {
console.log("✅ index.ts 内容无变化，无需重新生成");
return;
}
}
fs.writeFileSync(indexFilePath, indexContent, "utf8");
console.log(`✅ 成功生成 index.ts: ${indexFilePath}`);
}
export function genIndexTsPlugin(): Plugin {
return {
name: "vite-plugin-gen-index-ts",
apply: "build",
buildStart() {
const [targetDir] = CONFIG.targetDirs;
if (!targetDir) {
this.error("CONFIG.targetDirs is empty");
return;
}
const absTargetDir = path.resolve(process.cwd(), targetDir);
try {
generateIndexFile(absTargetDir);
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
this.error(`[gen-index-ts] failed: ${msg}`);
throw err;
}
},
handleHotUpdate({ file }) {
if (file.replace(/\\/g, "/").endsWith("/src/index.ts")) {
return [];
}
},
};
// 脚本入口
const [targetDir] = CONFIG.targetDirs;
if (!targetDir) {
console.error("❌ CONFIG.targetDirs 不能为空");
process.exit(1);
}
const absTargetDir = path.resolve(process.cwd(), targetDir);
try {
console.log(`🚀 开始扫描目录: ${absTargetDir}`);
generateIndexFile(absTargetDir);
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
console.error(`❌ [gen-index-ts] 执行失败: ${msg}`);
process.exit(1);
}

121
packages/ui-web/scripts/gen-index-ts.ts Normal file
View File

@@ -0,0 +1,121 @@
import fs from "fs";
import path from "path";
import { globSync } from "glob";
interface Config {
targetDirs: string[];
includeExtensions: string[];
excludeKeywords: {
dirs: string[];
fileSuffixes: string[];
filePatterns: RegExp[];
};
}
const CONFIG: Config = {
targetDirs: ["src"],
includeExtensions: [".ts", ".tsx", ".vue"],
excludeKeywords: {
dirs: ["__tests__", "tests", "story", "stories", "types"],
fileSuffixes: [".d.ts"],
filePatterns: [
/^index\.(ts|tsx|js|jsx)$/,
/\.(test|spec)\./,
/\.(story|stories)\./,
],
},
};
const normalizePath = (p: string) => p.replace(/\\/g, "/");
const isInExcludeDir = (filePath: string) => {
const normalized = normalizePath(filePath);
return CONFIG.excludeKeywords.dirs.some((dir) =>
normalized.includes(`/${dir}/`),
);
};
const isExcludeSuffix = (filePath: string) =>
CONFIG.excludeKeywords.fileSuffixes.some((suffix) =>
filePath.endsWith(suffix),
);
const isMatchExcludePattern = (fileName: string) =>
CONFIG.excludeKeywords.filePatterns.some((pattern) => pattern.test(fileName));
function isValidFile(filePath: string): boolean {
const fileName = filePath.split(/[\\/]/).pop()!;
if (isInExcludeDir(filePath)) return false;
if (isExcludeSuffix(filePath)) return false;
if (isMatchExcludePattern(fileName)) return false;
const ext = path.extname(filePath);
return CONFIG.includeExtensions.includes(ext);
}
function generateIndexFile(dirPath: string) {
const searchPattern = path.resolve(dirPath, "**", "*.*");
const allFiles = globSync(searchPattern, {
nodir: true,
absolute: true,
windowsPathsNoEscape: true,
dot: false,
follow: true,
});
const validFiles = allFiles.filter(isValidFile);
if (validFiles.length === 0) {
console.log("⚠️ 未找到符合条件的文件，跳过生成 index.ts");
return;
}
validFiles.sort();
const exportStatements = validFiles.map((file) => {
const relPath = path.relative(dirPath, file);
const importPath = `./${relPath
.replace(/\.[^.]+$/, "")
.replace(/\\/g, "/")}`;
return `export * from '${importPath}';`;
});
const indexContent = `
import './index.css';
${exportStatements.join("\n")}
`.trim();
const indexFilePath = path.resolve(dirPath, "index.ts");
// ✅ 内容比对，避免重复写入
if (fs.existsSync(indexFilePath)) {
const old = fs.readFileSync(indexFilePath, "utf8");
if (old === indexContent) {
console.log("✅ index.ts 内容无变化，无需重新生成");
return;
}
}
fs.writeFileSync(indexFilePath, indexContent, "utf8");
console.log(`✅ 成功生成 index.ts: ${indexFilePath}`);
}
// 脚本入口
const [targetDir] = CONFIG.targetDirs;
if (!targetDir) {
console.error("❌ CONFIG.targetDirs 不能为空");
process.exit(1);
}
const absTargetDir = path.resolve(process.cwd(), targetDir);
try {
console.log(`🚀 开始扫描目录: ${absTargetDir}`);
generateIndexFile(absTargetDir);
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
console.error(`❌ [gen-index-ts] 执行失败: ${msg}`);
process.exit(1);
}

5
packages/ui-web/src/common/Box.tsx
View File

@@ -1,6 +1,6 @@
import React from "react";
import { cn } from "tailwind-variants";
import { CommonProps } from "./CommonProps";
import { type CommonProps } from "./CommonProps";
// 别名<约束>=值
// 千万不要 C = As extend React.ElementType，这样子连等号，会切断推导
@@ -22,8 +22,7 @@ const Box = <C extends React.ElementType = "div">(
) => {
const { as: Component = "div", children, className, ...rest } = props;
const boxRootClass = cn( className);
const boxRootClass = cn(className);
return (
<Component ref={ref} className={boxRootClass} {...(rest as any)}>

2
packages/ui-web/src/common/CommonProps.ts
View File

@@ -1,4 +1,4 @@
import { CSSProperties, ReactNode } from "react";
import { type CSSProperties, type ReactNode } from "react";
export type CommonProps = {
className?: string;

4
packages/ui-web/src/component/button/Button.tsx
View File

@@ -48,10 +48,10 @@ export const Button = (props: ButtonProps) => {
{iconSvg ? (
hideIcon ? (
iconOnly ? (
<Icon />
<Icon size={size} />
) : null
) : (
<Icon svg={iconSvg} />
<Icon size={size} svg={iconSvg} />
)
) : null}
{!iconOnly && children}

6
packages/ui-web/src/index.ts
View File

@@ -1,6 +1,4 @@
import './index.css';
import './index.css';
export * from './assets/svg/BoldSvg';
export * from './assets/svg/CheckIndicatorSvg';
@@ -42,4 +40,4 @@ export * from './component/username-field/UsernameField';
export * from './styles/recipe/IinlineSize.recipe';
export * from './styles/recipe/ItemSize.recipe';
export * from './styles/recipe/brand.recipe';
export * from './styles/recipe/variant.recipe';
export * from './styles/recipe/variant.recipe';

20
packages/ui-web/tsconfig.base.json
View File

@@ -17,24 +17,6 @@
"esModuleInterop": true,
// 跳过 node_modules 类型检查，加快构建，避免第三方类型污染
"skipLibCheck": true,
// 模块检测策略，不会影响 node_modules 中的第三方 CommonJS 依赖，Vite 会在预构建阶段自动将其转换为 ESM。
"moduleDetection": "force",
// 保留源码中的 import / export 语句原样输出，不进行自动转换（如 import → require），通常与 moduleDetection: "force" 搭配使用
"verbatimModuleSyntax": true,
// 是否检查“未使用的局部变量”
"noUnusedLocals": true,
// 是否检查“未使用的函数参数”
"noUnusedParameters": true,
// 是否只允许“可擦除的语法（Erasable Syntax），确保 TypeScript 语法在编译后可完全移除
"erasableSyntaxOnly": true,
// 是否禁止 switch 语句中的 case 贯穿（fallthrough），如果 case 没有 break / return，会报错
"noFallthroughCasesInSwitch": true
"skipLibCheck": true
}
}

18
packages/ui-web/tsconfig.build.json
View File

@@ -42,33 +42,19 @@
*/
"declaration": true,
/**
* 只做类型检查，不生成 JS 输出
* - 适用于 Vite / Next / Nuxt 等 bundler 场景
* - 防止 tsc 与构建工具重复 emit
*/
"noEmit": true,
/**
* 强制单文件可独立编译
* - 适配 esbuild / SWC / bundler 编译模型
* - 禁止依赖跨文件类型推断（enum / namespace 等）
*/
"isolatedModules": true,
/**
* 允许在 import 中显式使用 .ts / .tsx 后缀
* - 兼容 Node ESM / bundler 对文件扩展名的严格要求
* - 避免 `import './foo'` 在 TS + ESM 下歧义
*/
"allowImportingTsExtensions": true
"isolatedModules": true
},
/**
* 参与类型检查和编译的文件
* - 只扫描 src
* - 其它目录通过 exclude 排除
*/
"include": ["src", "scripts"],
"include": ["src"],
/**
* 明确排除非源码内容

9
packages/ui-web/tsconfig.json
View File

@@ -9,7 +9,14 @@
"types": ["node", "react", "vite/client"],
// React JSX 编译模式
"jsx": "react-jsx"
"jsx": "react-jsx",
/**
* 只做类型检查，不生成 JS 输出
* - 适用于 Vite / Next / Nuxt 等 bundler 场景
* - 防止 tsc 与构建工具重复 emit
*/
"noEmit": true
},
// 将类型检查范围扩大至整个子项目，而不只是 src 文件夹,
"include": ["**/*"]

4
packages/ui-web/vite.config.ts
View File

@@ -3,13 +3,9 @@ import react from "@vitejs/plugin-react";
import dts from "vite-plugin-dts";
import path from "path";
import tailwindcss from "@tailwindcss/vite";
import { genIndexTsPlugin } from "./scripts-plugin/vite-plugin-gen-index-ts";
import { genIndexCssPlugin } from "./scripts-plugin/vite-plugin-gen-index-css";
export default defineConfig({
plugins: [
genIndexTsPlugin(),
genIndexCssPlugin(),
react(),
tailwindcss(),
dts({

1057
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

1
pnpm-workspace.yaml
View File

@@ -3,4 +3,5 @@ packages:
- "apps/*"
- "templates/*"
allowBuilds:
esbuild: false
sharp: false

1
templates/vite-react-app/.npmrc Normal file
View File

@@ -0,0 +1 @@
registry = https://registry.npmmirror.com/

8
templates/vite-react-app/.vscode/settings.json vendored Normal file
View File

@@ -0,0 +1,8 @@
{
"json.schemas": [
{
"fileMatch": ["/tsconfig.build.json", "/tsconfig.base.json"],
"schema": {}
}
]
}

11
templates/vite-react-app/index.html Normal file
View File

@@ -0,0 +1,11 @@
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<title>DefGov UI Web</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

46
templates/vite-react-app/package.json Normal file
View File

@@ -0,0 +1,46 @@
{
"name": "vite-react-app",
"version": "0.0.0",
"private": true,
"type": "module",
"sideEffects": [
"*.css"
],
"module": "./dist/index.es.js",
"main": "./dist/index.cjs.js",
"types": "./dist/index.d.ts",
"style": "./dist/index.css",
"exports": {
".": {
"import": "./dist/index.es.js",
"require": "./dist/index.cjs.js",
"types": "./dist/index.d.ts"
},
"./index.css": "./dist/index.css"
},
"files": [
"dist"
],
"scripts": {
"gen-css": "ts-node scripts/gen-index-css.ts",
"gen-ts": "ts-node scripts/gen-index-ts.ts",
"gen-index": "pnpm run gen-css && pnpm run gen-ts",
"dev": "pnpm run gen-index && vite build --watch",
"build": "pnpm run gen-index && tsc -p tsconfig.build.json && vite build"
},
"devDependencies": {
"@types/node": "^25.6.0",
"@types/react": "^19.2.14",
"@types/react-dom": "^19.2.3",
"@vitejs/plugin-react": "~5.2.0",
"glob": "^13.0.6",
"typescript": "~6.0.3",
"vite": "~7.3.2",
"vite-plugin-dts": "^4.5.4",
"ts-node": "^10.9.2"
},
"dependencies": {
"react": "^19.2.5",
"react-dom": "^19.2.5"
}
}

121
templates/vite-react-app/scripts/gen-index-css.ts Normal file
View File

@@ -0,0 +1,121 @@
import fs from "fs";
import path from "path";
import { globSync } from "glob";
interface Config {
targetDirs: string[];
includeExtensions: string[];
excludeKeywords: {
dirs: string[];
fileSuffixes: string[];
filePatterns: RegExp[];
};
}
const CONFIG: Config = {
targetDirs: ["src"],
includeExtensions: [".ts", ".tsx", ".vue"],
excludeKeywords: {
dirs: ["__tests__", "tests", "story", "stories", "types"],
fileSuffixes: [".d.ts"],
filePatterns: [
/^index\.(ts|tsx|js|jsx)$/,
/\.(test|spec)\./,
/\.(story|stories)\./,
],
},
};
const normalizePath = (p: string) => p.replace(/\\/g, "/");
const isInExcludeDir = (filePath: string) => {
const normalized = normalizePath(filePath);
return CONFIG.excludeKeywords.dirs.some((dir) =>
normalized.includes(`/${dir}/`),
);
};
const isExcludeSuffix = (filePath: string) =>
CONFIG.excludeKeywords.fileSuffixes.some((suffix) =>
filePath.endsWith(suffix),
);
const isMatchExcludePattern = (fileName: string) =>
CONFIG.excludeKeywords.filePatterns.some((pattern) => pattern.test(fileName));
function isValidFile(filePath: string): boolean {
const fileName = filePath.split(/[\\/]/).pop()!;
if (isInExcludeDir(filePath)) return false;
if (isExcludeSuffix(filePath)) return false;
if (isMatchExcludePattern(fileName)) return false;
const ext = path.extname(filePath);
return CONFIG.includeExtensions.includes(ext);
}
function generateIndexFile(dirPath: string) {
const searchPattern = path.resolve(dirPath, "**", "*.*");
const allFiles = globSync(searchPattern, {
nodir: true,
absolute: true,
windowsPathsNoEscape: true,
dot: false,
follow: true,
});
const validFiles = allFiles.filter(isValidFile);
if (validFiles.length === 0) {
console.log("⚠️ 未找到符合条件的文件，跳过生成 index.ts");
return;
}
validFiles.sort();
const exportStatements = validFiles.map((file) => {
const relPath = path.relative(dirPath, file);
const importPath = `./${relPath
.replace(/\.[^.]+$/, "")
.replace(/\\/g, "/")}`;
return `export * from '${importPath}';`;
});
const indexContent = `
import './index.css';
${exportStatements.join("\n")}
`.trim();
const indexFilePath = path.resolve(dirPath, "index.ts");
// ✅ 内容比对，避免重复写入
if (fs.existsSync(indexFilePath)) {
const old = fs.readFileSync(indexFilePath, "utf8");
if (old === indexContent) {
console.log("✅ index.ts 内容无变化，无需重新生成");
return;
}
}
fs.writeFileSync(indexFilePath, indexContent, "utf8");
console.log(`✅ 成功生成 index.ts: ${indexFilePath}`);
}
// 脚本入口
const [targetDir] = CONFIG.targetDirs;
if (!targetDir) {
console.error("❌ CONFIG.targetDirs 不能为空");
process.exit(1);
}
const absTargetDir = path.resolve(process.cwd(), targetDir);
try {
console.log(`🚀 开始扫描目录: ${absTargetDir}`);
generateIndexFile(absTargetDir);
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
console.error(`❌ [gen-index-ts] 执行失败: ${msg}`);
process.exit(1);
}

121
templates/vite-react-app/scripts/gen-index-ts.ts Normal file
View File

@@ -0,0 +1,121 @@
import fs from "fs";
import path from "path";
import { globSync } from "glob";
interface Config {
targetDirs: string[];
includeExtensions: string[];
excludeKeywords: {
dirs: string[];
fileSuffixes: string[];
filePatterns: RegExp[];
};
}
const CONFIG: Config = {
targetDirs: ["src"],
includeExtensions: [".ts", ".tsx", ".vue"],
excludeKeywords: {
dirs: ["__tests__", "tests", "story", "stories", "types"],
fileSuffixes: [".d.ts"],
filePatterns: [
/^index\.(ts|tsx|js|jsx)$/,
/\.(test|spec)\./,
/\.(story|stories)\./,
],
},
};
const normalizePath = (p: string) => p.replace(/\\/g, "/");
const isInExcludeDir = (filePath: string) => {
const normalized = normalizePath(filePath);
return CONFIG.excludeKeywords.dirs.some((dir) =>
normalized.includes(`/${dir}/`),
);
};
const isExcludeSuffix = (filePath: string) =>
CONFIG.excludeKeywords.fileSuffixes.some((suffix) =>
filePath.endsWith(suffix),
);
const isMatchExcludePattern = (fileName: string) =>
CONFIG.excludeKeywords.filePatterns.some((pattern) => pattern.test(fileName));
function isValidFile(filePath: string): boolean {
const fileName = filePath.split(/[\\/]/).pop()!;
if (isInExcludeDir(filePath)) return false;
if (isExcludeSuffix(filePath)) return false;
if (isMatchExcludePattern(fileName)) return false;
const ext = path.extname(filePath);
return CONFIG.includeExtensions.includes(ext);
}
function generateIndexFile(dirPath: string) {
const searchPattern = path.resolve(dirPath, "**", "*.*");
const allFiles = globSync(searchPattern, {
nodir: true,
absolute: true,
windowsPathsNoEscape: true,
dot: false,
follow: true,
});
const validFiles = allFiles.filter(isValidFile);
if (validFiles.length === 0) {
console.log("⚠️ 未找到符合条件的文件，跳过生成 index.ts");
return;
}
validFiles.sort();
const exportStatements = validFiles.map((file) => {
const relPath = path.relative(dirPath, file);
const importPath = `./${relPath
.replace(/\.[^.]+$/, "")
.replace(/\\/g, "/")}`;
return `export * from '${importPath}';`;
});
const indexContent = `
import './index.css';
${exportStatements.join("\n")}
`.trim();
const indexFilePath = path.resolve(dirPath, "index.ts");
// ✅ 内容比对，避免重复写入
if (fs.existsSync(indexFilePath)) {
const old = fs.readFileSync(indexFilePath, "utf8");
if (old === indexContent) {
console.log("✅ index.ts 内容无变化，无需重新生成");
return;
}
}
fs.writeFileSync(indexFilePath, indexContent, "utf8");
console.log(`✅ 成功生成 index.ts: ${indexFilePath}`);
}
// 脚本入口
const [targetDir] = CONFIG.targetDirs;
if (!targetDir) {
console.error("❌ CONFIG.targetDirs 不能为空");
process.exit(1);
}
const absTargetDir = path.resolve(process.cwd(), targetDir);
try {
console.log(`🚀 开始扫描目录: ${absTargetDir}`);
generateIndexFile(absTargetDir);
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
console.error(`❌ [gen-index-ts] 执行失败: ${msg}`);
process.exit(1);
}

3
templates/vite-react-app/src/App.tsx Normal file
View File

@@ -0,0 +1,3 @@
export default function App() {
return <></>;
}

7
templates/vite-react-app/src/main.tsx Normal file
View File

@@ -0,0 +1,7 @@
import { createRoot } from "react-dom/client";
import App from "./App";
const container = document.getElementById("root")!;
const root = createRoot(container);
root.render(<App />);

4
templates/vite-react-app/src/types/css.d.ts vendored Normal file
View File

@@ -0,0 +1,4 @@
declare module '*.css' {
const content: { [className: string]: string };
export default content;
}

51
templates/vite-react-app/src/types/env.d.ts vendored Normal file
View File

@@ -0,0 +1,51 @@
/// <reference types="vite/client" />
declare module "*.svg" {
import * as React from "react";
export const ReactComponent: React.FC<React.SVGProps<SVGSVGElement>>;
const src: string;
export default src;
}
declare module "*.png" {
const src: string;
export default src;
}
declare module "*.jpg" {
const src: string;
export default src;
}
declare module "*.jpeg" {
const src: string;
export default src;
}
declare module "*.gif" {
const src: string;
export default src;
}
declare module "*.webp" {
const src: string;
export default src;
}
interface ImportMetaEnv {
readonly MODE: "development" | "production" | "test";
readonly BASE_URL: string;
readonly PROD: boolean;
readonly DEV: boolean;
readonly SSR: boolean;
// ===== 业务环境变量 =====
readonly VITE_API_BASE: string;
readonly VITE_UPLOAD_URL?: string;
readonly VITE_ENABLE_MOCK?: "true" | "false";
readonly VITE_SENTRY_DSN?: string;
}
interface ImportMeta {
readonly env: ImportMetaEnv;
}

26
templates/vite-react-app/tsconfig.base.json Normal file
View File

@@ -0,0 +1,26 @@
{
// tsconfig.base.json，用于被 tesconfig.json 和 tesconfig.build.json 继承
"compilerOptions": {
// 输出模块语法，使用版本号最新的那个，而不是实验性语法 ESNext
"module": "es2022",
// 模块解析策略，模拟 Vite / Rollup / webpack，支持 exports / imports，不强制 Node ESM 的严格规则
"moduleResolution": "bundler",
// 显式声明使用的类型包
"types": ["node", "react"],
// 允许 ESM 导入 CJS
"esModuleInterop": true,
// 跳过 node_modules 类型检查，加快构建，避免第三方类型污染
"skipLibCheck": true,
/**
* 只做类型检查，不生成 JS 输出
* - 适用于 Vite / Next / Nuxt 等 bundler 场景
* - 防止 tsc 与构建工具重复 emit
*/
"noEmit": true
}
}

13
templates/vite-react-template/tsconfig.build.json → templates/vite-react-app/tsconfig.build.json
View File

@@ -13,7 +13,7 @@
* - react：JSX / React 类型
* - vite/client：import.meta / env
*/
"types": ["node", "react", "vite/client"],
"types": ["node", "react"],
/**
* React JSX 编译模式
@@ -54,21 +54,14 @@
* - 适配 esbuild / SWC / bundler 编译模型
* - 禁止依赖跨文件类型推断（enum / namespace 等）
*/
"isolatedModules": true,
/**
* 允许在 import 中显式使用 .ts / .tsx 后缀
* - 兼容 Node ESM / bundler 对文件扩展名的严格要求
* - 避免 `import './foo'` 在 TS + ESM 下歧义
*/
"allowImportingTsExtensions": true
"isolatedModules": true
},
/**
* 参与类型检查和编译的文件
* - 只扫描 src
* - 其它目录通过 exclude 排除
*/
"include": ["src", "scripts"],
"include": ["src"],
/**
* 明确排除非源码内容

16
templates/vite-react-app/tsconfig.json Normal file
View File

@@ -0,0 +1,16 @@
{
// 此文件仅用于类型检查，不用于构建，构建时会指定使用 tsconfig.build.json
"extends": "./tsconfig.base.json",
"compilerOptions": {
// node api 使用最新版本号的 "ESxxxx"，browser api 使用 "DOM" 和 "DOM.Iterable"
"lib": ["ES2025", "DOM", "DOM.Iterable"],
//显式声明使用的类型包，避免找不到模块
"types": ["node", "react"],
// React JSX 编译模式
"jsx": "react-jsx"
},
// 将类型检查范围扩大至整个子项目，而不只是 src 文件夹,
"include": ["**/*"]
}

12
templates/vite-react-app/vite.config.ts Normal file
View File

@@ -0,0 +1,12 @@
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import dts from "vite-plugin-dts";
export default defineConfig({
plugins: [
react(),
dts({
insertTypesEntry: true,
}),
],
});

1
templates/vite-react-lib/.npmrc Normal file
View File

@@ -0,0 +1 @@
registry = https://registry.npmmirror.com/

8
templates/vite-react-lib/.vscode/settings.json vendored Normal file
View File

@@ -0,0 +1,8 @@
{
"json.schemas": [
{
"fileMatch": ["/tsconfig.build.json", "/tsconfig.base.json"],
"schema": {}
}
]
}

46
templates/vite-react-lib/package.json Normal file
View File

@@ -0,0 +1,46 @@
{
"name": "vite-react-lib",
"version": "0.0.0",
"private": true,
"type": "module",
"sideEffects": [
"*.css"
],
"module": "./dist/index.es.js",
"main": "./dist/index.cjs.js",
"types": "./dist/index.d.ts",
"style": "./dist/index.css",
"exports": {
".": {
"import": "./dist/index.es.js",
"require": "./dist/index.cjs.js",
"types": "./dist/index.d.ts"
},
"./index.css": "./dist/index.css"
},
"files": [
"dist"
],
"scripts": {
"gen-css": "ts-node scripts/gen-index-css.ts",
"gen-ts": "ts-node scripts/gen-index-ts.ts",
"gen-index": "pnpm run gen-css && pnpm run gen-ts",
"dev": "pnpm run gen-index && vite build --watch",
"build": "pnpm run gen-index && tsc -p tsconfig.build.json && vite build"
},
"devDependencies": {
"@types/node": "^25.6.0",
"@types/react": "^19.2.14",
"@types/react-dom": "^19.2.3",
"@vitejs/plugin-react": "~5.2.0",
"glob": "^13.0.6",
"typescript": "~6.0.3",
"vite": "~7.3.2",
"vite-plugin-dts": "^4.5.4",
"ts-node": "^10.9.2"
},
"peerDependencies": {
"react": "^19",
"react-dom": "^19"
}
}

121
templates/vite-react-lib/scripts/gen-index-css.ts Normal file
View File

@@ -0,0 +1,121 @@
import fs from "fs";
import path from "path";
import { globSync } from "glob";
interface Config {
targetDirs: string[];
includeExtensions: string[];
excludeKeywords: {
dirs: string[];
fileSuffixes: string[];
filePatterns: RegExp[];
};
}
const CONFIG: Config = {
targetDirs: ["src"],
includeExtensions: [".ts", ".tsx", ".vue"],
excludeKeywords: {
dirs: ["__tests__", "tests", "story", "stories", "types"],
fileSuffixes: [".d.ts"],
filePatterns: [
/^index\.(ts|tsx|js|jsx)$/,
/\.(test|spec)\./,
/\.(story|stories)\./,
],
},
};
const normalizePath = (p: string) => p.replace(/\\/g, "/");
const isInExcludeDir = (filePath: string) => {
const normalized = normalizePath(filePath);
return CONFIG.excludeKeywords.dirs.some((dir) =>
normalized.includes(`/${dir}/`),
);
};
const isExcludeSuffix = (filePath: string) =>
CONFIG.excludeKeywords.fileSuffixes.some((suffix) =>
filePath.endsWith(suffix),
);
const isMatchExcludePattern = (fileName: string) =>
CONFIG.excludeKeywords.filePatterns.some((pattern) => pattern.test(fileName));
function isValidFile(filePath: string): boolean {
const fileName = filePath.split(/[\\/]/).pop()!;
if (isInExcludeDir(filePath)) return false;
if (isExcludeSuffix(filePath)) return false;
if (isMatchExcludePattern(fileName)) return false;
const ext = path.extname(filePath);
return CONFIG.includeExtensions.includes(ext);
}
function generateIndexFile(dirPath: string) {
const searchPattern = path.resolve(dirPath, "**", "*.*");
const allFiles = globSync(searchPattern, {
nodir: true,
absolute: true,
windowsPathsNoEscape: true,
dot: false,
follow: true,
});
const validFiles = allFiles.filter(isValidFile);
if (validFiles.length === 0) {
console.log("⚠️ 未找到符合条件的文件，跳过生成 index.ts");
return;
}
validFiles.sort();
const exportStatements = validFiles.map((file) => {
const relPath = path.relative(dirPath, file);
const importPath = `./${relPath
.replace(/\.[^.]+$/, "")
.replace(/\\/g, "/")}`;
return `export * from '${importPath}';`;
});
const indexContent = `
import './index.css';
${exportStatements.join("\n")}
`.trim();
const indexFilePath = path.resolve(dirPath, "index.ts");
// ✅ 内容比对，避免重复写入
if (fs.existsSync(indexFilePath)) {
const old = fs.readFileSync(indexFilePath, "utf8");
if (old === indexContent) {
console.log("✅ index.ts 内容无变化，无需重新生成");
return;
}
}
fs.writeFileSync(indexFilePath, indexContent, "utf8");
console.log(`✅ 成功生成 index.ts: ${indexFilePath}`);
}
// 脚本入口
const [targetDir] = CONFIG.targetDirs;
if (!targetDir) {
console.error("❌ CONFIG.targetDirs 不能为空");
process.exit(1);
}
const absTargetDir = path.resolve(process.cwd(), targetDir);
try {
console.log(`🚀 开始扫描目录: ${absTargetDir}`);
generateIndexFile(absTargetDir);
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
console.error(`❌ [gen-index-ts] 执行失败: ${msg}`);
process.exit(1);
}

121
templates/vite-react-lib/scripts/gen-index-ts.ts Normal file
View File

@@ -0,0 +1,121 @@
import fs from "fs";
import path from "path";
import { globSync } from "glob";
interface Config {
targetDirs: string[];
includeExtensions: string[];
excludeKeywords: {
dirs: string[];
fileSuffixes: string[];
filePatterns: RegExp[];
};
}
const CONFIG: Config = {
targetDirs: ["src"],
includeExtensions: [".ts", ".tsx", ".vue"],
excludeKeywords: {
dirs: ["__tests__", "tests", "story", "stories", "types"],
fileSuffixes: [".d.ts"],
filePatterns: [
/^index\.(ts|tsx|js|jsx)$/,
/\.(test|spec)\./,
/\.(story|stories)\./,
],
},
};
const normalizePath = (p: string) => p.replace(/\\/g, "/");
const isInExcludeDir = (filePath: string) => {
const normalized = normalizePath(filePath);
return CONFIG.excludeKeywords.dirs.some((dir) =>
normalized.includes(`/${dir}/`),
);
};
const isExcludeSuffix = (filePath: string) =>
CONFIG.excludeKeywords.fileSuffixes.some((suffix) =>
filePath.endsWith(suffix),
);
const isMatchExcludePattern = (fileName: string) =>
CONFIG.excludeKeywords.filePatterns.some((pattern) => pattern.test(fileName));
function isValidFile(filePath: string): boolean {
const fileName = filePath.split(/[\\/]/).pop()!;
if (isInExcludeDir(filePath)) return false;
if (isExcludeSuffix(filePath)) return false;
if (isMatchExcludePattern(fileName)) return false;
const ext = path.extname(filePath);
return CONFIG.includeExtensions.includes(ext);
}
function generateIndexFile(dirPath: string) {
const searchPattern = path.resolve(dirPath, "**", "*.*");
const allFiles = globSync(searchPattern, {
nodir: true,
absolute: true,
windowsPathsNoEscape: true,
dot: false,
follow: true,
});
const validFiles = allFiles.filter(isValidFile);
if (validFiles.length === 0) {
console.log("⚠️ 未找到符合条件的文件，跳过生成 index.ts");
return;
}
validFiles.sort();
const exportStatements = validFiles.map((file) => {
const relPath = path.relative(dirPath, file);
const importPath = `./${relPath
.replace(/\.[^.]+$/, "")
.replace(/\\/g, "/")}`;
return `export * from '${importPath}';`;
});
const indexContent = `
import './index.css';
${exportStatements.join("\n")}
`.trim();
const indexFilePath = path.resolve(dirPath, "index.ts");
// ✅ 内容比对，避免重复写入
if (fs.existsSync(indexFilePath)) {
const old = fs.readFileSync(indexFilePath, "utf8");
if (old === indexContent) {
console.log("✅ index.ts 内容无变化，无需重新生成");
return;
}
}
fs.writeFileSync(indexFilePath, indexContent, "utf8");
console.log(`✅ 成功生成 index.ts: ${indexFilePath}`);
}
// 脚本入口
const [targetDir] = CONFIG.targetDirs;
if (!targetDir) {
console.error("❌ CONFIG.targetDirs 不能为空");
process.exit(1);
}
const absTargetDir = path.resolve(process.cwd(), targetDir);
try {
console.log(`🚀 开始扫描目录: ${absTargetDir}`);
generateIndexFile(absTargetDir);
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
console.error(`❌ [gen-index-ts] 执行失败: ${msg}`);
process.exit(1);
}

4
templates/vite-react-lib/src/types/css.d.ts vendored Normal file
View File

@@ -0,0 +1,4 @@
declare module '*.css' {
const content: { [className: string]: string };
export default content;
}

51
templates/vite-react-lib/src/types/env.d.ts vendored Normal file
View File

@@ -0,0 +1,51 @@
/// <reference types="vite/client" />
declare module "*.svg" {
import * as React from "react";
export const ReactComponent: React.FC<React.SVGProps<SVGSVGElement>>;
const src: string;
export default src;
}
declare module "*.png" {
const src: string;
export default src;
}
declare module "*.jpg" {
const src: string;
export default src;
}
declare module "*.jpeg" {
const src: string;
export default src;
}
declare module "*.gif" {
const src: string;
export default src;
}
declare module "*.webp" {
const src: string;
export default src;
}
interface ImportMetaEnv {
readonly MODE: "development" | "production" | "test";
readonly BASE_URL: string;
readonly PROD: boolean;
readonly DEV: boolean;
readonly SSR: boolean;
// ===== 业务环境变量 =====
readonly VITE_API_BASE: string;
readonly VITE_UPLOAD_URL?: string;
readonly VITE_ENABLE_MOCK?: "true" | "false";
readonly VITE_SENTRY_DSN?: string;
}
interface ImportMeta {
readonly env: ImportMetaEnv;
}

22
templates/vite-react-lib/tsconfig.base.json Normal file
View File

@@ -0,0 +1,22 @@
{
// tsconfig.base.json，用于被 tesconfig.json 和 tesconfig.build.json 继承
"compilerOptions": {
// 输出模块语法，使用版本号最新的那个，而不是实验性语法 ESNext
"module": "es2022",
// 模块解析策略，模拟 Vite / Rollup / webpack，支持 exports / imports，不强制 Node ESM 的严格规则
"moduleResolution": "bundler",
// 显式声明使用的类型包
"types": ["node", "react"],
// 开启所有严格类型检查，防止 any / 隐式 any 扩散
"strict": true,
// 允许 ESM 导入 CJS
"esModuleInterop": true,
// 跳过 node_modules 类型检查，加快构建，避免第三方类型污染
"skipLibCheck": true
}
}

115
templates/vite-react-lib/tsconfig.build.json Normal file
View File

@@ -0,0 +1,115 @@
{
// 此文件仅用于类型检查，不用于类型检查，构建时会指定使用 tsconfig.build.json
"extends": "./tsconfig.base.json",
"compilerOptions": {
// Browser api，需要加 "DOM"，"DOM.Iterable"
// Node api，需要加 "ES2025"，始终使用带版本号的最新版本
// NextJs api，属于同构，server 端会预处理 DOM，计算url，三个都需要 "ES2025", "DOM", "DOM.Iterable"
"lib": ["ES2025", "DOM", "DOM.Iterable"],
/**
* 显式声明使用的类型包
* - node：Node.js API
* - react：JSX / React 类型
* - vite/client：import.meta / env
*/
"types": ["node", "react"],
/**
* React JSX 编译模式
* - 使用 React 17+ 新 JSX Transform
* - 不需要手动 import React
*/
"jsx": "react-jsx",
/**
* 编译输出目录
* - tsc / tsc -b 都会用到
*/
"outDir": "./dist",
/**
* 源码根目录
* - 确保 dist 结构与 src 一致
* - 对 declaration 路径至关重要
*/
"rootDir": "./src",
/**
* 生成 .d.ts 类型声明文件
* - 组件库 / npm 包发布必需
* - 对应用项目无害，仅影响类型输出
*/
"declaration": true,
/**
* 只做类型检查，不生成 JS 输出
* - 适用于 Vite / Next / Nuxt 等 bundler 场景
* - 防止 tsc 与构建工具重复 emit
*/
"noEmit": true,
/**
* 强制单文件可独立编译
* - 适配 esbuild / SWC / bundler 编译模型
* - 禁止依赖跨文件类型推断（enum / namespace 等）
*/
"isolatedModules": true
},
/**
* 参与类型检查和编译的文件
* - 只扫描 src
* - 其它目录通过 exclude 排除
*/
"include": ["src"],
/**
* 明确排除非源码内容
* - 避免污染类型系统
* - 防止误入 dist / test / config
* - 保证发布包干净
*/
"exclude": [
"node_modules",
"dist",
// ---------- build / cache ----------
".turbo/**/*",
".cache/**/*",
".vite/**/*",
// ---------- 配置文件 ----------
"vite.config.ts",
"*.config.ts",
"*.config.js",
"tsconfig.*.json",
// ---------- 测试相关 ----------
"__tests__/**/*",
"test/**/*",
"tests/**/*",
"**/*.test.ts",
"**/*.test.tsx",
"**/*.spec.ts",
"**/*.spec.tsx",
// ---------- Storybook ----------
".storybook/**/*",
"stories/**/*",
// ---------- 示例 / 脚本 ----------
"example/**/*",
"examples/**/*",
"scripts/**/*",
// ---------- 环境与静态资源 ----------
".env",
".env.*",
"public/**/*",
// ---------- 文档 ----------
"docs/**/*",
"README.md",
"LICENSE"
]
}

16
templates/vite-react-lib/tsconfig.json Normal file
View File

@@ -0,0 +1,16 @@
{
// 此文件仅用于类型检查，不用于构建，构建时会指定使用 tsconfig.build.json
"extends": "./tsconfig.base.json",
"compilerOptions": {
// node api 使用最新版本号的 "ESxxxx"，browser api 使用 "DOM" 和 "DOM.Iterable"
"lib": ["ES2025", "DOM", "DOM.Iterable"],
//显式声明使用的类型包，避免找不到模块
"types": ["node", "react"],
// React JSX 编译模式
"jsx": "react-jsx"
},
// 将类型检查范围扩大至整个子项目，而不只是 src 文件夹,
"include": ["**/*"]
}

4
templates/vite-react-template/vite.config.ts → templates/vite-react-lib/vite.config.ts
View File

@@ -2,13 +2,9 @@ import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import dts from "vite-plugin-dts";
import path from "path";
import { genIndexTsPlugin } from "./scripts-plugin/vite-plugin-gen-index-ts";
import { genIndexCssPlugin } from "./scripts-plugin/vite-plugin-gen-index-css";
export default defineConfig({
plugins: [
genIndexTsPlugin(),
genIndexCssPlugin(),
react(),
dts({
insertTypesEntry: true,

137
templates/vite-react-template/scripts-plugin/vite-plugin-gen-index-css.ts
View File

@@ -1,137 +0,0 @@
// plugins/vite-plugin-gen-index-css.ts
import type { Plugin } from "vite";
import fs from "fs";
import path from "path";
import { globSync } from "glob";
interface Config {
targetDirs: string[];
includeExtensions: string[];
importSyntax: "@import";
importSyntaxTail?: string;
excludeFilePattern: RegExp[];
excludeDirs: string[];
warnDuplicateTailwindImport: boolean;
indexFileName: string;
}
const CONFIG: Config = {
targetDirs: ["src"],
includeExtensions: [".css"],
importSyntax: "@import",
excludeFilePattern: [/index\.css/, /index\.scss/, /\.(test|spec)\./],
excludeDirs: [
"__tests__",
"tests",
"story",
"stories",
"types",
"node_modules",
"dist",
"build",
],
warnDuplicateTailwindImport: true,
indexFileName: "index.css",
};
const normalizePath = (p: string) => p.replace(/\\/g, "/");
function isValidFile(filePath: string, config: Config): boolean {
const filenameWithExt = filePath.split(/[\\/]/).pop()!;
const shouldExcludeFile = config.excludeFilePattern.some((p) =>
p.test(filenameWithExt),
);
if (shouldExcludeFile) return false;
const normalized = normalizePath(filePath);
const shouldExcludeDir = config.excludeDirs.some((dir) =>
normalized.includes(`/${dir}/`),
);
if (shouldExcludeDir) return false;
const ext = path.extname(filePath);
if (!config.includeExtensions.includes(ext)) return false;
if (config.warnDuplicateTailwindImport) {
try {
const content = fs.readFileSync(filePath, "utf-8");
if (
content.includes('@import "tailwindcss"') ||
content.includes("@import 'tailwindcss'")
) {
console.warn(
`[gen-index-css] ${filePath} 含有重复的 @import "tailwindcss"，建议删除`,
);
}
} catch {
// ignore
}
}
return true;
}
function generateIndexFile(config: Config) {
const [targetDir] = config.targetDirs;
const dirPath = path.resolve(process.cwd(), targetDir);
const searchPattern = path.resolve(dirPath, "**", "*.*");
const allFiles = globSync(searchPattern, {
nodir: true,
absolute: true,
windowsPathsNoEscape: true,
dot: false,
follow: true,
});
const validFiles = allFiles.filter((f) => isValidFile(f, config));
console.log(`✅ 有效 CSS 文件数量: ${validFiles.length}`);
validFiles.sort();
const importStatements = validFiles.map((file) => {
const relPath = path.relative(dirPath, file);
const importPath = "./" + relPath.replace(/\\/g, "/");
return `${config.importSyntax} '${importPath}';`;
});
const indexContent = `
@import "tailwindcss";
${importStatements.join("\n")}
`.trim();
const indexFilePath = path.resolve(dirPath, config.indexFileName);
// ✅ 内容比对，防止无限 rebuild
if (fs.existsSync(indexFilePath)) {
const old = fs.readFileSync(indexFilePath, "utf8");
if (old === indexContent) return;
}
fs.writeFileSync(indexFilePath, indexContent, "utf8");
console.log(`✅ 成功生成 ${config.indexFileName}: ${indexFilePath}`);
}
export function genIndexCssPlugin(): Plugin {
return {
name: "vite-plugin-gen-index-css",
apply: "build",
buildStart() {
try {
generateIndexFile(CONFIG);
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
this.error(`[gen-index-css] failed: ${msg}`);
throw err;
}
},
handleHotUpdate({ file }) {
if (normalizePath(file).endsWith(`/src/${CONFIG.indexFileName}`)) {
return [];
}
},
};
}

40
templates/vite-react-template/tsconfig.base.json
View File

@@ -1,40 +0,0 @@
{
// tsconfig.base.json，用于被 tesconfig.json 和 tesconfig.build.json 继承
"compilerOptions": {
// 输出模块语法，使用版本号最新的那个，而不是实验性语法 ESNext
"module": "es2022",
// 模块解析策略，模拟 Vite / Rollup / webpack，支持 exports / imports，不强制 Node ESM 的严格规则
"moduleResolution": "bundler",
// 显式声明使用的类型包
"types": ["node", "react", "vite/client"],
// 开启所有严格类型检查，防止 any / 隐式 any 扩散
"strict": true,
// 允许 ESM 导入 CJS
"esModuleInterop": true,
// 跳过 node_modules 类型检查，加快构建，避免第三方类型污染
"skipLibCheck": true,
// 模块检测策略，不会影响 node_modules 中的第三方 CommonJS 依赖，Vite 会在预构建阶段自动将其转换为 ESM。
"moduleDetection": "force",
// 保留源码中的 import / export 语句原样输出，不进行自动转换（如 import → require），通常与 moduleDetection: "force" 搭配使用
"verbatimModuleSyntax": true,
// 是否检查“未使用的局部变量”
"noUnusedLocals": true,
// 是否检查“未使用的函数参数”
"noUnusedParameters": true,
// 是否只允许“可擦除的语法（Erasable Syntax），确保 TypeScript 语法在编译后可完全移除
"erasableSyntaxOnly": true,
// 是否禁止 switch 语句中的 case 贯穿（fallthrough），如果 case 没有 break / return，会报错
"noFallthroughCasesInSwitch": true
}
}