@moluoxixi/create-app 2.0.1

package/templates/react/base/src/main.tsx.ejs

@@ -0,0 +1,39 @@
+/**
+ * 应用入口文件
+ * 初始化 React 应用并挂载到 DOM
+ */
+
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import { RouterProvider } from 'react-router-dom'
+<% if (i18n) { -%>
+import '@/locales'
+<% } -%>
+<% if (sentry) { -%>
+import { initSentry } from '@/utils/sentry'
+<% } -%>
+import { createRouter } from '@/router'
+
+// 导入样式文件
+<% if (uiLibrary === 'ant-design') { -%>
+import 'antd/dist/reset.css'
+<% } -%>
+import '@/assets/styles/main.scss'
+import '@/assets/fonts/index.css'
+
+<% if (sentry) { -%>
+// 初始化 Sentry
+initSentry({
+  dsn: import.meta.env.VITE_SENTRY_DSN,
+  environment: import.meta.env.MODE,
+})
+
+<% } -%>
+const router = createRouter()
+
+ReactDOM.createRoot(document.getElementById('root')!).render(
+  <React.StrictMode>
+    <RouterProvider router={router} />
+  </React.StrictMode>,
+)
+

package/templates/react/base/src/pages/about/index.tsx

@@ -0,0 +1,14 @@
+/**
+ * 关于页面
+ */
+
+function About(): JSX.Element {
+  return (
+    <div className="about-page">
+      <h1>关于</h1>
+      <p>这是关于页面</p>
+    </div>
+  )
+}
+
+export default About

package/templates/react/base/src/pages/home/index.tsx

@@ -0,0 +1,14 @@
+/**
+ * 首页
+ */
+
+function Home(): JSX.Element {
+  return (
+    <div className="home-page">
+      <h1>欢迎使用 React Template</h1>
+      <p>这是一个基于 React + Vite + TypeScript 的项目模板</p>
+    </div>
+  )
+}
+
+export default Home

package/templates/react/base/src/router/index.tsx.ejs

@@ -0,0 +1,28 @@
+/**
+ * 路由配置
+ */
+
+import { createBrowserRouter, createHashRouter } from 'react-router-dom'
+<% if (routeMode === 'file-system') { -%>
+import routes from '~react-pages'
+<% } else { -%>
+import { routes } from './routes'
+<% } -%>
+
+interface RouterConfig {
+  historyMode?: 'hash' | 'history'
+  basename?: string
+}
+
+export function createRouter(config: RouterConfig = {}) {
+  const { historyMode = 'history', basename } = config
+
+  if (historyMode === 'hash') {
+    return createHashRouter(routes, { basename })
+  }
+
+  return createBrowserRouter(routes, { basename })
+}
+
+export { routes }
+

package/templates/react/base/src/stores/user.ts

@@ -0,0 +1,39 @@
+/**
+ * 用户状态管理
+ * 基于 Zustand
+ */
+
+import { create } from 'zustand'
+import { persist } from 'zustand/middleware'
+
+interface UserInfo {
+  id: string
+  username: string
+  email: string
+  avatar?: string
+  roles: string[]
+}
+
+interface UserState {
+  userInfo: UserInfo | null
+  token: string
+  setUserInfo: (info: UserInfo | null) => void
+  setToken: (token: string) => void
+  clearUser: () => void
+}
+
+export const useUserStore = create<UserState>()(
+  persist(
+    set => ({
+      userInfo: null,
+      token: '',
+      setUserInfo: info => set({ userInfo: info }),
+      setToken: token => set({ token }),
+      clearUser: () => set({ userInfo: null, token: '' }),
+    }),
+    {
+      name: 'user-storage',
+      partialize: state => ({ token: state.token }),
+    },
+  ),
+)

package/templates/react/base/tsconfig.app.json

@@ -0,0 +1,17 @@
+{
+  "extends": "./tsconfig.base.json",
+  "compilerOptions": {
+    "composite": true,
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": [
+    "env.d.ts",
+    "src/**/*",
+    "src/**/*.tsx"
+  ]
+}
+

package/templates/react/base/tsconfig.base.json

@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true,
+    "resolveJsonModule": true,
+    "esModuleInterop": true
+  }
+}
+

