Skip to content

Commit b52207e

Browse files
jipengfei01SeanHai
jipengfei01
authored and
SeanHai
committed
feat: init project
0 parents  commit b52207e

File tree

141 files changed

+33013
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

141 files changed

+33013
-0
lines changed

‎.commitlintrc.js

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
module.exports = {
2+
extends: ['@commitlint/config-conventional'],
3+
}
4+
// { value: 'feat', name: 'feat: 新增功能' },
5+
// { value: 'fix', name: 'fix: 修复缺陷' },
6+
// { value: 'docs', name: 'docs: 文档变更' },
7+
// { value: 'style', name: 'style: 代码格式' },
8+
// { value: 'refactor', name: 'refactor: 代码重构' },
9+
// { value: 'perf', name: 'perf: 性能优化' },
10+
// { value: 'test', name: 'test: 添加疏漏测试或已有测试改动' },
11+
// { value: 'build', name: 'build: 构建流程、外部依赖变更 (如升级 npm 包、修改打包配置等)' },
12+
// { value: 'ci', name: 'ci: 修改 CI 配置、脚本' },
13+
// { value: 'revert', name: 'revert: 回滚 commit' },
14+
// { value: 'chore', name: 'chore: 对构建过程或辅助工具和库的更改 (不影响源文件、测试用例)' },

‎.env

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
# 一些通用的环境配置，通过import.meta.env使用 https://cn.vitejs.dev/guide/env-and-mode.html
2+
VITE_API_URL = "" # 接口地址 eg: https://127.0.0.1:443
3+
VITE_HOST = "0.0.0.0"
4+
VITE_PORT = 8010

‎.eslintignore

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
node_modules/*
2+
public
3+
dist

‎.eslintrc.cjs

+85
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
/* eslint-env node */
2+
require('@rushstack/eslint-patch/modern-module-resolution') // 这个库是用来解决monoRep可能出现的问题的，后期可以考虑把项目转成monoRep
3+
4+
// https://cn.eslint.org/docs/rules/
5+
/*
6+
* "off"或者0，不启用这个规则
7+
* "warn"或者1，出现问题会有警告
8+
* "error"或者2，出现问题会报错
9+
* ---------------------------
10+
* extends 直接应用别人的规范,包括其parser,overrides,rules等等
11+
* plugin 引入别人新增的规则，具体是否开启要在rules中自己配置。
12+
*/
13+
14+
module.exports = {
15+
root: true,
16+
env: {
17+
browser: true,
18+
node: true,
19+
es6: true,
20+
},
21+
extends: [
22+
'eslint:recommended',
23+
'plugin:vue/vue3-essential',
24+
'plugin:vue/recommended',
25+
'plugin:@typescript-eslint/eslint-recommended', // 使用推荐的规则，来自@typescript-eslint/eslint-plugin
26+
'plugin:prettier/recommended', // prettier配置 关闭 ESLint 中与 Prettier 中会发生冲突的规则
27+
],
28+
globals: {
29+
// script setup
30+
defineProps: 'readonly',
31+
defineEmits: 'readonly',
32+
defineExpose: 'readonly',
33+
defineOptions: 'readonly',
34+
withDefaults: 'readonly',
35+
NodeJS: 'readonly',
36+
},
37+
plugins: [
38+
'@typescript-eslint',
39+
'simple-import-sort', // import和export排序
40+
'prettier', // 将 Prettier 的规则设置到 ESLint 的规则中
41+
],
42+
parserOptions: {
43+
parser: {
44+
js: 'espree',
45+
jsx: 'espree',
46+
ts: '@typescript-eslint/parser',
47+
tsx: '@typescript-eslint/parser',
48+
// Leave the template parser unspecified, so that it could be determined by `<script lang="...">`
49+
},
50+
extraFileExtensions: ['.vue'], // .vue文件将被这个parser解析
51+
ecmaVersion: 'latest', // es使用最新版本语法解析
52+
sourceType: 'module', // esm,允许import和export
53+
ecmaFeatures: {
54+
jsx: true,
55+
tsx: true,
56+
},
57+
},
58+
parser: 'vue-eslint-parser',
59+
overrides: [
60+
{
61+
files: ['*.ts', '*.tsx', '*.vue'],
62+
rules: {
63+
// The core 'no-unused-vars' rules (in the eslint:recommeded ruleset)
64+
// does not work with type definitions
65+
'no-unused-vars': 'off',
66+
'@typescript-eslint/no-unused-vars': 'warn',
67+
},
68+
},
69+
],
70+
71+
rules: {
72+
'simple-import-sort/imports': 'error', // import sort排序
73+
'simple-import-sort/exports': 'error', // export sort排序
74+
'vue/multi-word-component-names': 0, // 组件名多单词
75+
'vue/no-multiple-template-root': 'off', // v3支持多个根组件了，这个规则主要是针对v2的
76+
'vue/no-v-model-argument': 'off', // 禁止使用v-model的参数 eg: v-model:argName = 'argValue'
77+
'vue/no-dupe-keys': 'off',
78+
'@typescript-eslint/consistent-type-imports': 'off',
79+
// 'import-type': 'error',
80+
// 'vue/custom-event-name-casing': 'off',
81+
// 'vue/require-default-prop': 'off',
82+
// 'vue/require-prop-types': 'off',
83+
// 'vue/define-component': 'off',
84+
},
85+
}

