create-bubbles 0.1.20 → 0.1.22

package/template-vp-monorepo-react-nestjs/apps/server/src/modules/test/db/db.service.ts

@@ -0,0 +1,22 @@
+import { DRIZZLE, type DrizzleDB } from '@/database/db.module'
+import { Inject, Injectable } from '@nestjs/common'
+import { users } from '@/database/schema'
+
+@Injectable()
+export class DbService {
+  constructor(@Inject(DRIZZLE) private readonly db: DrizzleDB) {}
+
+  async ping() {
+    const res = await this.db.execute('SELECT now() AS now')
+    return res.rows[0]
+  }
+
+  async findAll() {
+    return this.db.query.users.findMany()
+  }
+
+  async create(data: Omit<typeof users.$inferInsert, 'id' | 'createdAt'>) {
+    const [row] = await this.db.insert(users).values(data).returning()
+    return row
+  }
+}

package/template-vp-monorepo-react-nestjs/apps/server/src/modules/test/db/dto/create-user.dto.ts

@@ -0,0 +1,27 @@
+import { users } from '@/database/schema'
+import { createInsertSchema } from 'drizzle-zod'
+import { createZodDto } from 'nestjs-zod'
+import { z } from 'zod'
+/**
+ * 1. 基于数据库表生成zod schema
+ *   drizzle-zod 会自动把 varchar({ length: 100 }) 翻成 .max(100)
+ *   把notNull 翻成 必填字段
+ */
+
+const baseSchema = createInsertSchema(users, {
+  // 数据库不知道邮箱格式， 这里用zod增强
+  email: z.email(),
+})
+
+/**
+ * 2. 创建用户的入参不应该包括 id 和 createdAt(这两数据库自动生成)
+ */
+export const createUserSchema = baseSchema.omit({
+  id: true,
+  createdAt: true,
+})
+
+/**
+ * 3. 包成nestjs dto
+ */
+export class CreateUserDto extends createZodDto(createUserSchema) {}

package/template-vp-monorepo-react-nestjs/apps/server/src/modules/test/redis/dto/redis-quary.dto.ts

@@ -0,0 +1,18 @@
+import { z } from 'zod'
+import { createZodDto } from 'nestjs-zod'
+
+// GET /redis/set?key=name&value=tom&ttl=60
+export const SetQuerySchema = z.object({
+  key: z.string().min(1, 'key不能为空'),
+  value: z.string().min(1, 'value不能为空'),
+  // url 查询参数都是字符串， z coerce.number() 会自动把 “60” 转换为 60
+  ttl: z.coerce.number().int().positive('ttl 必须是正整数').optional(),
+})
+
+export class SetQueryDto extends createZodDto(SetQuerySchema) {}
+
+export const GetQuerySchema = z.object({
+  key: z.string().min(1, 'key 不能为空'),
+})
+
+export class GetQueryDto extends createZodDto(GetQuerySchema) {}

package/template-vp-monorepo-react-nestjs/apps/server/src/modules/test/redis/redis.controller.ts

@@ -0,0 +1,31 @@
+import { Body, Controller, Get, Post, Query } from '@nestjs/common'
+import { RedisService } from './redis.service'
+import { ApiOperation, ApiTags } from '@nestjs/swagger'
+import { GetQueryDto, SetQueryDto } from './dto/redis-quary.dto'
+
+@ApiTags('Redis 测试')
+@Controller('redis')
+export class RedisController {
+  constructor(private readonly redisService: RedisService) {}
+
+  @ApiOperation({ summary: '测试 Redis 连接' })
+  @Get('ping')
+  async ping() {
+    return { pong: await this.redisService.ping() }
+  }
+
+  // GET /redis/set?key=name&value=tom&ttl=60
+  @ApiOperation({ summary: '设置键值对' })
+  @Post('set')
+  async set(@Body() body: SetQueryDto) {
+    await this.redisService.set(body.key, body.value, body.ttl ? Number(body.ttl) : undefined)
+    return { key: body.key, value: body.value, ttl: body.ttl ?? null }
+  }
+
+  // GET /redis/get?key=name
+  @ApiOperation({ summary: '获取键值对' })
+  @Get('get')
+  async get(@Query('key') query: GetQueryDto) {
+    return { key: query.key, value: await this.redisService.get(query.key) }
+  }
+}