package/templates/react/base/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "files": [],
+  "references": [
+    {
+      "path": "./tsconfig.app.json"
+    },
+    {
+      "path": "./tsconfig.node.json"
+    }
+  ]
+}
+

package/templates/react/base/tsconfig.node.json

@@ -0,0 +1,15 @@
+{
+  "extends": "./tsconfig.base.json",
+  "compilerOptions": {
+    "composite": true,
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "types": ["node"]
+  },
+  "include": [
+    "vite.config.*",
+    "eslint.config.*",
+    "commitlint.config.*",
+    "scripts/**/*"
+  ]
+}
+

package/templates/react/base/vite.config.ts

@@ -0,0 +1,52 @@
+/**
+ * Vite 配置文件
+ * 基于 @moluoxixi/vite-config 的配置
+ */
+
+import path from 'node:path'
+import process from 'node:process'
+import cssModuleGlobalRootPlugin from '@moluoxixi/css-module-global-root-plugin'
+import { ViteConfig, wrapperEnv } from '@moluoxixi/vite-config'
+import { loadEnv } from 'vite'
+
+export default ViteConfig(
+  ({ mode }) => {
+    const env = loadEnv(mode!, process.cwd())
+    const viteEnv = wrapperEnv(env)
+    const rootPath = path.resolve()
+    const appCode = viteEnv.VITE_APP_CODE
+    const appTitle = viteEnv.VITE_APP_TITLE
+    const port = viteEnv.VITE_APP_PORT
+    return {
+      rootPath,
+      appTitle,
+      appCode,
+      port,
+      react: true,
+      viteConfig: {
+        plugins: [],
+        server: {
+          proxy: {
+            '/api': {
+              changeOrigin: true,
+              target: 'http://localhost:3000',
+            },
+          },
+        },
+        css: {
+          postcss: {
+            plugins: [
+              cssModuleGlobalRootPlugin,
+            ],
+          },
+          preprocessorOptions: {
+            scss: {
+              silenceDeprecations: ['legacy-js-api'],
+              api: 'modern-compiler',
+            },
+          },
+        },
+      },
+    }
+  },
+)

package/templates/react/features/ant-design/package.json

@@ -0,0 +1,7 @@
+{
+  "dependencies": {
+    "@ant-design/icons": "catalog:build",
+    "antd": "catalog:build"
+  }
+}
+

package/templates/react/features/ant-design/pnpm-workspace.yaml

@@ -0,0 +1,5 @@
+catalogs:
+  build:
+    "@ant-design/icons": ^5.5.1
+    antd: ^5.22.0
+

package/templates/react/features/eslint/eslint.config.ts

@@ -0,0 +1,12 @@
+import eslintConfig from '@moluoxixi/eslint-config'
+
+export default eslintConfig({
+  react: true,
+  typescript: true,
+  ignores: [],
+  rules: {
+    'perfectionist/sort-imports': 'off',
+    'jsonc/sort-keys': 'off',
+  },
+})
+

package/templates/react/features/eslint/package.json

@@ -0,0 +1,7 @@
+{
+  "devDependencies": {
+    "@moluoxixi/eslint-config": "catalog:dev",
+    "eslint": "catalog:dev",
+    "eslint-plugin-format": "catalog:dev"
+  }
+}

package/templates/react/features/eslint/pnpm-workspace.yaml

@@ -0,0 +1,6 @@
+catalogs:
+  dev:
+    '@moluoxixi/eslint-config': latest
+    eslint: ^9.22.0
+    eslint-plugin-format: ^1.0.1
+

package/templates/react/features/i18n/package.json

@@ -0,0 +1,7 @@
+{
+  "dependencies": {
+    "i18next": "catalog:build",
+    "react-i18next": "catalog:build"
+  }
+}
+

package/templates/react/features/i18n/pnpm-workspace.yaml

@@ -0,0 +1,5 @@
+catalogs:
+  build:
+    i18next: ^24.0.0
+    react-i18next: ^15.1.0
+

package/templates/react/features/i18n/src/locales/index.ts

@@ -0,0 +1,20 @@
+import i18n from 'i18next'
+import { initReactI18next } from 'react-i18next'
+
+import en from './lang/en'
+import zh from './lang/zh'
+
+i18n.use(initReactI18next).init({
+  resources: {
+    zh: { translation: zh },
+    en: { translation: en },
+  },
+  lng: localStorage.getItem('locale') || 'zh',
+  fallbackLng: 'zh',
+  interpolation: {
+    escapeValue: false,
+  },
+})
+
+export default i18n
+