‎.gitignore

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
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?

‎.husky/commit-msg

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
#!/usr/bin/env sh
2+
. "$(dirname -- "$0")/_/husky.sh"
3+
4+
npx --no-install commitlint -e

‎.husky/pre-commit

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
#!/usr/bin/env sh
2+
. "$(dirname -- "$0")/_/husky.sh"
3+
4+
npm run lint:lint-staged

‎.lintstagedrc.json

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"*.{js,jsx,ts,tsx}": ["eslint --fix", "prettier --write"],
3+
"!(package)*.json": ["prettier --write--parser json"],
4+
"package.json": ["prettier --write"],
5+
"*.vue": ["eslint --fix", "stylelint --fix", "prettier --write"],
6+
"*.{vue,css,scss,postcss,less}": ["stylelint --fix", "prettier --write"],
7+
"*.md": ["prettier --write"]
8+
}

‎.prettierignore

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
dist
2+
node_modules
3+
public
4+
5+
**/*.svg
6+
**/*.sh
7+

‎.prettierrc.js

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
module.exports = {
2+
arrowParens: 'avoid', // 箭头函数参数括号
3+
printWidth: 80, //单行长度
4+
tabWidth: 2, //缩进长度
5+
useTabs: false, //使用空格代替tab缩进
6+
semi: false, //句末使用分号
7+
singleQuote: true, //使用单引号
8+
quoteProps: 'as-needed', //仅在必需时为对象的key添加引号
9+
jsxSingleQuote: true, // jsx中使用单引号
10+
trailingComma: 'all', //多行时尽可能打印尾随逗号
11+
bracketSpacing: true, //在对象前后添加空格-eg: { foo: bar }
12+
jsxBracketSameLine: true, //多属性html标签的‘>’折行放置
13+
proseWrap: 'preserve', // 使用默认的折行标准,主要是针对markdown
14+
htmlWhitespaceSensitivity: 'css', //对HTML全局空白不敏感
15+
endOfLine: 'lf', //结束行形式
16+
}

‎.stylelintignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
dist
2+
public

‎.stylelintrc.cjs

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
module.exports = {
2+
extends: [
3+
'stylelint-config-standard', // stylelint推荐配置
4+
'stylelint-config-recommended-vue',
5+
'stylelint-config-recess-order', // 属性排序
6+
],
7+
ignoreFiles: ['**/*.js', '**/*.jsx', '**/*.tsx', '**/*.ts', '**/*.json'],
8+
rules: {
9+
'color-function-notation': null, // 使用颜色函数，个人认为没有必要，而且会让组件无法识别颜色
10+
'alpha-value-notation': null, // 指定字母值的百分比或数字表示法，例如rgba的a可以指定位百分比或者数字。
11+
'selector-class-pattern': null, // 类定义限制,例如数帆的项目可以要求所有class名都以sf开头。
12+
'custom-property-pattern': null, // 指定自定义属性的模式，例如数帆的项目要求所有自定义属性以sf开头
13+
'function-url-quotes': null, // url是否必须要引号
14+
'no-descending-specificity': [true, { ignore: ['selectors-within-list'] }],
15+
'unit-no-unknown': [true, { ignoreUnits: ['pv'] }], // 支持自定义的单位
16+
'font-family-no-missing-generic-family-keyword': [
17+
true,
18+
{ ignoreFontFamilies: ['DIN', 'PingFang SC', 'Roboto'] }, // 支持导入的字体
19+
],
20+
'value-no-vendor-prefix': [true, { ignoreValues: ['box'] }],
21+
},
22+
}

‎.vscode/extensions.json

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
3+
}

‎README.md