package/template-vp-monorepo-react-nestjs/apps/server/src/modules/test/redis/redis.module.ts

@@ -0,0 +1,9 @@
+import { Module } from '@nestjs/common'
+import { RedisService } from './redis.service'
+import { RedisController } from './redis.controller'
+
+@Module({
+  controllers: [RedisController],
+  providers: [RedisService],
+})
+export class TestRedisModule {}

package/template-vp-monorepo-react-nestjs/apps/server/src/modules/test/redis/redis.service.ts

@@ -0,0 +1,37 @@
+import { Injectable } from '@nestjs/common'
+import { InjectRedis } from '@nestjs-modules/ioredis'
+import Redis from 'ioredis'
+
+@Injectable()
+export class RedisService {
+  constructor(@InjectRedis() private readonly redis: Redis) {}
+
+  async ping() {
+    return this.redis.ping()
+  }
+
+  async set(key: string, value: string, ttlSeconds?: number) {
+    if (ttlSeconds && ttlSeconds > 0) {
+      await this.redis.set(key, value, 'EX', ttlSeconds)
+    } else {
+      await this.redis.set(key, value)
+    }
+    return 'Ok'
+  }
+
+  async get(key: string) {
+    return this.redis.get(key)
+  }
+
+  async del(key: string) {
+    return this.redis.del(key)
+  }
+
+  async exist(key: string) {
+    return (await this.redis.exists(key)) === 1
+  }
+
+  async keys(pattern: string) {
+    return this.redis.keys(pattern)
+  }
+}

package/template-vp-monorepo-react-nestjs/apps/server/src/utils/server-address.ts

@@ -0,0 +1,33 @@
+import { networkInterfaces } from 'os'
+
+const color = {
+  cyan: (text: string) => `\x1b[36m${text}\x1b[0m`,
+  green: (text: string) => `\x1b[32m${text}\x1b[0m`,
+  bold: (text: string) => `\x1b[1m${text}\x1b[0m`,
+}
+
+function terminalLink(url: string) {
+  return `\x1b]8;;${url}\x1b\\${color.cyan(url)}\x1b]8;;\x1b\\`
+}
+
+export function getNetworkUrls(port: number) {
+  return Object.values(networkInterfaces())
+    .flatMap((items) => items ?? [])
+    .filter((item) => item.family === 'IPv4' && !item.internal)
+    .map((item) => `http://${item.address}:${port}/`)
+}
+
+/**
+ * 打印服务器网络地址
+ * @param port 服务器端口
+ */
+export function logNetworkUrls(port: number) {
+  const localUrl = `http://localhost:${port}/`
+
+  console.log(`\n  ${color.bold(color.green('NEST'))}  ${color.green('dev')}`)
+  console.log(`  ${color.green('➜')}  ${color.bold('Local:')}   ${terminalLink(localUrl)}`)
+
+  for (const url of new Set(getNetworkUrls(port))) {
+    console.log(`  ${color.green('➜')}  ${color.bold('Network:')} ${terminalLink(url)}`)
+  }
+}

package/template-vp-monorepo-react-nestjs/apps/server/tsconfig.build.json

@@ -0,0 +1,4 @@
+{
+  "extends": "./tsconfig.json",
+  "exclude": ["node_modules", "test", "dist", "**/*spec.ts"]
+}

package/template-vp-monorepo-react-nestjs/apps/server/tsconfig.json

@@ -0,0 +1,28 @@
+{
+  "compilerOptions": {
+    "module": "nodenext",
+    "moduleResolution": "nodenext",
+    "resolvePackageJsonExports": true,
+    "esModuleInterop": true,
+    "isolatedModules": true,
+    "declaration": true,
+    "removeComments": true,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "allowSyntheticDefaultImports": true,
+    "target": "ES2023",
+    "sourceMap": true,
+    "outDir": "./dist",
+    "rootDir": "./",
+    "incremental": true,
+    "skipLibCheck": true,
+    "strictNullChecks": true,
+    "forceConsistentCasingInFileNames": true,
+    "noImplicitAny": false,
+    "strictBindCallApply": false,
+    "noFallthroughCasesInSwitch": false,
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  }
+}

