17 | 我的前端学习网站 - ChoDocs 18 |
19 |20 | 一站式前端内容网站,完善前端的学习路线、知识体系 项目已经在 GitHub 21 | 上开源,欢迎加入我们一起学习,分享前端知识 😸 ~ 22 |
23 |├── .eslintrc.cjs
├── .github
└── PULL_REQUEST_TEMPLATE.md
├── .gitignore
├── .husky
├── commit-msg
└── pre-commit
├── .npmrc
├── .prettierrc.json
├── .vscode
└── extensions.json
├── README-EN.md
├── README.md
├── commitlint.config.js
├── env.d.ts
├── index.html
├── package-lock.json
├── package.json
├── public
└── favicon.ico
├── renovate.json
├── src
├── App.vue
├── api
│ └── index.ts
├── assets
│ ├── add.svg
│ ├── main.css
│ ├── user.svg
│ ├── 管理者(2).svg
│ └── 管理者.svg
├── components
│ ├── AccountArticle.vue
│ ├── AccountDetail.vue
│ ├── Article.vue
│ ├── Card.vue
│ ├── MessageDropdown.vue
│ ├── SideBar.vue
│ ├── Statistic.vue
│ ├── Table.vue
│ ├── TableDetail.vue
│ ├── Tabs.vue
│ └── TodoList.vue
├── main.ts
├── router
│ └── index.ts
├── stores
│ ├── counter.ts
│ ├── tabs.ts
│ └── todos.ts
└── views
│ ├── AccountCenter.vue
│ ├── Articles.vue
│ ├── BasicForm.vue
│ ├── ComplexTable.vue
│ ├── Dashboard.vue
│ ├── Home.vue
│ ├── Login.vue
│ ├── NotFound.vue
│ ├── StepForm.vue
│ ├── Table.vue
│ └── User.vue
├── tsconfig.config.json
├── tsconfig.json
├── vercel.json
└── vite.config.ts
/.eslintrc.cjs:
--------------------------------------------------------------------------------
1 | /* eslint-env node */
2 | require('@rushstack/eslint-patch/modern-module-resolution');
3 |
4 | module.exports = {
5 | root: true,
6 | extends: [
7 | 'plugin:vue/vue3-essential',
8 | 'eslint:recommended',
9 | '@vue/eslint-config-typescript',
10 | '@vue/eslint-config-prettier',
11 | ],
12 | parserOptions: {
13 | ecmaVersion: 'latest',
14 | },
15 | rules: {
16 | 'vue/multi-word-component-names': 0,
17 | },
18 | };
19 |
--------------------------------------------------------------------------------
/.github/PULL_REQUEST_TEMPLATE.md:
--------------------------------------------------------------------------------
1 |
2 |
3 | ### 描述
4 |
5 |
6 |
7 | ---
8 |
9 | ### 选择 PR 分类
10 |
11 | - [ ] Bug 修复
12 | - [ ] 新功能
13 | - [ ] 代码优化
14 | - [ ] 其它
15 |
16 | ### 还需确认一下
17 |
18 | - [ ] 代码提交没有冲突并且已经通过格式化校验规则
19 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # Logs
2 | logs
3 | *.log
4 | npm-debug.log*
5 | yarn-debug.log*
6 | yarn-error.log*
7 | pnpm-debug.log*
8 | lerna-debug.log*
9 |
10 | node_modules
11 | .DS_Store
12 | dist
13 | dist-ssr
14 | coverage
15 | *.local
16 |
17 | /cypress/videos/
18 | /cypress/screenshots/
19 |
20 | # Editor directories and files
21 | .vscode/*
22 | !.vscode/extensions.json
23 | .idea
24 | *.suo
25 | *.ntvs*
26 | *.njsproj
27 | *.sln
28 | *.sw?
29 |
--------------------------------------------------------------------------------
/.husky/commit-msg:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env sh
2 | . "$(dirname -- "$0")/_/husky.sh"
3 |
4 | npx --no -- commitlint --edit
5 |
--------------------------------------------------------------------------------
/.husky/pre-commit:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env sh
2 | . "$(dirname -- "$0")/_/husky.sh"
3 |
4 | npx lint-staged
5 |
--------------------------------------------------------------------------------
/.npmrc:
--------------------------------------------------------------------------------
1 | registry=https://registry.npmmirror.com
2 |
--------------------------------------------------------------------------------
/.prettierrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "singleQuote": true
3 | }
--------------------------------------------------------------------------------
/.vscode/extensions.json:
--------------------------------------------------------------------------------
1 | {
2 | "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
3 | }
4 |
--------------------------------------------------------------------------------
/README-EN.md:
--------------------------------------------------------------------------------
1 | # vue3-management-system
2 |
3 | Language: English | [中文简体](README.md)
4 |
5 | Based on the background management system developed by Vue3 Family Bucket, [online address is here](https://vue3-management-system.vercel.app/login). It is suitable for students who are self-studying Vue3, and for quick delivery of outsourced projects.
6 |
7 | ## technology stack
8 |
9 | The project uses the technology stack as follows:
10 |
11 | - [x] Vue 3: Front-end framework
12 | - [x] TypeScript: Language
13 | - [x] Vite: packaging tool
14 | - [x] Pinia: state management
15 | - [x] Vue Router: route management
16 | - [x] Element Plus: UI component library
17 | - [x] Echarts: Charts
18 | - [x] Axios: network requests
19 |
20 | ## project screenshot
21 |
22 | Login page:
23 | 
24 |
25 | home page:
26 | 
27 |
28 | table page:
29 | 
30 |
31 | ## Project Setup
32 |
33 | ```
34 | # clone project
35 | git clone https://github.com/HearLing/vue3-management-system.git
36 |
37 | # enter the project directory
38 | cd vue3-management-system
39 |
40 | # install dependencies
41 | npm install
42 |
43 | # Local development, start the service
44 | npm run dev
45 |
46 | # package build
47 | npm run build
48 |
49 | # ESLint fixes
50 | npm run lint
51 | ```
52 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # vue3-management-system
2 |
3 | 文档语言: [English](README-EN.md) | 中文简体
4 |
5 | 基于 Vue3 全家桶开发的后台管理系统,[线上地址在这](https://vue3-management-system.vercel.app/login)。适用于自学 Vue3 的同学,以及外包项目快速交付。
6 |
7 | ## 技术栈
8 |
9 | 该项目使用技术栈如下:
10 |
11 | - [x] Vue 3:前端框架
12 | - [x] TypeScript:语言
13 | - [x] Vite:打包工具
14 | - [x] Pinia:状态管理
15 | - [x] Vue Router:路由管理
16 | - [x] Element Plus:UI 组件库
17 | - [x] Echarts:图表
18 | - [x] Axios:网络请求
19 |
20 | ## 项目截图
21 |
22 | 登录页:
23 | 
24 |
25 | 首页:
26 | 
27 |
28 | 表格:
29 | 
30 |
31 | ## 安装
32 |
33 | ```
34 | # 克隆项目
35 | git clone https://github.com/HearLing/vue3-management-system.git
36 |
37 | # 进入项目目录
38 | cd vue3-management-system
39 |
40 | # 安装依赖
41 | npm install
42 |
43 | # 本地开发,启动服务
44 | npm run dev
45 |
46 | # 打包构建
47 | npm run build
48 |
49 | # ESLint修复
50 | npm run lint
51 | ```
52 |
53 | ## 参考资料
54 |
55 | - [x] [参考项目](https://preview.pro.ant.design/dashboard/analysis)
56 | - [x] [Vue3 中文文档](https://cn.vuejs.org)
57 | - [x] [Vue Router 中文文档](https://router.vuejs.org/zh/)
58 | - [x] [Pinia 中文文档](https://pinia.vuejs.org/zh/)
59 | - [x] [Element Plus 中文文档](https://element-plus.gitee.io/zh-CN/guide/quickstart.html)
60 |
--------------------------------------------------------------------------------
/commitlint.config.js:
--------------------------------------------------------------------------------
1 | /* eslint-env node */
2 | module.exports = {
3 | extends: ['@commitlint/config-conventional'],
4 | };
5 |
--------------------------------------------------------------------------------
/env.d.ts:
--------------------------------------------------------------------------------
1 | ///
11 |
12 |
20 | 一站式前端内容网站,完善前端的学习路线、知识体系 项目已经在 GitHub 21 | 上开源,欢迎加入我们一起学习,分享前端知识 😸 ~ 22 |
23 |已经有账号了?
114 |还没有账号?
122 |