chore: 🤖 use tsc build

lefthook.yml

@@ -30,7 +30,7 @@ pre-commit:
       glob: "*.{ts,tsx,js,jsx,json,jsonc,css}"
       run: na biome check --fix {staged_files} --reporter summary
       stage_fixed: true
-    # test:
-    #   priority: 5
-    #   glob: "*.{ts,tsx,js,jsx}"
-    #   run: na vitest related --run {staged_files}
+    test:
+      priority: 5
+      glob: "*.{ts,tsx,js,jsx}"
+      run: na vitest related --run {staged_files}

package.json

@@ -1,7 +1,7 @@
 {
   "name": "antd-enhanced",
   "version": "0.0.0",
-  "description": "Useful components for Ant Design",
+  "description": "Useful components based on Ant Design",
   "type": "module",
   "files": ["dist"],
   "exports": "./dist/index.js",
@@ -13,9 +13,9 @@
   },
   "scripts": {
     "lint": "biome check --fix src --reporter summary",
-    "build": "tsc && vite build",
+    "build": "tsc --project tsconfig.build.json",
     "dev": "storybook dev -p 6006",
-    "clear": "rm ./node_modules/.cache -r",
+    "dev:cc": "rm ./node_modules/.cache -r && nr dev",
     "build-storybook": "storybook build",
     "postinstall": "lefthook install",
     "commit": "git add -A && git-cz",
@@ -55,7 +55,6 @@
     "storybook": "^8.4.5",
     "typescript": "^5.7.2",
     "vite": "^5.4.11",
-    "vite-plugin-dts": "^4.3.0",
     "vite-plugin-svgr": "^4.3.0",
     "vitest": "^2.1.5"
   },

src/components/inputs/InputIntlPhone/CountrySelector/CountryRender.tsx

@@ -1,5 +1,5 @@
 import { Space } from 'antd';
-import { CountryFlag } from 'src/components';
+import { CountryFlag } from '../../../';
 import { useInputIntlPhoneContext } from '../InputIntlPhoneContext';
 import type { OptionRender } from './types';
 

src/components/inputs/InputIntlPhone/CountrySelector/CountrySelector.tsx

@@ -23,7 +23,7 @@ export function CountrySelector() {
     customRegions,
   } = useInputIntlPhoneContext();
 
-  const onSelect: OnSelect = (value, option) => {
+  const onSelect: OnSelect = (value) => {
     setPhone({ countryCode: value });
     setIsCountrySelectorOpen(false);
   };

src/components/inputs/InputIntlPhone/InputField/FlagAddon.tsx

@@ -1,4 +1,4 @@
-import { CountryFlag } from 'src/components';
+import { CountryFlag } from '../../../';
 import { useInputIntlPhoneContext } from '../InputIntlPhoneContext';
 
 export function FlagAddon() {

src/components/inputs/InputIntlPhone/InputIntlPhone.stories.ts

@@ -1,14 +1,14 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import { InputIntlPhone } from './InputIntlPhone';
 
-const meta = {
+const meta: Meta<typeof InputIntlPhone> = {
   title: 'Inputs/InputIntlPhone',
   component: InputIntlPhone,
   parameters: {
     layout: 'centered',
   },
   tags: ['autodocs'],
-} satisfies Meta<typeof InputIntlPhone>;
+};
 
 export default meta;
 type Story = StoryObj<typeof meta>;

src/components/inputs/InputPhone/InputPhone.stories.ts

@@ -1,14 +1,14 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import { InputPhone } from './InputPhone';
 
-const meta = {
+const meta: Meta<typeof InputPhone> = {
   title: 'Inputs/InputPhone',
   component: InputPhone,
   parameters: {
     layout: 'centered',
   },
   tags: ['autodocs'],
-} satisfies Meta<typeof InputPhone>;
+};
 
 export default meta;
 type Story = StoryObj<typeof meta>;

src/components/settings/ThemeModeSelector/ThemeModeSelector.tsx

@@ -1,7 +1,7 @@
 import { Dropdown, type GetProp, type MenuProps } from 'antd';
 import { AiFillMoon, AiFillSun, AiOutlineLaptop } from 'react-icons/ai';
 import { LuSunMoon } from 'react-icons/lu';
-import type { ThemeMode } from 'src/hooks';
+import type { ThemeMode } from '../../../hooks';
 
 type Props = {
   onSelect: (themeMode: ThemeMode) => void;

tsconfig.build.json

@@ -0,0 +1,33 @@
+// https://github.com/vitejs/vite/blob/main/packages/create-vite/template-react-ts/tsconfig.app.json
+{
+  "compilerOptions": {
+    /* 解析 */
+    "target": "ESNext",
+    "useDefineForClassFields": true,
+    "lib": ["DOM", "DOM.Iterable", "ESNext"],
+    "module": "ESNext",
+    "moduleDetection": "force",
+    /* 输出 */
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "sourceMap": true,
+    "declaration": true, // 自动生成声明文件
+    "outDir": "dist", // 输出目录
+    "jsx": "react-jsx",
+    /* 检查 */
+    "skipLibCheck": true,
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    /* Custom */
+    "esModuleInterop": false,
+    "allowSyntheticDefaultImports": true,
+    "forceConsistentCasingInFileNames": true,
+    "baseUrl": "."
+  },
+  "include": ["src"],
+  "exclude": ["**/*.test.*", "**/*.spec.*", "**/*.mdx", "**/*.stories.*"],
+  "tsc-alias": { "verbose": true }
+}

vite.config.ts

@@ -1,34 +1,28 @@
-import { resolve } from 'node:path';
 import react from '@vitejs/plugin-react-swc';
 import { defineConfig } from 'vite';
-import dts from 'vite-plugin-dts'; // https://github.com/qmhc/vite-plugin-dts/blob/main/README.zh-CN.md
 import svgr from 'vite-plugin-svgr'; // https://github.com/pd4d10/vite-plugin-svgr
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [react(), svgr(), dts({ rollupTypes: true, tsconfigPath: './tsconfig.app.json' })],
-  resolve: {
-    alias: {
-      src: resolve(__dirname, 'src'),
-    },
-  },
-  build: {
-    lib: {
-      // https://vite.dev/config/build-options.html#build-lib
-      entry: resolve(__dirname, 'src/index.ts'),
-      name: 'AntdEnhanced',
-      fileName: 'index',
-      formats: ['es'],
-    },
-    rollupOptions: {
-      external: ['react', 'react-dom', 'antd'],
-      output: {
-        globals: {
-          react: 'React',
-          'react-dom': 'react-dom',
-          antd: 'antd',
-        },
-      },
-    },
-  },
+  plugins: [react(), svgr()],
+  // NOTE: do not use alias https://github.com/microsoft/TypeScript/issues/30952
+  // build: {  https://github.com/vitejs/vite/discussions/18744
+  //   lib: {
+  //     // https://vite.dev/config/build-options.html#build-lib
+  //     entry: resolve(__dirname, 'src/index.ts'),
+  //     name: 'AntdEnhanced',
+  //     fileName: 'index',
+  //     formats: ['es'],
+  //   },
+  // rollupOptions: {
+  //   external: ['react', 'react-dom', 'antd'],
+  //   output: {
+  //     globals: {
+  //       react: 'React',
+  //       'react-dom': 'react-dom',
+  //       antd: 'antd',
+  //     },
+  //   },
+  // },
+  // },
 });