chore: 搭建项目基础

.gitignore

+# Dependencies
+node_modules/
+.pnp
+.pnp.js
+
+# Build outputs
+.nuxt/
+.output/
+dist/
+build/
+
+# Environment files
+.env
+.env.*
+!.env.example
+
+# IDE
+.vscode/
+.idea/
+*.swp
+*.swo
+*~
+
+# OS
+.DS_Store
+Thumbs.db
+
+# Logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Testing
+coverage/
+.nyc_output/
+
+# Cache
+.turbo/
+.cache/
+
+# Misc
+*.local

.husky/commit-msg

-#!/usr/bin/env sh
-(
-  # 检查是否在 git 目录
-  if [ -z "$GIT_DIR" ]; then
-    GIT_DIR=$(git rev-parse --git-dir)
-  fi
-
-  # 运行 commitlint
-  npx --no -- commitlint --edit ${1}
-)
+npx commitlint --edit $1

.husky/pre-commit

-#!/usr/bin/env sh
-(
+npx lint-staged
\ No newline at end of file
-  # 检查是否在 git 目录
-  if [ -z "$GIT_DIR" ]; then
-    GIT_DIR=$(git rev-parse --git-dir)
-  fi
-
-  # 运行 lint-staged
-  npx lint-staged
-)

.lintstagedrc

+{
+  "*.{js,ts,vue,cjs,mjs}": ["eslint --fix"],
+  "*.{css,scss,less,html,json,md,yml}": ["eslint --fix"]
+}

commitlint.config.mjs

+export default {
+  extends: ['@commitlint/config-conventional'],
+}

common/utils/package.json

+{
+    "name": "@common/utils",
+    "type": "module",
+    "version": "1.0.0",
+    "private": true,
+    "exports": {
+        ".": "./src/index.ts",
+        "./constants": "./src/constants.ts"
+    }
+}

common/utils/src/constants.ts

+export const APP_NAME = 'common-web'
+export const VERSION = '1.0.0'

common/utils/src/index.ts

+export * from './constants'

common/vue-kit/package.json

+{
+    "name": "@common/vue-kit",
+    "type": "module",
+    "version": "1.0.0",
+    "private": true,
+    "exports": {
+        ".": "./src/index.ts",
+        "./composables": "./src/composables/index.ts"
+    },
+    "peerDependencies": {
+        "vue": "^3.4.0"
+    }
+}

common/vue-kit/src/composables/use-window-width.ts

+import { onMounted, onUnmounted, ref } from 'vue'
+
+export function useWindowWidth() {
+  const width = ref(0)
+
+  function updateWidth() {
+    width.value = window.innerWidth
+  }
+
+  onMounted(() => {
+    updateWidth()
+    window.addEventListener('resize', updateWidth)
+  })
+
+  onUnmounted(() => {
+    window.removeEventListener('resize', updateWidth)
+  })
+
+  return { width }
+}

common/vue-kit/src/index.ts

+export * from './composables/use-window-width'

eslint.config.mjs

+import antfu from '@antfu/eslint-config'
+
+export default antfu(
+  {
+    typescript: true,
+    vue: true,
+    prettier: false,
+    formatters: {
+      css: true,
+      html: true,
+      markdown: true,
+    },
+    unocss: false,
+    perfectionist: false,
+    unicorn: false,
+
+    stylistic: {
+      indent: 4,
+      quotes: 'double',
+      semi: false,
+      jsx: true,
+    },
+
+    rules: {
+      'no-console': 'off',
+      'prefer-const': 'warn',
+      'no-empty': 'warn',
+      'eqeqeq': 'warn',
+      'no-var': 'warn',
+
+      'unused-imports/no-unused-vars': 'off',
+      'unused-imports/no-unused-imports': 'warn',
+      '@typescript-eslint/no-unused-vars': 'warn',
+      '@typescript-eslint/no-unused-expressions': 'warn',
+      'import/order': 'off',
+      'sort-imports': 'off',
+
+      '@typescript-eslint/no-explicit-any': 'off',
+      '@typescript-eslint/no-empty-object-type': 'off',
+      '@typescript-eslint/no-unsafe-function-type': 'off',
+      '@typescript-eslint/no-namespace': 'warn',
+      '@typescript-eslint/no-redeclare': 'off',
+      '@typescript-eslint/no-use-before-define': 'warn',
+      '@typescript-eslint/no-duplicate-enum-values': 'warn',
+      '@typescript-eslint/prefer-function-type': 'off',
+      'ts/method-signature-style': 'off',
+      'ts/ban-ts-comment': 'off',
+      'ts/no-unused-vars': 'off',
+
+      'vue/html-self-closing': 'off',
+      'vue/block-order': ['error', { order: ['template', 'script', 'style'] }],
+      'vue/html-indent': ['error', 4],
+      'vue/singleline-html-element-content-newline': 'off',
+      'vue/no-unused-refs': 'off',
+      'vue/custom-event-name-casing': 'off',
+      'vue/quote-props': 'off',
+      'vue/attributes-order': 'warn',
+
+      'style/quotes': 'off',
+      'style/indent': 'off',
+      'style/member-delimiter-style': 'off',
+      'style/brace-style': 'off',
+      'style/function-declaration': 'off',
+      'style/quote-props': 'off',
+      'style/operator-linebreak': 'off',
+
+      'node/prefer-global/process': 'off',
+      'prefer-promise-reject-errors': 'off',
+      'no-async-promise-executor': 'warn',
+      'jsdoc/require-returns-description': 'off',
+      'prefer-template': 'off',
+      'prefer-arrow-callback': 'off',
+      'func-style': 'off',
+      'regexp/no-unused-capturing-group': 'warn',
+      'regexp/no-contradiction-with-assertion': 'off',
+      'regexp/prefer-d': 'off',
+      'regexp/use-ignore-case': 'off',
+      'antfu/top-level-function': 'off',
+      'antfu/if-newline': 'off',
+    },
+
+    ignores: [
+      '**/node_modules/',
+      '**/dist/',
+      '**/unpackage/',
+      '**/.history/',
+      '**/coverage/',
+      '**/.git/',
+      '**/.vscode/',
+      '**/package-lock.json',
+      '**/pnpm-lock.yaml',
+      '**/yarn.lock',
+    ],
+  },
+)

