# 根据package.json写README

## 提示词

步骤：

- 关键技术
- 项目描述
- 使用说明
- 贡献指南
- 开源协议
- 回馈方式



提示词：

````
组件库项目的package.json如下，请提炼其中关键的技术：

```
{
  "name": "pk-front-vue3",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev": "vite",
    "build": "run-p type-check build-only",
    "preview": "vite preview",
    "test:unit": "vitest",
    "test:e2e": "start-server-and-test preview http://localhost:4173 'cypress run --e2e'",
    "test:e2e:dev": "start-server-and-test 'vite dev --port 4173' http://localhost:4173 'cypress open --e2e'",
    "build-only": "vite build",
    "type-check": "vue-tsc --noEmit -p tsconfig.vitest.json --composite false",
    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
    "format": "prettier --write src/"
  },
  "dependencies": {
    "@unocss/reset": "^0.55.7",
    "@vueuse/core": "^10.4.1",
    "element-plus": "^2.3.12",
    "pinia": "^2.1.6",
    "vue": "^3.3.2",
    "vue-router": "^4.2.0"
  },
  "devDependencies": {
    "@iconify/json": "^2.2.113",
    "@iconify/vue": "^4.1.1",
    "@rushstack/eslint-patch": "^1.3.3",
    "@tsconfig/node18": "^18.2.1",
    "@types/jsdom": "^21.1.2",
    "@types/node": "^20.6.0",
    "@unocss/preset-wind": "^0.55.7",
    "@vitejs/plugin-vue": "^4.3.4",
    "@vitejs/plugin-vue-jsx": "^3.0.2",
    "@vue/eslint-config-prettier": "^8.0.0",
    "@vue/eslint-config-typescript": "^11.0.3",
    "@vue/test-utils": "^2.4.1",
    "@vue/tsconfig": "^0.4.0",
    "eslint": "^8.49.0",
    "eslint-plugin-cypress": "^2.14.0",
    "eslint-plugin-vue": "^9.17.0",
    "husky": "^8.0.3",
    "jsdom": "^22.0.0",
    "mockjs": "^1.1.0",
    "npm-run-all": "^4.1.5",
    "prettier": "^3.0.3",
    "sass": "^1.66.1",
    "start-server-and-test": "^2.0.0",
    "typescript": "~5.1.6",
    "unocss": "^0.55.7",
    "unplugin-auto-import": "^0.16.5",
    "unplugin-vue-components": "^0.25.2",
    "unplugin-vue-router": "^0.6.4",
    "vite": "^4.4.9",
    "vite-plugin-mock": "^3.0.0",
    "vite-plugin-pwa": "^0.16.5",
    "vite-plugin-svg-icons": "^2.0.1",
    "vite-plugin-vue-layouts": "^0.8.0",
    "vitest": "^0.34.4",
    "vue-tsc": "^1.8.10",
    "workbox-window": "^7.0.0"
  }
}
```
按照类似于如下结构输出：
```
⚡️ Vue 3, Vite, pnpm, esbuild - 就是快！

🗂 基于文件的路由

📦 组件自动化加载

🍍 使用 Pinia 的状态管理

📑 布局系统

```
````



提示词：

```
写一个开源管理后台组件库项目的README，需要包含以下基础的部分：特性，预配置（UI框架，Icons，插件，编码风格，开发工具），安装与使用，贡献指南，开源协议，等必要的部分。
```



形成的文档：

```
### 特性
⚡️ Vue 3, Vite, TypeScript - 高效、现代化的前端开发环境  
🗂 File based routing - 基于文件的路由系统（使用`vue-router`）  
📦 Components auto importing - 组件自动导入（使用`unplugin-vue-components`）  
🍍 State Management via Pinia - 使用Pinia进行状态管理  
📑 Layout system - 灵活的布局系统（使用`vite-plugin-vue-layouts`）  
📲 PWA - 渐进式Web应用（使用`vite-plugin-pwa`和`workbox-window`）  
🎨 UnoCSS - 即时按需生成的原子CSS引擎（使用`@unocss/reset`和`unocss`）  
😃 Use icons from any icon sets with classes - 使用任何图标集（使用`@iconify/json`和`@iconify/vue`）  
🌍 I18n ready - 支持国际化（未在`package.json`中明确）  
🔎 Component Preview - 组件预览功能（未在`package.json`中明确）  
🗒 Markdown Support - 支持Markdown格式（未在`package.json`中明确）  
🔥 Use the new `<script setup>` syntax - 支持新的`<script setup>`语法  
📥 APIs auto importing - 自动导入Composition API等（使用`unplugin-auto-import`）  
🖨 Static-site generation (SSG) - 使用vite-ssg进行静态站点生成（未在`package.json`中明确）  
🦔 Critical CSS via critters - 通过critters处理关键CSS（未在`package.json`中明确）  
🔤 Webfont self-hosting - 支持自托管Web字体（未在`package.json`中明确）  
⚙️ Unit Testing with Vitest, E2E Testing with Cypress - 单元测试和端到端测试（使用`vitest`和`cypress`）  
☁️ Deploy on Netlify, zero-config - 零配置在Netlify上部署（未在`package.json`中明确）

### 预配置
#### UI框架
- Element Plus - 基于 Vue 3 的UI组件库

#### Icons
- Iconify - 使用任何图标集

#### 插件
- Vue Router - 路由管理
- vite-plugin-pages - 基于文件系统的路由
- vite-plugin-vue-layouts - 页面布局
- Pinia - 状态管理
- unplugin-vue-components - 组件自动导入
- unplugin-auto-import - API自动导入
- vite-plugin-pwa - PWA支持

#### 编码风格
- ESLint with Prettier - 代码检查和格式化

#### 开发工具
- TypeScript - 类型检查
- Vitest - 单元测试
- Cypress - 端到端测试
- npm-run-all - 并行运行多个npm脚本
- start-server-and-test - 启动测试环境

这些技术和特性组合在一起，为前端开发提供了一个全面、高效和现代化的环境。希望这种格式更符合你的需求。
```



提示词：

````
写一个开源管理后台组件库项目的README，需要包含以下基础的部分：安装与使用，贡献指南，开源协议，等必要的部分。

项目的功能特点如下：
```
模块包含：
1.首页：
- 概览
- 看板

2.系统管理：
- 用户管理
- 角色管理
- 菜单管理
- 部门管理
- 字典管理
- 系统日志

3.风格定制：
- 主题配色
- 布局
- 暗黑模式
- 全屏
- 切换动画

4.模板页面：
- 表单页
- 详情页
- 列表页
- 结果页
- 个人中心
- 异常页

5.基础组件：
- 图标
- 表单
- 表格
- 选择器
- 菜单
- 动态展示
- 通知分享
- Excel处理
- 编辑器
- 展示

6.扩展功能：
- 日历卡片
- 天气
- 倒计时
- 过渡动画
- 图片裁剪
- 文件下载
- 打印
- 国际化
- 水印
- 验证组件
- 复制图片
- 音频播放
- 视频播放

7.图表
- Echarts集成
- 地图应用
- AntV G2
- D3.js

8.打包构建
- Vite
- 简化配置
- git版本控制
- 组件单元测试
- 性能优化
- 桌面跨端方案
- 构建脚本
- tsup
- unbuild
- 工作流
- 集成测试
- Electron

9.部署与发布
```
````





## 准备文档项目

SSG相关：https://jamstack.org/generators/