package/template-vp-monorepo-react-nestjs/apps/web/.env

@@ -1 +1,2 @@
 VITE_PORT = 9999
+VITE_API_AFFIX = /api

package/template-vp-monorepo-react-nestjs/apps/web/.env.dev

@@ -0,0 +1 @@
+VITE_API_URL = http://localhost:10000

package/template-vp-monorepo-react-nestjs/apps/web/.env.prod

@@ -0,0 +1 @@
+VITE_API_URL = http://192.168.2.108:10000

package/template-vp-monorepo-react-nestjs/apps/web/package.json

@@ -1,39 +1,35 @@
 {
-  "name": "bubbles-project",
+  "name": "web",
   "version": "0.0.0",
   "private": true,
   "type": "module",
   "scripts": {
-    "dev": "vp dev",
-    "build": "tsc && vp build",
-    "preview": "vp preview",
-    "prepare": "vp config",
-    "check": "vp check"
+    "dev": "vp dev --mode dev",
+    "build": "tsc && vp build --mode dev",
+    "preview": "vp preview"
   },
   "dependencies": {
-    "@tailwindcss/vite": "^4.2.2",
-    "antd": "^6.3.6",
-    "classnames": "^2.5.1",
-    "dayjs": "^1.11.20",
-    "react": "^19.2.5",
-    "react-dom": "^19.2.5",
-    "react-router": "^7.14.1",
-    "tailwindcss": "^4.2.2"
+    "@alova/adapter-axios": "catalog:",
+    "@bubblesjs/i18n-core": "workspace:*",
+    "@bubblesjs/i18n-react": "workspace:*",
+    "@tailwindcss/vite": "catalog:",
+    "alova": "catalog:",
+    "antd": "catalog:",
+    "axios": "catalog:",
+    "classnames": "catalog:",
+    "dayjs": "catalog:",
+    "react": "catalog:",
+    "react-dom": "catalog:",
+    "react-router": "catalog:",
+    "tailwindcss": "catalog:"
   },
   "devDependencies": {
-    "@types/react": "^19.2.14",
-    "@types/react-dom": "^19.2.3",
-    "@vitejs/plugin-react": "^6.0.1",
+    "@types/react": "catalog:",
+    "@types/react-dom": "catalog:",
+    "@vitejs/plugin-react": "catalog:",
     "typescript": "catalog:",
-    "unplugin-auto-import": "^21.0.0",
+    "unplugin-auto-import": "catalog:",
     "vite": "catalog:",
     "vite-plus": "catalog:"
-  },
-  "packageManager": "pnpm@10.33.0",
-  "pnpm": {
-    "overrides": {
-      "vite": "npm:@voidzero-dev/vite-plus-core@latest",
-      "vitest": "npm:@voidzero-dev/vite-plus-test@latest"
-    }
   }
 }

package/template-vp-monorepo-react-nestjs/apps/web/src/App.tsx

@@ -1,23 +1,24 @@
 import { ConfigProvider } from 'antd'
-import zhCN from 'antd/es/locale/zh_CN'
 import dayjs from 'dayjs'
 import 'dayjs/locale/zh-cn'
 import { Suspense } from 'react'
 import { RouterProvider } from 'react-router'
-
 import PageLoading from '@/components/Loading/PageLoading'
-
 import { router } from './router'
 
 dayjs.locale('zh-cn')
 
+// const i18nStore = await i18n.init()
+
 function App() {
   return (
+    // <I18nProvider store={i18nStore}>
     <Suspense fallback={<PageLoading />}>
-      <ConfigProvider locale={zhCN}>
+      <ConfigProvider>
         <RouterProvider router={router} />
       </ConfigProvider>
     </Suspense>
+    // </I18nProvider>
   )
 }
 

package/template-vp-monorepo-react-nestjs/apps/web/src/locales/en_US.json

@@ -0,0 +1,4 @@
+{
+  "保存": "Save",
+  "你好1": "Hello"
+}

package/template-vp-monorepo-react-nestjs/apps/web/src/locales/zh_CN.json

@@ -0,0 +1,4 @@
+{
+  "保存": "保存",
+  "你好1": "你好"
+}

package/template-vp-monorepo-react-nestjs/apps/web/src/main.tsx