package.json

+{
+    "name": "common-web",
+    "type": "module",
+    "version": "1.0.0",
+    "private": true,
+    "packageManager": "pnpm@9.12.3",
+    "scripts": {
+        "dev:project": "tsx scripts/dev.ts",
+        "build:project": "tsx scripts/build.ts",
+        "lint": "eslint .",
+        "lint:fix": "eslint . --fix",
+        "prepare": "husky"
+    },
+    "devDependencies": {
+        "@antfu/eslint-config": "^3.9.2",
+        "@commitlint/cli": "^19.5.0",
+        "@commitlint/config-conventional": "^19.5.0",
+        "eslint-plugin-format": "^0.1.2",
+        "husky": "^9.1.6",
+        "lint-staged": "^15.2.10",
+        "tsx": "^4.19.2",
+        "typescript": "^5.6.3"
+    }
+}

packages/official-site-web/app.vue

+<template>
+    <div>
+        <NuxtPage />
+    </div>
+</template>

packages/official-site-web/nuxt.config.ts

+export default defineNuxtConfig({
+  compatibilityDate: '2024-11-01',
+  devtools: { enabled: true },
+
+  modules: [
+    '@unocss/nuxt',
+    '@pinia/nuxt',
+  ],
+
+  css: [
+    'ant-design-vue/dist/reset.css',
+  ],
+})

packages/official-site-web/package.json

+{
+    "name": "official-site-web",
+    "type": "module",
+    "version": "1.0.0",
+    "private": true,
+    "scripts": {
+        "dev": "nuxt dev",
+        "build": "nuxt build",
+        "generate": "nuxt generate",
+        "preview": "nuxt preview",
+        "postinstall": "nuxt prepare",
+        "lint": "eslint .",
+        "lint:fix": "eslint . --fix"
+    },
+    "dependencies": {
+        "@common/utils": "workspace:*",
+        "@common/vue-kit": "workspace:*",
+        "ant-design-vue": "^4.2.6",
+        "nuxt": "^3.14.1",
+        "pinia": "^2.2.6",
+        "vue": "^3.5.13"
+    },
+    "devDependencies": {
+        "@pinia/nuxt": "^0.7.0",
+        "@unocss/nuxt": "^0.64.1",
+        "typescript": "^5.6.3",
+        "unocss": "^0.64.1"
+    }
+}

packages/official-site-web/pages/index.vue

+<template>
+    <div class="p-4">
+        <h1 class="text-2xl font-bold">Official Site</h1>
+    </div>
+</template>

packages/official-site-web/stores/app.ts

+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+
+export const useAppStore = defineStore('app', () => {
+  const loading = ref(false)
+
+  function setLoading(value: boolean) {
+    loading.value = value
+  }
+
+  return { loading, setLoading }
+})

packages/official-site-web/tsconfig.json

+{
+    "extends": ["./.nuxt/tsconfig.json"]
+}

pnpm-workspace.yaml

+packages:
+  - 'common/*'
+  - 'packages/*'

scripts/build.ts

+import { execSync } from 'node:child_process'
+import { resolve } from 'node:path'
+
+const args = process.argv.slice(2)
+const project = args.find(a => a.startsWith('--project'))?.split('=')[1]
+
+if (!project) {
+  console.error('Usage: pnpm build:project --project=<name>')
+  process.exit(1)
+}
+
+const projectDir = resolve('packages', project)
+console.log(`Building ${project}...`)
+
+execSync(`cd ${projectDir} && pnpm build`, { stdio: 'inherit' })

scripts/dev.ts

+import { execSync } from 'node:child_process'
+import { resolve } from 'node:path'
+
+const args = process.argv.slice(2)
+const project = args.find(a => a.startsWith('--project'))?.split('=')[1]
+
+if (!project) {
+  console.error('Usage: pnpm dev:project --project=<name>')
+  process.exit(1)
+}
+
+const projectDir = resolve('packages', project)
+console.log(`Starting dev server for ${project}...`)
+
+execSync(`cd ${projectDir} && pnpm dev`, { stdio: 'inherit' })