# random-lottery

**Repository Path**: ALuckyBoy/random-lottery

## Basic Information

- **Project Name**: random-lottery
- **Description**: 随机抽奖/点名系统：支持上传txt文件，支持全屏显示
技术栈：vue3+TypeScript
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-05-15
- **Last Updated**: 2025-05-15

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 如何使用此模板

### 项目描述
```
随机抽奖系统，支持上传txt文件
技术栈：vue3+TypeScript
```

### 步骤

- **Install：**

```text
pnpm install
```

- **Run：**

```text
pnpm run dev
```

- **Build：**

```text
# 测试环境
pnpm run build:test

# 生产环境
pnpm run build:production
```

- **Lint：**

```text
# eslint 修复代码
pnpm lint:fix
```

- **ESLint配置: 安装ESLint扩展**

  修改.vscode/settings.json

```
{
  // Enable the ESlint flat config support
  "eslint.experimental.useFlatConfig": true,

  // Disable the default formatter, use eslint instead
  "prettier.enable": false,
  "editor.formatOnSave": false,

  // Auto fix
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit",
    "source.organizeImports": "never"
  },

  // Silent the stylistic rules in you IDE, but still auto fix them
  "eslint.rules.customizations": [
    { "rule": "style/*", "severity": "off" },
    { "rule": "format/*", "severity": "off" },
    { "rule": "*-indent", "severity": "off" },
    { "rule": "*-spacing", "severity": "off" },
    { "rule": "*-spaces", "severity": "off" },
    { "rule": "*-order", "severity": "off" },
    { "rule": "*-dangle", "severity": "off" },
    { "rule": "*-newline", "severity": "off" },
    { "rule": "*quotes", "severity": "off" },
    { "rule": "*semi", "severity": "off" }
  ],

  // Enable eslint for all supported languages
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact",
    "vue",
    "html",
    "markdown",
    "json",
    "jsonc",
    "yaml",
    "toml"
  ]
}
```

Webstorm

```
设置->Eslint 打开自动配置 并且保存时候自动格式化
```

### 项目文件、组件命名规范

采用 Vue 官方推荐的风格指南，请务必查看
Link（v3）：https://cn.vuejs.org/style-guide

### 文件资源目录

```text
ViteAdmin

├─ build                  # vite 配置项
├──── plugins             # vite 插件配置
├──── resetEnv            # 环境信息重置，会根据打包环境把对应信息写入到public/env.js
├─ public                 # 静态资源文件
├──── env                 # 环境信息，包括接口路径baseUrl，修改后可实时生效
├─ src
│  ├─ assets              # 静态资源文件，包括iconfont和images
│  ├─ components          # 全局组件，目前包括ErrorPage、Header、Upload等
│  ├─ config              # 全局配置项，包括loading配置、权限映射配置等
│  ├─ directives          # 全局指令文件
│  ├─ hooks               # 常用 Hooks 封装
│  ├─ routers             # 路由管理
│  ├─ stores              # pinia store
│  ├─ styles              # 全局样式文件
│  ├─ types               # 全局 ts 声明
│  ├─ utils               # 常用工具库
│  ├─ views               # 项目所有页面
│  ├─ App.vue             # 项目主组件
│  ├─ main.ts             # 项目入口文件
│  └─ env.d.ts       # 指定 ts 识别 vue
├─ .env                   # vite 常用配置
├─ .env.development       # 开发环境配置
├─ .env.production        # 生产环境配置
├─ .env.test              # 测试环境配置
├─ .eslintignore          # 忽略 Eslint 校验
├─ .eslintrc.cjs          # Eslint 校验配置文件
├─ .gitignore             # 忽略 git 提交
├─ .prettierignore        # 忽略 Prettier 格式化
├─ .prettierrc.cjs        # Prettier 格式化配置
├─ index.html             # 入口 html
├─ package-lock.json      # 依赖包包版本锁
├─ package.json           # 依赖包管理
├─ postcss.config.cjs     # postcss 配置
├─ README.md              # README 介绍
├─ tsconfig.json          # typescript 全局配置
└─ vite.config.ts         # vite 全局配置文件
```

### 开发要点

- 项目引入了autoImport插件，vue、pinia等变量可不应用，[`配置可参考`](./build/plugins.ts)
- 环境配置env中的`clientId`需要配置，这是用户中心识别项目类型的标识，env中`VITE_STORE_NAME`也需要配置，关乎store存储的名称
- 路由权限校验可参考[`路由拦截`](./src/routers/index.ts)、[`v-auth`](./src/directives/auth.ts)、[`权限code映射`](./src/config/permissionMap.ts)

### 环境变量使用

统一使用config.js内的变量，在env文件中配置