@@ -1,5 +1,5 @@
-import { createRoot } from "react-dom/client";
-import "./styles/index.css";
-import App from "./App.tsx";
+import { createRoot } from 'react-dom/client'
+import './styles/index.css'
+import App from './App.tsx'
 
-createRoot(document.getElementById("root")!).render(<App />);
+createRoot(document.getElementById('root')!).render(<App />)

package/template-vp-monorepo-react-nestjs/apps/web/src/pages/home/index.tsx

@@ -1,15 +1,45 @@
-import { DatePicker } from 'antd'
+import { createJsonStorage, i18n } from '@bubblesjs/i18n-core'
+import I18nProvider, { useI18n } from '@bubblesjs/i18n-react'
+import { Button } from 'antd'
 
-const delay = new Promise<void>(resolve => setTimeout(resolve, 2000))
-let resolved = false
-delay.then(() => (resolved = true))
+const leftStore = await i18n.init({
+  locale: 'zh_CN',
+  loaderMessage: async (locale?: string) => (await import(`@/locales/${locale}.json`))?.default,
+  storageKey: 'i18n-home-left',
+  storage: createJsonStorage(localStorage),
+})
 
-const Home = () => {
-  if (!resolved) throw delay
+const rightStore = await i18n.init({
+  locale: 'en_US',
+  loaderMessage: async (locale?: string) => (await import(`@/locales/${locale}.json`))?.default,
+  storageKey: 'i18n-home-right',
+  storage: createJsonStorage(localStorage),
+})
+
+const I18nTestNode = ({ title, switchLocale }: { title: string; switchLocale: string }) => {
+  const { tr, loadLocale, locale } = useI18n()
+
+  return (
+    <section className="flex min-w-64 flex-col gap-3 rounded border border-gray-200 p-4">
+      <h2 className="text-lg font-medium">{title}</h2>
+      <div>{tr('保存')}</div>
+      <div>{tr('你好1')}</div>
+      <div>目前语言: {locale}</div>
+      <Button onClick={() => void loadLocale(switchLocale)}>切换到 {switchLocale}</Button>
+    </section>
+  )
+}
 
+const Home = () => {
   return (
-    <div className="w-full bg-red-900">
-      <DatePicker />
+    <div className="flex min-h-screen w-full items-center justify-center gap-6 bg-white p-6">
+      <I18nProvider store={leftStore}>
+        <I18nTestNode title="节点 A" switchLocale="en_US" />
+      </I18nProvider>
+
+      <I18nProvider store={rightStore}>
+        <I18nTestNode title="节点 B" switchLocale="zh_CN" />
+      </I18nProvider>
     </div>
   )
 }

package/template-vp-monorepo-react-nestjs/apps/web/src/router/index.tsx

@@ -1,25 +1,25 @@
-import { createBrowserRouter, Navigate, type RouteObject } from "react-router";
+import { createBrowserRouter, Navigate, type RouteObject } from 'react-router'
 
-export const lazyLoad = (path: string, fileName = "index") => {
-  const Module = lazy(() => import(`@/pages/${path}/${fileName}.tsx`));
-  return <Module />;
-};
+export const lazyLoad = (path: string, fileName = 'index') => {
+  const Module = lazy(() => import(`@/pages/${path}/${fileName}.tsx`))
+  return <Module />
+}
 
 const routes: RouteObject[] = [
   {
-    path: "/",
-    id: "index",
-    element: <Navigate to={"/home"} />,
+    path: '/',
+    id: 'index',
+    element: <Navigate to={'/home'} />,
   },
   {
-    path: "/home",
-    id: "home",
-    element: lazyLoad("home"),
+    path: '/home',
+    id: 'home',
+    element: lazyLoad('home'),
   },
-];
+]
 
 export const router = createBrowserRouter(routes, {
-  basename: "/",
-});
+  basename: '/',
+})
 
-export const navigator = router.navigate;
+export const navigator = router.navigate

package/template-vp-monorepo-react-nestjs/apps/web/src/utils/env/index.ts

@@ -0,0 +1,6 @@
+export const envVariables = {
+  /**
+   * API 前缀
+   */
+  API_AFFIX: import.meta.env.VITE_API_AFFIX ?? '',
+}