@skyfox2000/webui 1.4.6 → 1.4.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/TemplateFile.d.ts +1 -0
- package/lib/assets/modules/{baseLayout-CUZpKmC0.js → baseLayout-DOrecPPK.js} +6 -6
- package/lib/assets/modules/{file-upload-BrTPBL29.js → file-upload-lbkluj3p.js} +1 -1
- package/lib/assets/modules/{index-DP1u2P1k.js → index-B1MSCuqH.js} +2 -2
- package/lib/assets/modules/{index-BqoqvtEv.js → index-BLNKcgk-.js} +1 -1
- package/lib/assets/modules/{index-NDOzpgzV.js → index-DQ-VDAr-.js} +10 -10
- package/lib/assets/modules/{menuTabs-BaZAmaXz.js → menuTabs-DOtYQ9Zu.js} +7 -7
- package/lib/assets/modules/{toolIcon-DHKszGtC.js → toolIcon-CqJWc5B7.js} +1 -1
- package/lib/assets/modules/{uploadList-C5R2XD5x.js → uploadList-3SuA7du0.js} +150 -138
- package/lib/assets/modules/{uploadList-DSN9t4r8.js → uploadList-DafDrGgh.js} +143 -133
- package/lib/components/content/tree/index.vue.d.ts +3 -14
- package/lib/components/form/upload/uploadList.vue.d.ts +3 -0
- package/lib/es/AceEditor/index.js +3 -3
- package/lib/es/BasicLayout/index.js +6 -6
- package/lib/es/Error403/index.js +1 -1
- package/lib/es/Error404/index.js +1 -1
- package/lib/es/ExcelForm/index.js +5 -5
- package/lib/es/MenuLayout/index.js +6 -6
- package/lib/es/TemplateFile/index.js +208 -0
- package/lib/es/UploadForm/index.js +6 -6
- package/lib/utils/tree.d.ts +9 -0
- package/lib/webui.css +1 -1
- package/lib/webui.es.js +396 -378
- package/package.json +8 -2
- package/src/components/content/dialog/templateFile.vue +259 -0
- package/src/components/content/dialog/uploadForm.vue +6 -14
- package/src/components/content/tree/index.vue +26 -25
- package/src/components/form/upload/uploadList.vue +66 -89
- package/src/utils/tree.ts +20 -0
- package/.eslintrc.js +0 -23
- package/.prettierrc +0 -11
- package/.vscode/settings.json +0 -25
- package/env.d.ts +0 -11
- package/index.html +0 -19
- package/plugins/vite-plugin-auto-generate-vue.ts +0 -105
- package/postcss.config.ts +0 -6
- package/tailwind.config.ts +0 -11
- package/tsconfig.json +0 -46
- package/vite.config.ts +0 -120
- package//344/273/243/347/240/201/350/247/204/350/214/203/345/217/212/351/243/216/346/240/274/346/214/207/345/215/227.md +0 -116
package/.eslintrc.js
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
module.exports = {
|
|
2
|
-
root: true,
|
|
3
|
-
env: {
|
|
4
|
-
browser: true,
|
|
5
|
-
es2021: true,
|
|
6
|
-
node: true,
|
|
7
|
-
},
|
|
8
|
-
extends: [
|
|
9
|
-
'eslint:recommended',
|
|
10
|
-
'plugin:vue/vue3-essential',
|
|
11
|
-
'plugin:@typescript-eslint/recommended',
|
|
12
|
-
'plugin:prettier/recommended',
|
|
13
|
-
],
|
|
14
|
-
parserOptions: {
|
|
15
|
-
ecmaVersion: 'latest',
|
|
16
|
-
sourceType: 'module',
|
|
17
|
-
parser: '@typescript-eslint/parser',
|
|
18
|
-
},
|
|
19
|
-
plugins: ['vue', '@typescript-eslint', 'prettier'],
|
|
20
|
-
rules: {
|
|
21
|
-
'prettier/prettier': 'error',
|
|
22
|
-
},
|
|
23
|
-
};
|
package/.prettierrc
DELETED
package/.vscode/settings.json
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
// 控制相关文件嵌套展示
|
|
3
|
-
"explorer.fileNesting.enabled": true,
|
|
4
|
-
"explorer.fileNesting.expand": false,
|
|
5
|
-
"explorer.fileNesting.patterns": {
|
|
6
|
-
"*.ts": "$(capture).test.ts, $(capture).test.tsx",
|
|
7
|
-
"*.tsx": "$(capture).test.ts, $(capture).test.tsx",
|
|
8
|
-
"package.json": "index.html,pnpm-lock.yaml,pnpm-workspace.yaml,LICENSE,.gitignore,.gitattributes,.gitpod.yml,CNAME,README*,.npmrc,.browserslistrc,.env.*,env.d.ts,.prettierrc,.eslintrc.js,*.md,.cursorignore,.npmignore",
|
|
9
|
-
"vite.config.ts": "tsconfig.*.json,postcss.config.ts,tailwind.config.ts,tsconfig.json"
|
|
10
|
-
},
|
|
11
|
-
"editor.formatOnSave": true,
|
|
12
|
-
|
|
13
|
-
"editor.codeActionsOnSave": {
|
|
14
|
-
"source.fixAll.eslint": "always"
|
|
15
|
-
},
|
|
16
|
-
"[typescript]": {
|
|
17
|
-
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
|
18
|
-
},
|
|
19
|
-
"[json]": {
|
|
20
|
-
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
|
21
|
-
},
|
|
22
|
-
"[vue]": {
|
|
23
|
-
"editor.defaultFormatter": "Vue.volar"
|
|
24
|
-
}
|
|
25
|
-
}
|
package/env.d.ts
DELETED
package/index.html
DELETED
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8" />
|
|
5
|
-
<link rel="icon" href="null">
|
|
6
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
7
|
-
<title>后台管理系统</title>
|
|
8
|
-
<style>
|
|
9
|
-
html {
|
|
10
|
-
overflow-y: hidden;
|
|
11
|
-
overflow-x: hidden;
|
|
12
|
-
}
|
|
13
|
-
</style>
|
|
14
|
-
</head>
|
|
15
|
-
<body>
|
|
16
|
-
<div id="app"></div>
|
|
17
|
-
<script type="module" src="/src/main.ts"></script>
|
|
18
|
-
</body>
|
|
19
|
-
</html>
|
|
@@ -1,105 +0,0 @@
|
|
|
1
|
-
import { Plugin } from 'vite';
|
|
2
|
-
import fs from 'fs';
|
|
3
|
-
import path from 'path';
|
|
4
|
-
|
|
5
|
-
/**
|
|
6
|
-
* 首字母大写的工具函数
|
|
7
|
-
*/
|
|
8
|
-
function capitalize(str: string): string {
|
|
9
|
-
return str.charAt(0).toUpperCase() + str.slice(1);
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
/**
|
|
13
|
-
* 规范化路径,确保使用正斜杠
|
|
14
|
-
*/
|
|
15
|
-
function normalizePath(filePath: string): string {
|
|
16
|
-
return filePath.split(path.sep).join('/');
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* 递归扫描目录中的 .vue 文件并生成导出语句
|
|
21
|
-
*/
|
|
22
|
-
function scanDir(dir: string, baseDir: string, skipDirFile: string[]): string[] {
|
|
23
|
-
const result: string[] = [];
|
|
24
|
-
const files = fs.readdirSync(dir);
|
|
25
|
-
files.forEach((file) => {
|
|
26
|
-
const filePath = path.join(dir, file);
|
|
27
|
-
if (skipDirFile.includes(filePath)) return;
|
|
28
|
-
|
|
29
|
-
const stat = fs.statSync(filePath);
|
|
30
|
-
|
|
31
|
-
if (stat.isDirectory()) {
|
|
32
|
-
// 递归扫描子目录
|
|
33
|
-
const subResult = scanDir(filePath, baseDir, skipDirFile);
|
|
34
|
-
result.push(...subResult);
|
|
35
|
-
} else if (file.endsWith('.vue')) {
|
|
36
|
-
// 获取相对路径并规范化
|
|
37
|
-
const relativePath = normalizePath(path.relative(baseDir, filePath));
|
|
38
|
-
const componentName = generateComponentName(filePath);
|
|
39
|
-
|
|
40
|
-
// 使用规范化的路径生成导入语句
|
|
41
|
-
result.push(`import ${componentName} from './${relativePath}';\nexport { ${componentName} };`);
|
|
42
|
-
}
|
|
43
|
-
});
|
|
44
|
-
|
|
45
|
-
return result;
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
/**
|
|
49
|
-
* 根据文件路径生成组件名
|
|
50
|
-
*/
|
|
51
|
-
function generateComponentName(filePath: string): string {
|
|
52
|
-
const dirName = path.basename(path.dirname(filePath));
|
|
53
|
-
const fileName = path.basename(filePath, '.vue');
|
|
54
|
-
|
|
55
|
-
if (fileName === 'index') {
|
|
56
|
-
return capitalize(dirName);
|
|
57
|
-
} else {
|
|
58
|
-
return capitalize(fileName);
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
/**
|
|
63
|
-
* 插件主逻辑
|
|
64
|
-
*/
|
|
65
|
-
export default function AutoGenerateVue(options: { dir: string; skip: string[]; output: string }): Plugin {
|
|
66
|
-
return {
|
|
67
|
-
name: 'vite-plugin-auto-generate-vue',
|
|
68
|
-
config() {
|
|
69
|
-
const { dir, skip, output } = options;
|
|
70
|
-
|
|
71
|
-
// 检查output是否文件结尾
|
|
72
|
-
const isFile = path.extname(output) !== '';
|
|
73
|
-
if (!isFile) {
|
|
74
|
-
throw new Error(`The specified output file "${output}" must be a file.`);
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
// 规范化路径
|
|
78
|
-
const componentsDir = normalizePath(path.resolve(process.cwd(), dir));
|
|
79
|
-
const skipDirFile = skip.map((url) => {
|
|
80
|
-
return normalizePath(path.resolve(process.cwd(), url));
|
|
81
|
-
});
|
|
82
|
-
const outputFile = normalizePath(path.resolve(process.cwd(), output));
|
|
83
|
-
|
|
84
|
-
// 获取输出文件的目录路径
|
|
85
|
-
const baseDir = normalizePath(path.dirname(path.resolve(process.cwd(), output)));
|
|
86
|
-
|
|
87
|
-
if (!fs.existsSync(componentsDir)) {
|
|
88
|
-
throw new Error(`The specified directory "${componentsDir}" does not exist.`);
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
const result = scanDir(componentsDir, baseDir, skipDirFile);
|
|
92
|
-
const exportStatements = result.join('\n');
|
|
93
|
-
|
|
94
|
-
// 确保输出目录存在
|
|
95
|
-
const outputDir = path.dirname(outputFile);
|
|
96
|
-
if (!fs.existsSync(outputDir)) {
|
|
97
|
-
fs.mkdirSync(outputDir, { recursive: true });
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
// 写入到目标文件
|
|
101
|
-
fs.writeFileSync(outputFile, exportStatements, 'utf-8');
|
|
102
|
-
console.log(`[autoGenerateVue] Global components written to ${output}`);
|
|
103
|
-
},
|
|
104
|
-
};
|
|
105
|
-
}
|
package/postcss.config.ts
DELETED
package/tailwind.config.ts
DELETED
package/tsconfig.json
DELETED
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"compilerOptions": {
|
|
3
|
-
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
|
|
4
|
-
"declaration": true,
|
|
5
|
-
"declarationMap": false,
|
|
6
|
-
"emitDeclarationOnly": false,
|
|
7
|
-
"esModuleInterop": true,
|
|
8
|
-
"target": "ESNext",
|
|
9
|
-
"useDefineForClassFields": true,
|
|
10
|
-
"module": "ESNext",
|
|
11
|
-
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
|
12
|
-
"skipLibCheck": true,
|
|
13
|
-
"removeComments": true,
|
|
14
|
-
"forceConsistentCasingInFileNames": true,
|
|
15
|
-
|
|
16
|
-
"composite": true,
|
|
17
|
-
"allowSyntheticDefaultImports": true,
|
|
18
|
-
|
|
19
|
-
/* Bundler mode */
|
|
20
|
-
"moduleResolution": "Bundler",
|
|
21
|
-
"resolveJsonModule": true,
|
|
22
|
-
"isolatedModules": true,
|
|
23
|
-
"noEmit": false,
|
|
24
|
-
"jsx": "preserve",
|
|
25
|
-
|
|
26
|
-
/* Linting */
|
|
27
|
-
"strict": true,
|
|
28
|
-
"noUnusedLocals": true,
|
|
29
|
-
"noUnusedParameters": true,
|
|
30
|
-
"noFallthroughCasesInSwitch": true,
|
|
31
|
-
"baseUrl": ".",
|
|
32
|
-
"paths": {
|
|
33
|
-
"@/*": ["src/*"]
|
|
34
|
-
},
|
|
35
|
-
"typeRoots": ["./node_modules/@types", "./types"],
|
|
36
|
-
"rootDir": "./",
|
|
37
|
-
"outDir": "lib",
|
|
38
|
-
|
|
39
|
-
"allowJs": true,
|
|
40
|
-
"types": ["vite/client", "node"],
|
|
41
|
-
"sourceMap": true,
|
|
42
|
-
"verbatimModuleSyntax": false
|
|
43
|
-
},
|
|
44
|
-
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.vue", "env.d.ts", "vite.config.ts"],
|
|
45
|
-
"exclude": ["node_modules", "lib", "dist"]
|
|
46
|
-
}
|
package/vite.config.ts
DELETED
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
import { ConfigEnv, defineConfig, loadEnv } from 'vite';
|
|
2
|
-
import vue from '@vitejs/plugin-vue';
|
|
3
|
-
import path from 'path';
|
|
4
|
-
// import tailwindcss from 'tailwindcss';
|
|
5
|
-
// import autoGenerateVue from './plugins/vite-plugin-auto-generate-vue';
|
|
6
|
-
import dts from 'vite-plugin-dts';
|
|
7
|
-
|
|
8
|
-
// https://vitejs.dev/config/
|
|
9
|
-
export default defineConfig(({ mode }: ConfigEnv) => {
|
|
10
|
-
const root = process.cwd();
|
|
11
|
-
const env = loadEnv(mode, root);
|
|
12
|
-
console.log(new Date().toLocaleTimeString(), ' ', env);
|
|
13
|
-
|
|
14
|
-
return {
|
|
15
|
-
plugins: [
|
|
16
|
-
// autoGenerateVue({
|
|
17
|
-
// dir: './src/components',
|
|
18
|
-
// skip: ['./src/components/error', './src/components/form/aceEditor', './src/components/layout/page'],
|
|
19
|
-
// output: './src/components/index.ts',
|
|
20
|
-
// }),
|
|
21
|
-
vue(),
|
|
22
|
-
dts({
|
|
23
|
-
outDir: 'lib',
|
|
24
|
-
entryRoot: 'src',
|
|
25
|
-
// 确保所有文件都能生成类型
|
|
26
|
-
include: ['src/**/*.ts', 'src/**/*.vue', 'src/**/*.d.ts'],
|
|
27
|
-
// 排除不需要的文件
|
|
28
|
-
exclude: ['node_modules/**', 'src/**/*.test.ts'],
|
|
29
|
-
// 不使用API Extractor来生成类型
|
|
30
|
-
rollupTypes: false,
|
|
31
|
-
// 启用静态导入,避免某些Vue模块解析问题
|
|
32
|
-
staticImport: true,
|
|
33
|
-
// 生成.d.ts入口文件
|
|
34
|
-
insertTypesEntry: true,
|
|
35
|
-
// 复制外部.d.ts文件
|
|
36
|
-
copyDtsFiles: true,
|
|
37
|
-
}),
|
|
38
|
-
],
|
|
39
|
-
// esmExternals: true,
|
|
40
|
-
// css: {
|
|
41
|
-
// postcss: {
|
|
42
|
-
// plugins: [tailwindcss()],
|
|
43
|
-
// },
|
|
44
|
-
// },
|
|
45
|
-
resolve: {
|
|
46
|
-
alias: {
|
|
47
|
-
'@': path.resolve('./src'),
|
|
48
|
-
'@skyfox2000/fapi': path.resolve('../502417_fapi'),
|
|
49
|
-
'@skyfox2000/microbase': path.resolve('../502424_MicroBase'),
|
|
50
|
-
},
|
|
51
|
-
extensions: ['.js', '.ts', '.vue', 'json'],
|
|
52
|
-
},
|
|
53
|
-
build: {
|
|
54
|
-
outDir: 'lib',
|
|
55
|
-
assetsDir: 'assets',
|
|
56
|
-
lib: {
|
|
57
|
-
entry: {
|
|
58
|
-
index: 'src/index.ts',
|
|
59
|
-
AceEditor: 'src/components/form/aceEditor/index.vue',
|
|
60
|
-
ExcelForm: 'src/components/content/dialog/excelForm.vue',
|
|
61
|
-
UploadForm: 'src/components/content/dialog/uploadForm.vue',
|
|
62
|
-
Error403: 'src/components/error/error403.vue',
|
|
63
|
-
Error404: 'src/components/error/error404.vue',
|
|
64
|
-
BasicLayout: 'src/components/layout/page/basicLayout.vue',
|
|
65
|
-
MenuLayout: 'src/components/layout/page/menuLayout.vue',
|
|
66
|
-
},
|
|
67
|
-
fileName: (format, entryName) => {
|
|
68
|
-
if (entryName === 'index') return `webui.${format}.js`;
|
|
69
|
-
return `es/${entryName}/index.js`;
|
|
70
|
-
},
|
|
71
|
-
},
|
|
72
|
-
rollupOptions: {
|
|
73
|
-
// 外部化处理那些你并不打算打包进库的依赖
|
|
74
|
-
external: [
|
|
75
|
-
'pinia',
|
|
76
|
-
'pinia-plugin-persistedstate',
|
|
77
|
-
'dayjs',
|
|
78
|
-
'vue',
|
|
79
|
-
'vue-router',
|
|
80
|
-
'ant-design-vue',
|
|
81
|
-
'vue-m-message',
|
|
82
|
-
'vue-draggable-next',
|
|
83
|
-
'@skyfox2000/fapi',
|
|
84
|
-
'@skyfox2000/microbase',
|
|
85
|
-
|
|
86
|
-
'@vue-office/excel',
|
|
87
|
-
'@json2csv/plainjs',
|
|
88
|
-
'async-validator',
|
|
89
|
-
'exceljs',
|
|
90
|
-
// 添加ace相关的依赖为external
|
|
91
|
-
'ace-builds',
|
|
92
|
-
'vue3-ace-editor',
|
|
93
|
-
'ace-builds/src-min-noconflict/ext-language_tools',
|
|
94
|
-
'ace-builds/src-min-noconflict/mode-json',
|
|
95
|
-
'ace-builds/src-min-noconflict/mode-javascript',
|
|
96
|
-
'ace-builds/src-min-noconflict/mode-yaml',
|
|
97
|
-
'ace-builds/src-min-noconflict/theme-github',
|
|
98
|
-
'ace-builds/src-min-noconflict/theme-monokai',
|
|
99
|
-
'ace-builds/src-min-noconflict/theme-twilight',
|
|
100
|
-
],
|
|
101
|
-
// 如果你使用 TypeScript,则需要提供类型声明文件的输出路径
|
|
102
|
-
output: [
|
|
103
|
-
{
|
|
104
|
-
globals: {}, // 这里指定 crypto-js 的全局变量名为 CryptoJS
|
|
105
|
-
extend: false,
|
|
106
|
-
format: 'es',
|
|
107
|
-
dir: 'lib',
|
|
108
|
-
chunkFileNames: (assetInfo) => {
|
|
109
|
-
let name = assetInfo.name;
|
|
110
|
-
if (name.indexOf('.') > -1) name = name.substring(0, name.indexOf('.'));
|
|
111
|
-
return `assets/modules/${name}-[hash].js`;
|
|
112
|
-
},
|
|
113
|
-
},
|
|
114
|
-
],
|
|
115
|
-
},
|
|
116
|
-
minify: true, // 开启压缩
|
|
117
|
-
sourcemap: false,
|
|
118
|
-
},
|
|
119
|
-
};
|
|
120
|
-
});
|
|
@@ -1,116 +0,0 @@
|
|
|
1
|
-
# 代码规范及风格指南
|
|
2
|
-
|
|
3
|
-
1. 技术栈要求:
|
|
4
|
-
|
|
5
|
-
> 核心技术栈: Vue3 + TypeScript + Vite4 + Pinia + VueRouter
|
|
6
|
-
>
|
|
7
|
-
> UI组件: [AntDesign-vue v3.2.x](https://antdv.com/components/overview)
|
|
8
|
-
>
|
|
9
|
-
> CSS预处理器: [Windi CSS](https://windicss.org/integrations/vite.html)(优先), 其次`less`
|
|
10
|
-
>
|
|
11
|
-
> Vite插件:
|
|
12
|
-
>
|
|
13
|
-
> * [File system based route generator](https://github.com/hannoeru/vite-plugin-pages)
|
|
14
|
-
> * [Vue Layouts](https://github.com/JohnCampionJr/vite-plugin-vue-layouts)
|
|
15
|
-
> * [Auto import APIs](https://github.com/antfu/unplugin-auto-import)
|
|
16
|
-
> * [Components auto importing](https://github.com/antfu/unplugin-vue-components)
|
|
17
|
-
|
|
18
|
-
2. Git commit 风格指南
|
|
19
|
-
|
|
20
|
-
> - feat: 增加新功能
|
|
21
|
-
> - fix: 修复问题
|
|
22
|
-
> - style: 代码风格相关无影响运行结果的
|
|
23
|
-
> - perf: 优化/性能提升
|
|
24
|
-
> - refactor: 重构
|
|
25
|
-
> - revert: 撤销修改
|
|
26
|
-
> - test: 测试相关
|
|
27
|
-
> - docs: 文档/注释
|
|
28
|
-
> - chore: 依赖更新/脚手架配置修改等
|
|
29
|
-
> - ci: 持续集成
|
|
30
|
-
|
|
31
|
-
3. 使用`pnpm`进行包管理
|
|
32
|
-
|
|
33
|
-
4. `README.md`中要写清楚如下内容:
|
|
34
|
-
|
|
35
|
-
* 目录结构说明
|
|
36
|
-
* 使用到的技术栈: 如第三方组件库, UI库, 工具库等等
|
|
37
|
-
* 最低NodeJS的版本要求
|
|
38
|
-
* 初始化项目的过程: 如何安装NodeJS, pnpm, 如何安装依赖, 如何启用项目
|
|
39
|
-
* 打包: 打包的命令, 注意事项等
|
|
40
|
-
|
|
41
|
-
5. 代码书写风格可以不使用perttier等插件进行约束, 但总体书写风格请参考prettierrc.json:
|
|
42
|
-
|
|
43
|
-
```json
|
|
44
|
-
{
|
|
45
|
-
"semi": true,
|
|
46
|
-
"tabWidth": 2,
|
|
47
|
-
"useTabs": false,
|
|
48
|
-
"singleQuote": true,
|
|
49
|
-
"quoteProps": 'as-needed',
|
|
50
|
-
"printWidth": 120,
|
|
51
|
-
"trailingComma": "all",
|
|
52
|
-
"endOfLine": 'lf',
|
|
53
|
-
}
|
|
54
|
-
```
|
|
55
|
-
|
|
56
|
-
6. 项目中若用到了`ES6`之后更高级的特性, Build时请考虑是否需要`Polyfill`, 参考官方插件`@vitejs/plugin-legacy`
|
|
57
|
-
|
|
58
|
-
> `备注`: 需要支持Chrome 69以上
|
|
59
|
-
|
|
60
|
-
7. 请使用MockJS进行API Mock, 参考插件`vite-plugin-mock`
|
|
61
|
-
|
|
62
|
-
8. 参考Vite中关于dotenv章节的说明, 使用.env区分不同环境, 如: staing, dev, production. 同时结合第四点, 实现dev使用Mockjs, sating使用测试接口地址, production使用正式接口地址
|
|
63
|
-
|
|
64
|
-
9. TypeScript的typing类型声明, 如果是公用的, 统一放在 `src/typings`下, 如果是组件内部使用的类型声明, 定义在组件内部或者同级目录下
|
|
65
|
-
|
|
66
|
-
10. 所有的 API 请求和响应参数, 都要申明ts的typings(放在统一的`api.d.ts`文件中), 同时入参和出参有公共参数, 请抽离, 参考如下:
|
|
67
|
-
```typescript
|
|
68
|
-
export type AnyObject = Record<string | number, any> | Array | any;
|
|
69
|
-
|
|
70
|
-
export declare namespace Request {
|
|
71
|
-
|
|
72
|
-
interface SignableRequest<D = AnyObject> {
|
|
73
|
-
traceid: string; // 跟踪ID
|
|
74
|
-
timestamp: string; // 请求时间: yyyy-MM-dd HH:mm:ss
|
|
75
|
-
data?: D;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
interface PagingRequest {
|
|
79
|
-
pageNo: number;
|
|
80
|
-
pageSize: number;
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
interface QueryUserInfo extends SignableRequest {
|
|
84
|
-
userId: number;
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
export declare namespace Model {
|
|
89
|
-
|
|
90
|
-
interface UserInfo {
|
|
91
|
-
userName: string;
|
|
92
|
-
userId: string;
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
export declare namespace Response {
|
|
97
|
-
|
|
98
|
-
interface AbstractResponse<D = AnyObject> {
|
|
99
|
-
status: number; // 状态码
|
|
100
|
-
message?: string;
|
|
101
|
-
timestamp: string; // 请求时间: yyyy-MM-dd HH:mm:ss
|
|
102
|
-
data?: D;
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
declare type User = AbstractResponse<Model.UserInfo>;
|
|
106
|
-
}
|
|
107
|
-
```
|
|
108
|
-
|
|
109
|
-
11. API接口请统一封装在 `src/api`目录下, 根据模块进行文件分割, 避免各个API URL散落在各个页面和组件中
|
|
110
|
-
|
|
111
|
-
12. Vue风格指南, 请参考: https://vuejs.org/style-guide/rules-strongly-recommended.html#priority-b-rules-strongly-recommended
|
|
112
|
-
1. 单文件组件, 首字母要大写, 不要仅用一个单词进行命名, 使用驼峰命名. 项目有这样的命名`left.vue`
|
|
113
|
-
2. Base组件, 请统一在组件命名时, 增加前缀, 如`Base`或`App`. 项目有这样的命名`header.vue`
|
|
114
|
-
3. pages下的Vue文件, 如果是自定义组件的, 参考上述要求, 如果是用作路由的, 请使用小写
|
|
115
|
-
|
|
116
|
-
13. import 路径禁止出现这种 `import shangHaiMap from "./../../../assets/shanghai.json"`, 使用`@`符号代替根路径, 调整成 `import shangHaiMap from '@/assets/shanghai.json''`
|