package/templates/react/features/manualRoutes/src/router/routes.tsx

@@ -0,0 +1,21 @@
+import type { RouteObject } from 'react-router-dom'
+import { lazy, Suspense } from 'react'
+
+const Home = lazy(() => import('@/pages/home'))
+const About = lazy(() => import('@/pages/about'))
+
+function LazyLoad({ children }: { children: React.ReactNode }) {
+  return <Suspense fallback={<div>Loading...</div>}>{children}</Suspense>
+}
+
+export const routes: RouteObject[] = [
+  {
+    path: '/',
+    element: <LazyLoad><Home /></LazyLoad>,
+  },
+  {
+    path: '/about',
+    element: <LazyLoad><About /></LazyLoad>,
+  },
+]
+

package/templates/react/features/pageRoutes/package.json

@@ -0,0 +1,6 @@
+{
+  "dependencies": {
+    "vite-plugin-pages": "catalog:build"
+  }
+}
+

package/templates/react/features/pageRoutes/pnpm-workspace.yaml

@@ -0,0 +1,4 @@
+catalogs:
+  build:
+    vite-plugin-pages: ^0.32.4
+

package/templates/react/features/pageRoutes/vite.config.data.ts

@@ -0,0 +1,10 @@
+import type { ViteConfigData } from '../../../../src/types/viteConfig'
+
+const data: ViteConfigData = {
+  options: {
+    pageRoutes: true,
+  },
+}
+
+export default data
+

package/templates/react/features/router/package.json

@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "react-router-dom": "catalog:build"
+  }
+}

package/templates/react/features/router/pnpm-workspace.yaml

@@ -0,0 +1,3 @@
+catalogs:
+  build:
+    react-router-dom: ^6.28.0

package/templates/react/features/sentry/package.json

@@ -0,0 +1,7 @@
+{
+  "dependencies": {
+    "@sentry/react": "catalog:build",
+    "@sentry/vite-plugin": "catalog:build"
+  }
+}
+

package/templates/react/features/sentry/pnpm-workspace.yaml

@@ -0,0 +1,5 @@
+catalogs:
+  build:
+    "@sentry/react": ^9.27.0
+    "@sentry/vite-plugin": ^3.5.0
+

package/templates/react/features/sentry/src/utils/sentry.ts

@@ -0,0 +1,30 @@
+import * as Sentry from '@sentry/react'
+
+interface SentryConfig {
+  dsn: string
+  environment?: string
+  release?: string
+}
+
+export function initSentry(config: SentryConfig): void {
+  const { dsn, environment = 'production', release } = config
+
+  if (!dsn) {
+    console.warn('[Sentry] DSN is not configured, skipping initialization')
+    return
+  }
+
+  Sentry.init({
+    dsn,
+    environment,
+    release,
+    integrations: [
+      Sentry.browserTracingIntegration(),
+      Sentry.replayIntegration(),
+    ],
+    tracesSampleRate: 1.0,
+    replaysSessionSampleRate: 0.1,
+    replaysOnErrorSampleRate: 1.0,
+  })
+}
+

package/templates/react/features/sentry/vite.config.data.ts

@@ -0,0 +1,23 @@
+import type { ViteConfigData } from '../../../../src/types/viteConfig'
+
+const data: ViteConfigData = {
+  imports: [
+    'import { sentryVitePlugin } from \'@sentry/vite-plugin\'',
+  ],
+  plugins: [
+    `viteEnv.VITE_SENTRY && mode === 'production' && sentryVitePlugin({
+            authToken: process.env.SENTRY_AUTH_TOKEN,
+            org: 'f1f562b9b82f',
+            project: 'javascript-react',
+            sourcemaps: {
+              assets: './dist/**',
+              ignore: ['node_modules'],
+            },
+            release: {
+              name: viteEnv.VITE_APP_VERSION || 'unknown',
+            },
+          })`,
+  ],
+}
+
+export default data

package/templates/react/features/zustand/package.json

@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "zustand": "catalog:build"
+  }
+}

package/templates/react/features/zustand/pnpm-workspace.yaml

@@ -0,0 +1,3 @@
+catalogs:
+  build:
+    zustand: ^5.0.0

