add react framework

.gitignore

@@ -11,3 +11,4 @@
 
 #!.yarn/cache
 .pnp.*
+node_modules

.prettierignore

@@ -0,0 +1,6 @@
+/node_modules
+package*.json
+.gitignore
+*.local
+*_local
+__test__

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "useTabs": true,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "trailingComma": "none",
+  "printWidth": 100
+}

libs/index.ts

@@ -1,15 +1 @@
-export function helloWorld() {
+export {AppRoutes} from './routes'
-  console.log("Hello World!");
-}
-/**
- * 将数字格式化为美式金额表示法
- * 将金额格式化为两位小数,需要处理千分位格式
- * @param amount - 需要格式化的数字金额
- * @returns 返回格式化后的金额字符串，保留2位小数
- * @example
- * formatMoney(1234.5) // 返回 "1,234.50"
- * formatMoney(1000000) // 返回 "1,000,000.00"
- */
-export function formatMoney(amount: number) {
-    return new Intl.NumberFormat('en-US', { style: 'decimal', minimumFractionDigits: 2, maximumFractionDigits: 2 }).format(amount);
-}

libs/pages/about/index.tsx

@@ -0,0 +1,6 @@
+import React from 'react'
+export default class About extends React.Component {
+    render() {
+        return <h1>About</h1>
+    }
+}

libs/pages/home/index.tsx

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

libs/routes/index.tsx

@@ -0,0 +1,17 @@
+import { Route, Routes, BrowserRouter } from "react-router-dom";
+
+import Home from '../pages/home';
+import About from '../pages/about';
+
+export const AppRoutes = () => (<Routes>
+    <Route path="/" element={<Home />} />
+    <Route path="ablout" element={<About />} />
+</Routes>)
+
+const AppBrowserRouterRouter = () => (
+    <BrowserRouter>
+        <AppRoutes />
+    </BrowserRouter>
+);
+
+export default AppBrowserRouterRouter;

libs/utils/index.ts

@@ -0,0 +1,15 @@
+export function helloWorld() {
+  console.log("Hello World!");
+}
+/**
+ * 将数字格式化为美式金额表示法
+ * 将金额格式化为两位小数,需要处理千分位格式
+ * @param amount - 需要格式化的数字金额
+ * @returns 返回格式化后的金额字符串，保留2位小数
+ * @example
+ * formatMoney(1234.5) // 返回 "1,234.50"
+ * formatMoney(1000000) // 返回 "1,000,000.00"
+ */
+export function formatMoney(amount: number) {
+    return new Intl.NumberFormat('en-US', { style: 'decimal', minimumFractionDigits: 2, maximumFractionDigits: 2 }).format(amount);
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "packages",
-  "version": "0.0.1",
+  "version": "0.0.4",
   "type": "module",
   "license": "MIT",
   "author": "callmeyan <me@xiaoyan.me>",
@@ -21,9 +21,15 @@
     "clean": "git clean -xdf dist",
     "test": "bun test"
   },
-  "packageManager": "yarn@4.5.2",
   "devDependencies": {
+    "@types/react": "^19.1.2",
     "tsup": "^8.4.0",
     "typescript": "^5.8.3"
+  },
+  "dependencies": {
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "react-router-dom": "^7.5.1",
+    "zustand": "^5.0.3"
   }
 }

tests/utils.test.ts

@@ -1,5 +1,5 @@
 // index.test.ts
-import { formatMoney } from '../libs/index';
+import { formatMoney } from '../libs/utils/index';
 
 describe('FormatMoneyTest', () => {
     test('should format positive integer correctly', () => {

tsconfig.json

@@ -0,0 +1,26 @@
+{
+	"compilerOptions": {
+		"target": "ES2020",
+		"useDefineForClassFields": true,
+		"module": "ESNext",
+		"lib": ["ES2020", "DOM", "DOM.Iterable"],
+		"skipLibCheck": true,
+
+		/* Bundler mode */
+		"moduleResolution": "bundler",
+		"allowImportingTsExtensions": true,
+		"isolatedModules": true,
+		"moduleDetection": "force",
+		"noEmit": true,
+		"jsx": "react-jsx",
+		"jsxImportSource": "react",
+
+		/* Linting */
+		"strict": true,
+		"noUnusedLocals": true,
+		"noUnusedParameters": true,
+		"noFallthroughCasesInSwitch": true,
+		"noUncheckedSideEffectImports": true
+	},
+	"include": ["libs", "tests"]
+}