+115
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
# curve-front-console
2+
3+
本项目是 curve 控制台的前端项目
4+
5+
- 项目依赖
6+
- 如何安装和启动项目
7+
- 项目文件相关介绍
8+
- 如何开发本项目
9+
- 如何调试本项目
10+
11+
## 项目依赖和 vscode 插件
12+
13+
> 推荐安装的插件属于锦上添花，不安装也无妨
14+
15+
- 项目依赖 node 17 及以上版本
16+
- 代码 formatter 工具 prettier: `esbenp.prettier-vscode`
17+
- 代码 lint 工具 ESLint: `dbaeumer.vscode-eslint`
18+
- postcss 语法高亮插件 `cpylua.language-postcss`和`vunguyentuan.vscode-postcss`
19+
- vue3 官方插件 volar `Vue.volar`和`Vue.vscode-typescript-vue-plugin`
20+
- 推荐安装 vue3 代码提示工具 `hollowtree.vue-snippets`
21+
- 推荐安装 ts 报错合理提示插件 `mattpocock.ts-error-translator`
22+
- 推荐安装 单词拼写检测插件 `streetsidesoftware.code-spell-checker`
23+
- 推荐安装 色值显示插件 `naumovs.color-highlight`
24+
- 推荐安装 彩虹缩进插件 `oderwat.indent-rainbow`
25+
- 推荐安装 图片侧边预览插件 `kisstkondoros.vscode-gutter-preview`
26+
- 推荐安装 文件图标主题库 `PKief.material-icon-theme`
27+
- 推荐安装 TODO 高亮插件 `wayou.vscode-todo-highlight`
28+
29+
安装完插件以后打开 vscode 配置文件，添加如下配置：
30+
31+
```json
32+
"editor.codeActionsOnSave": {// 保存时触发eslint fix
33+
"source.fixAll.eslint": true
34+
},
35+
36+
"emmet.includeLanguages": {
37+
// 使用postcss来解析css,要安装postcss language support插件,启用 Emmet 缩写扩展
38+
"postcss": "css",
39+
},
40+
41+
// prettier配置
42+
"prettier.useEditorConfig": false, // 不被editorconfig影响
43+
44+
// 关于format的配置
45+
"editor.defaultFormatter": "esbenp.prettier-vscode",
46+
"[typescriptreact]": {
47+
"editor.defaultFormatter": "esbenp.prettier-vscode"
48+
},
49+
"[javascript]": {
50+
"editor.defaultFormatter": "esbenp.prettier-vscode"
51+
},
52+
"[jsonc]": {
53+
"editor.defaultFormatter": "esbenp.prettier-vscode"
54+
}
55+
```
56+
57+
## 项目安装和启动
58+
59+
- 执行 `npm install` 安装依赖
60+
- 执行 `npm run dev` 启动本地服务，端口号可以在`vite.config.ts`文件的 server 字段下添加 port 字段修改
61+
62+
## 项目文件相关介绍
63+
64+
- .vscode 文件夹：vscode 部分插件配置
65+
- dist 文件夹： `build`命令打包出口文件夹
66+
- node_modules 文件夹： 三方依赖模块集合
67+
- public 文件夹： 公共文件，待补充
68+
- src 文件夹： 主要项目代码集合
69+
- api 文件夹
70+
- 具体 api 文件：通过`@/utils/_fetch`文件做数据请求，命名基本和路由保持一致
71+
- assets 文件夹：资源文件夹
72+
- components： 公共组件文件夹，简单组件可以是文件，如果复杂组件可以是文件夹
73+
- directives： 自定义指令文件夹
74+
- hooks： compositionApi 文件夹
75+
- i18n：多语言文件夹，目前支持中文和英文两种
76+
- layout：布局文件夹，应该要加入页面权限相关内容
77+
- router： 路由配置文件夹
78+
- store：pinia 仓库，模块数量和 api 保持一致
79+
- styles：公共样式文件夹，内部有公共样式和 css 变量
80+
- utils：工具文件夹
81+
- views：路由页面文件夹，嵌套结构尽量和路由保持一致
82+
- app.vue 文件：vue 根文件
83+
- main.ts：vite 打包入口文件，也是整个项目的入口文件
84+
- .env：环境配置文件，内部变量通过`import.meta.env`访问。具体参考 https://cn.vitejs.dev/guide/env-and-mode.html#env-files
85+
- .eslintrc.cjs: eslint 配置文件，详细规则通过`rules`配置即可。具体参考 https://eslint.org/
86+
- .gitignore：配置文件路径，以避免某些纯本地文件上传到仓库。值得注意的是如果该文件已经在仓库中了，那 gitignore 中的配置将失效，要先去仓库删除该文件。
87+
- .prettierrc.js：prettier 配置文件，内有详细注释
88+
- env.d.ts：env 字段类型文件
89+
- index.html：打包模板，可修改 title，添加静态资源等
90+
- package.json 和 package-lock.json：npm 包相关文件，控制 npm 包依赖和包版本依赖。
91+
- postcss.config.js：postcss 配置文件。具体参考 https://postcss.org/
92+
- tsconfig.config.json：ts 工程模块所以 ts 配置文件
93+
- tsconfig.json：ts 配置文件
94+
- vite.config.ts：vite 配置文件
95+
96+
## 如何开发本项目
97+
98+
- 新建 store 和 api 文件时请执行`npm run model`指令，按照提示进行创建
99+
- 上述命令也可以创建 view 文件，文件会引入 store。并添加基础示例代码，但是路由配置需要自己添加
100+
- components 文件夹下组件 首字母大写
101+
- hooks 文件以 use 开头
102+
- directives 文件以 v 开头
103+
- store 和 api 有 global 文件，用来完善全局相关数据模型
104+
- 页面鉴权待补充，指令加路由钩子应该就可以了
105+
- 代理相关配置在`vite.config.ts`文件的 proxy 字段中，请求工具会根据当前环境自动拼接`'/api'`
106+
107+
## 开发建议
108+
109+
- store 内返回一个 state 作为当前 store 总的数据源
110+
- 不要在组件内修改非本组件创建的数据，保持数据流清晰
111+
- 代码提交规范参考 https://github.com/conventional-changelog/commitlint
112+
113+
## 备忘
114+
115+
- vue3 中 echarts 实例不要用 ref 保存，直接使用普通变量即可. [Vue3 项目中使用折线图出现 tooltip 不显示 #14342](https://github.com/apache/echarts/issues/14342)

‎auto-imports.d.ts

+60
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
// Generated by 'unplugin-auto-import'
2+
export {}
3+
declare global {
4+
const EffectScope: typeof import('vue')['EffectScope']
5+
const computed: typeof import('vue')['computed']
6+
const createApp: typeof import('vue')['createApp']
7+
const customRef: typeof import('vue')['customRef']
8+
const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
9+
const defineComponent: typeof import('vue')['defineComponent']
10+
const effectScope: typeof import('vue')['effectScope']
11+
const getCurrentInstance: typeof import('vue')['getCurrentInstance']
12+
const getCurrentScope: typeof import('vue')['getCurrentScope']
13+
const h: typeof import('vue')['h']
14+
const inject: typeof import('vue')['inject']
15+
const isProxy: typeof import('vue')['isProxy']
16+
const isReactive: typeof import('vue')['isReactive']
17+
const isReadonly: typeof import('vue')['isReadonly']
18+
const isRef: typeof import('vue')['isRef']
19+
const markRaw: typeof import('vue')['markRaw']
20+
const nextTick: typeof import('vue')['nextTick']
21+
const onActivated: typeof import('vue')['onActivated']
22+
const onBeforeMount: typeof import('vue')['onBeforeMount']
23+
const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
24+
const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
25+
const onDeactivated: typeof import('vue')['onDeactivated']
26+
const onErrorCaptured: typeof import('vue')['onErrorCaptured']
27+
const onMounted: typeof import('vue')['onMounted']
28+
const onRenderTracked: typeof import('vue')['onRenderTracked']
29+
const onRenderTriggered: typeof import('vue')['onRenderTriggered']
30+
const onScopeDispose: typeof import('vue')['onScopeDispose']
31+
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
32+
const onUnmounted: typeof import('vue')['onUnmounted']
33+
const onUpdated: typeof import('vue')['onUpdated']
34+
const provide: typeof import('vue')['provide']
35+
const reactive: typeof import('vue')['reactive']
36+
const readonly: typeof import('vue')['readonly']
37+
const ref: typeof import('vue')['ref']
38+
const resolveComponent: typeof import('vue')['resolveComponent']
39+
const resolveDirective: typeof import('vue')['resolveDirective']
40+
const shallowReactive: typeof import('vue')['shallowReactive']
41+
const shallowReadonly: typeof import('vue')['shallowReadonly']
42+
const shallowRef: typeof import('vue')['shallowRef']
43+
const toRaw: typeof import('vue')['toRaw']
44+
const toRef: typeof import('vue')['toRef']
45+
const toRefs: typeof import('vue')['toRefs']
46+
const triggerRef: typeof import('vue')['triggerRef']
47+
const unref: typeof import('vue')['unref']
48+
const useAttrs: typeof import('vue')['useAttrs']
49+
const useCssModule: typeof import('vue')['useCssModule']
50+
const useCssVars: typeof import('vue')['useCssVars']
51+
const useDialog: typeof import('naive-ui')['useDialog']
52+
const useLoadingBar: typeof import('naive-ui')['useLoadingBar']
53+
const useMessage: typeof import('naive-ui')['useMessage']
54+
const useNotification: typeof import('naive-ui')['useNotification']
55+
const useSlots: typeof import('vue')['useSlots']
56+
const watch: typeof import('vue')['watch']
57+
const watchEffect: typeof import('vue')['watchEffect']
58+
const watchPostEffect: typeof import('vue')['watchPostEffect']
59+
const watchSyncEffect: typeof import('vue')['watchSyncEffect']
60+
}

0 commit comments

Comments
 (0)