package/templates/react/features/zustand/src/stores/user.ts

@@ -0,0 +1,19 @@
+import type { UserStateType } from '@/types/stores'
+
+import { create } from 'zustand'
+import { persist } from 'zustand/middleware'
+
+export const useUserStore = create<UserStateType>()(
+  persist(
+    set => ({
+      token: '',
+      userInfo: null,
+      setToken: (token: string) => set({ token }),
+      setUserInfo: (userInfo) => set({ userInfo }),
+      logout: () => set({ token: '', userInfo: null }),
+    }),
+    {
+      name: 'user-storage',
+    },
+  ),
+)

package/templates/react/features/zustand/src/types/stores.ts

@@ -0,0 +1,15 @@
+/**
+ * Store 类型定义
+ */
+
+import type { UserInfoType } from '@/apis/types/user'
+
+/** 用户 Store 状态类型 */
+export interface UserStateType {
+  token: string
+  userInfo: UserInfoType | null
+  setToken: (token: string) => void
+  setUserInfo: (info: UserInfoType) => void
+  logout: () => void
+}
+

package/templates/vue/base/env.d.ts

@@ -0,0 +1,27 @@
+/**
+ * 环境变量类型声明
+ */
+
+/// <reference types="vite/client" />
+
+interface ImportMetaEnv {
+  readonly VITE_APP_CODE: string;
+  readonly VITE_APP_TITLE: string;
+  readonly VITE_APP_PORT: number;
+  readonly VITE_APP_VERSION: string;
+  readonly VITE_APP_ENV: string;
+  readonly VITE_API_BASE_URL: string;
+  readonly VITE_SENTRY: boolean;
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv;
+}
+
+declare module '*.vue' {
+  import type { DefineComponent } from 'vue';
+
+  const component: DefineComponent<object, object, unknown>;
+  export default component;
+}
+

package/templates/vue/base/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>%VITE_APP_TITLE%</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
+

package/templates/vue/base/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "vue-project",
+  "scripts": {
+    "type-check": "vue-tsc --noEmit"
+  },
+  "dependencies": {
+    "vue": "catalog:build"
+  },
+  "devDependencies": {
+    "@vue-macros/volar": "catalog:dev",
+    "vue-tsc": "catalog:dev"
+  }
+}

package/templates/vue/base/pnpm-workspace.yaml

@@ -0,0 +1,6 @@
+catalogs:
+  build:
+    vue: ^3.5.13
+  dev:
+    "@vue-macros/volar": ^3.0.0-beta.15
+    vue-tsc: ^2.2.8

package/templates/vue/base/src/App.vue

@@ -0,0 +1,13 @@
+<script setup lang="ts">
+/**
+ * 根组件
+ */
+</script>
+
+<template>
+  <RouterView />
+</template>
+
+<style scoped>
+</style>
+

package/templates/vue/base/src/assets/styles/element/index.scss

@@ -0,0 +1,27 @@
+/**
+ * Element Plus 样式定制
+ * 自定义 Element Plus 主题
+ */
+
+@forward 'element-plus/theme-chalk/src/common/var.scss' with (
+  $colors: (
+    'primary': (
+      'base': #409eff,
+    ),
+    'success': (
+      'base': #67c23a,
+    ),
+    'warning': (
+      'base': #e6a23c,
+    ),
+    'danger': (
+      'base': #f56c6c,
+    ),
+    'info': (
+      'base': #909399,
+    ),
+  ),
+);
+
+@use 'element-plus/theme-chalk/src/index.scss' as *;
+

package/templates/vue/base/src/assets/styles/main.scss

@@ -0,0 +1,9 @@
+/**
+ * 主样式文件
+ * 导入所有样式
+ */
+
+@import './base.scss';
+@import './custom.scss';
+@import './tailwind.scss';
+

package/templates/vue/base/src/components/SubMenu/index.ts

@@ -0,0 +1,9 @@
+/**
+ * SubMenu 组件导出
+ */
+
+import SubMenu from './src/index.vue';
+
+export { SubMenu };
+export default SubMenu;
+

package/templates/vue/base/src/components/SubMenu/src/_types/index.ts

@@ -0,0 +1,6 @@
+/**
+ * SubMenu 类型导出
+ */
+
+export * from './props';
+