fixbug: 🐛 路由显示问题和vue模板保持一致 #1
|
@ -1,8 +1,8 @@
|
|||
export default {
|
||||
"*.{js,jsx,ts,tsx}": ["eslint --fix", "prettier --write"],
|
||||
"{!(package)*.json,*.code-snippets,.!(browserslist)*rc}": ["prettier --write--parser json"],
|
||||
"package.json": ["prettier --write"],
|
||||
"*.vue": ["eslint --fix", "prettier --write", "stylelint --fix"],
|
||||
"*.{scss,less,styl,html}": ["stylelint --fix", "prettier --write"],
|
||||
"*.md": ["prettier --write"]
|
||||
module.exports = {
|
||||
'*.{js,jsx,ts,tsx}': ['eslint --fix --no-ignore', 'prettier --write'],
|
||||
'{!(package)*.json,*.code-snippets,.!(browserslist)*rc}': ['prettier --write--parser json'],
|
||||
'package.json': ['prettier --write'],
|
||||
'*.vue': ['eslint --fix --no-ignore', 'prettier --write', 'stylelint --fix'],
|
||||
'*.{scss,less,styl,html}': ['stylelint --fix --no-ignore', 'prettier --write'],
|
||||
'*.md': ['prettier --write'],
|
||||
};
|
||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -26,6 +26,7 @@
|
|||
"core-js": "^3.36.0",
|
||||
"crypto-js": "^4.2.0",
|
||||
"dayjs": "^1.11.10",
|
||||
"dotenv": "^16.4.5",
|
||||
"echarts": "^5.5.0",
|
||||
"loadsh": "^0.0.4",
|
||||
"mitt": "^3.0.1",
|
||||
|
|
|
@ -6,8 +6,8 @@ const routeMap: Record<string, RouteRecordRaw> = {};
|
|||
|
||||
// * 所有处理的路由
|
||||
const contexts = [
|
||||
{ context: import.meta.glob("@/views/**/*.vue", { eager: true, import: "default", }), isIndex: true },
|
||||
{ context: import.meta.glob("@/views/**/page.ts", { eager: true, import: "default", }), isIndex: false },
|
||||
{ context: import.meta.glob('@/views/**/index.vue', { eager: true, import: 'default' }), isIndex: true },
|
||||
{ context: import.meta.glob('@/views/**/page.ts', { eager: true, import: 'default' }), isIndex: false },
|
||||
];
|
||||
|
||||
/**
|
||||
|
@ -22,23 +22,22 @@ const createRouteList = (context: any, isIndex: boolean) => {
|
|||
const route: any = {
|
||||
name: fileInfo?.name,
|
||||
path: fileInfo!.path,
|
||||
component: isIndex ? () => import(fileInfo!.filePath) : undefined,
|
||||
component: isIndex ? () => import(/* @vite-ignore */ fileInfo!.filePath, {}) : undefined,
|
||||
};
|
||||
// 初始化赋值
|
||||
if (isIndex) {
|
||||
routeMap[route.path] = route;
|
||||
|
||||
} else {
|
||||
} else {
|
||||
// 导出当前存在的路由并重新赋值
|
||||
const existingRoute = routeMap[route.path];
|
||||
if (existingRoute) {
|
||||
routeMap[route.path] = { ...existingRoute, ...(exportRouteConfig as any) };
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
};
|
||||
|
||||
// * 生成路由信息
|
||||
contexts.forEach(({ context, isIndex }) => createRouteList(context, isIndex))
|
||||
contexts.forEach(({ context, isIndex }) => createRouteList(context, isIndex));
|
||||
|
||||
export const pageRoutes: Array<RouteRecordRaw> = [...Object.values(routeMap)];
|
||||
export const pageRoutes: Array<RouteRecordRaw> = [...Object.values(routeMap)];
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
* @param replaceValue 替换
|
||||
* @returns 文件转换对象
|
||||
*/
|
||||
export const routeFilenameHelper = (filePath: string, ) => {
|
||||
export const routeFilenameHelper = (filePath: string) => {
|
||||
// 匹配文件列表
|
||||
const fileMatchList = filePath.match(/\/([^/]+)$/);
|
||||
|
||||
|
@ -19,8 +19,7 @@ export const routeFilenameHelper = (filePath: string, ) => {
|
|||
// 路径下划线名
|
||||
const name = fullPath.replace(/\/(index|page)|^\//g, '').replace(/\//g, '_');
|
||||
// 路径名不带文件名
|
||||
const path = fullPath.replace(/[^/]*$/, '');
|
||||
console.log(path);
|
||||
return { fileExtension, filename, name, fullPath, path, filePath, };
|
||||
const path = fullPath.replace(/\/[^/]*$/, '');
|
||||
return { fileExtension, filename, name, fullPath, path, filePath };
|
||||
}
|
||||
};
|
||||
|
|
|
@ -1,84 +0,0 @@
|
|||
import fs from "fs";
|
||||
import path from "path";
|
||||
import dotenv from "dotenv";
|
||||
|
||||
export function isProdEnv(): boolean {
|
||||
return import.meta.env.PROD;
|
||||
}
|
||||
|
||||
export function isDevEnv(): boolean {
|
||||
return import.meta.env.DEV;
|
||||
}
|
||||
|
||||
export function isDevFn(mode: string): boolean {
|
||||
return mode === "development";
|
||||
}
|
||||
|
||||
export function isProdFn(mode: string): boolean {
|
||||
return mode === "production";
|
||||
}
|
||||
|
||||
/**
|
||||
* Whether to generate package preview
|
||||
*/
|
||||
export function isReportMode(): boolean {
|
||||
return process.env.VITE_REPORT === "true";
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 读取所有环境变量配置文件到process.env
|
||||
* @param envConf
|
||||
* */
|
||||
export function wrapperEnv(envConf: Recordable): ViteEnv {
|
||||
const ret: any = {};
|
||||
|
||||
for (const envName of Object.keys(envConf)) {
|
||||
let realName = envConf[envName].replace(/\\n/g, "\n");
|
||||
realName = realName === "true" ? true : realName === "false" ? false : realName;
|
||||
|
||||
if (envName === "VITE_PORT") {
|
||||
realName = Number(realName);
|
||||
}
|
||||
if (envName === "VITE_PROXY") {
|
||||
try {
|
||||
realName = JSON.parse(realName);
|
||||
} catch (error) {}
|
||||
}
|
||||
ret[envName] = realName;
|
||||
process.env[envName] = realName;
|
||||
}
|
||||
return ret;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the environment variables starting with the specified prefix
|
||||
* @param match prefix
|
||||
* @param confFiles ext
|
||||
*/
|
||||
export function getEnvConfig(match = "VITE_GLOB_", confFiles = [".env", ".env.production"]) {
|
||||
let envConfig = {};
|
||||
confFiles.forEach(item => {
|
||||
try {
|
||||
const env = dotenv.parse(fs.readFileSync(path.resolve(process.cwd(), item)));
|
||||
envConfig = { ...envConfig, ...env };
|
||||
} catch (error) {
|
||||
console.error(`Error in parsing ${item}`, error);
|
||||
}
|
||||
});
|
||||
|
||||
Object.keys(envConfig).forEach(key => {
|
||||
const reg = new RegExp(`^(${match})`);
|
||||
if (!reg.test(key)) {
|
||||
Reflect.deleteProperty(envConfig, key);
|
||||
}
|
||||
});
|
||||
return envConfig;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get user root directory
|
||||
* @param dir file path
|
||||
*/
|
||||
export function getRootPath(...dir: string[]) {
|
||||
return path.resolve(process.cwd(), ...dir);
|
||||
}
|
|
@ -1 +1,14 @@
|
|||
/// <reference types="vite/client" />
|
||||
|
||||
interface ImportMetaEnv {
|
||||
readonly VITE_GLOB_APP_TITLE: string; // 定义标题
|
||||
readonly VITE_PORT: number; // 定义端口号
|
||||
readonly VITE_OPEN: boolean; // 运行 npm run dev 时自动打开浏览器
|
||||
}
|
||||
|
||||
declare module '*.vue' {
|
||||
import type { DefineComponent } from 'vue';
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
|
||||
const component: DefineComponent<{}, {}, any>;
|
||||
export default component;
|
||||
}
|
||||
|
|
|
@ -1,52 +1,51 @@
|
|||
import vue from '@vitejs/plugin-vue';
|
||||
import { resolve } from "path";
|
||||
import { ConfigEnv, UserConfig, defineConfig, loadEnv } from "vite";
|
||||
import { wrapperEnv } from "./src/utils/getEnv";
|
||||
import { resolve } from 'path';
|
||||
import { UserConfig, defineConfig } from 'vite';
|
||||
|
||||
export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
|
||||
const root = process.cwd();
|
||||
const env = loadEnv(mode, root);
|
||||
const viteEnv = wrapperEnv(env);
|
||||
|
||||
return {
|
||||
export default defineConfig(
|
||||
(): UserConfig => ({
|
||||
resolve: {
|
||||
alias: {
|
||||
"@": resolve(__dirname, "./src"),
|
||||
"vue-i18n": "vue-i18n/dist/vue-i18n.cjs.js"
|
||||
}
|
||||
'@': resolve(__dirname, './src'),
|
||||
'vue-i18n': 'vue-i18n/dist/vue-i18n.cjs.js',
|
||||
},
|
||||
},
|
||||
server: {
|
||||
host: '0.0.0.0',
|
||||
port: 6261,
|
||||
open: true,
|
||||
cors: true,
|
||||
proxy: {
|
||||
'/api': {
|
||||
target: process.env.VUE_APP_URL,
|
||||
changeOrigin: true,
|
||||
rewrite: (path: string) => path.replace(/^\/api/, "/api")
|
||||
rewrite: (path: string) => path.replace(/^\/api/, '/api'),
|
||||
},
|
||||
'/mock': {
|
||||
target: process.env.VUE_APP_URL,
|
||||
changeOrigin: true,
|
||||
rewrite: (path: string) => path.replace(/^\/mock/, "")
|
||||
rewrite: (path: string) => path.replace(/^\/mock/, ''),
|
||||
},
|
||||
}
|
||||
},
|
||||
},
|
||||
plugins: [vue(),],
|
||||
plugins: [vue()],
|
||||
esbuild: {
|
||||
pure: viteEnv.VITE_DROP_CONSOLE ? ["console.log", "debugger"] : []
|
||||
pure: ['console.log', 'debugger'],
|
||||
},
|
||||
// 配置构建过程的选项,例如是否生成压缩文件和源映射
|
||||
build: {
|
||||
// 构建输出的目录,默认值为"dist"
|
||||
outDir: "dist",
|
||||
outDir: 'dist',
|
||||
// 用于指定使用的代码压缩工具。在这里,minify 被设置为 'terser',表示使用 Terser 进行代码压缩。默认值terser
|
||||
// esbuild 打包更快,但是不能去除 console.log,terser打包慢,但能去除 console.log
|
||||
minify: "terser",
|
||||
minify: 'terser',
|
||||
// 用于配置 Terser 的选项
|
||||
terserOptions: {
|
||||
// 用于配置压缩选项
|
||||
compress: {
|
||||
drop_console: true, // 是否删除代码中的 console 语句, 默认值false
|
||||
drop_debugger: true // 是否删除代码中的 debugger 语句, 默认值false
|
||||
}
|
||||
drop_debugger: true, // 是否删除代码中的 debugger 语句, 默认值false
|
||||
},
|
||||
},
|
||||
// 禁用 gzip 压缩大小报告,可略微减少打包时间
|
||||
reportCompressedSize: false,
|
||||
|
@ -55,7 +54,7 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
|
|||
// 用于配置 CommonJS 模块的选项
|
||||
commonjsOptions: {
|
||||
// 用于指定是否忽略 CommonJS 模块中的 try-catch 语句。当设置为false时,构建过程会保留 CommonJS 模块中的 try-catch 语句
|
||||
ignoreTryCatch: false
|
||||
ignoreTryCatch: false,
|
||||
},
|
||||
// 规定触发警告的 chunk 大小, 当某个代码分块的大小超过该限制时,Vite 会发出警告
|
||||
chunkSizeWarningLimit: 2000,
|
||||
|
@ -64,11 +63,11 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
|
|||
// 用于配置输出选项
|
||||
output: {
|
||||
// 静态资源分类和包装
|
||||
chunkFileNames: "assets/js/[name]-[hash].js", // 用于指定代码分块的输出文件名格式
|
||||
entryFileNames: "assets/js/[name]-[hash].js", // 用于指定入口文件的输出文件名格式
|
||||
assetFileNames: "assets/[ext]/[name]-[hash].[ext]" // 用于指定静态资源的输出文件名格式
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
chunkFileNames: 'assets/js/[name]-[hash].js', // 用于指定代码分块的输出文件名格式
|
||||
entryFileNames: 'assets/js/[name]-[hash].js', // 用于指定入口文件的输出文件名格式
|
||||
assetFileNames: 'assets/[ext]/[name]-[hash].[ext]', // 用于指定静态资源的输出文件名格式
|
||||
},
|
||||
},
|
||||
},
|
||||
}),
|
||||
);
|
||||
|
|
Loading…
Reference in New Issue