create-meadminjs 1.0.0

package/template/meadmin/view/admin/types/vue-router.d.ts

@@ -0,0 +1,39 @@
+declare module 'vue-router' {
+  export interface RouteMeta extends Record<string | number | symbol, unknown> {
+    // 标题设置该路由在侧边栏和面包屑中展示的名字
+    title: string;
+    // 对应权限 多个之间为或的关系
+    rule?: string[];
+    // 是否是固定的tag
+    affix?: boolean;
+    // 图标
+    icon?: string;
+    // 在tag中隐藏
+    hideTag?: boolean;
+    // 外链
+    isLink?: boolean;
+    // 当路由设置了该属性，则会高亮相对应的侧边栏。
+    // 这在某些场景非常有用，比如：一个文章的列表页路由为：/article/list
+    // 点击文章进入文章详情页，这时候路由为/article/1，但你想在侧边栏高亮文章列表的路由，就可以进行如下设置
+    // asyncRoutes如果不设置会自动计算展示不隐藏的祖级（包括当前）
+    activeMenu?: string;
+    // 如果设置为true，则不会被 <keep-alive> 缓存
+    noCache?: boolean;
+    // 在菜单中隐藏
+    hideMenu?: boolean;
+    // 当你一个路由下面的 children 声明的路由大于1个时，自动会变成嵌套的模式
+    // 只有一个时，会将那个子路由当做根路由显示在侧边栏
+    // 若你想不管路由下面的 children 声明的个数都显示你的根路由
+    // 你可以设置 alwaysShow: true，这样它就会忽略之前定义的规则，一直显示根路由
+    alwaysShow?: boolean;
+    // 是否需要面包屑 false不展示在面包屑,ture一直展示在面包屑,undefined当只有一个子元素面包屑时跳过展示
+    breadcrumb?: boolean;
+    //路由在菜单的index deep映射（会动态计算不要设置默认值）
+    menuIndex?: number[];
+  }
+  export interface _RouteRecordBase {
+    // 没有需要展示的子集（会动态计算不要设置默认值）
+    noShowingChildren?: boolean;
+  }
+}
+export {};

package/template/meadmin/view/admin/types/vueCustomProperties .d.ts

@@ -0,0 +1,6 @@
+declare module 'vue' {
+  interface ComponentCustomProperties {
+    $start?: boolean;
+  }
+}
+export {};

package/template/meadmin/view/admin/types/vueExtendType.d.ts

@@ -0,0 +1,43 @@
+import { MessageImport } from '@/locales/I18n';
+declare module 'vue' {
+  /* eslint-disable */
+  type LifecycleHook<TFn = Function> = TFn[] | null;
+  export declare interface ComponentOptionsBase {
+    langImport?: MessageImport;
+  }
+  export interface ComponentInternalInstance {
+    ctx: Record<string, unknown>;
+    /**
+     * suspense related
+     * @internal
+     */
+    suspense: SuspenseBoundary | null;
+    /**
+     * @internal
+     */
+    da: LifecycleHook;
+    /**
+     * @internal
+     */
+    a: LifecycleHook;
+  }
+  export interface VNode<HostNode = RendererNode, HostElement = RendererElement, ExtraProps = { [key: string]: any }> {
+    /**
+     * SFC only. This is assigned to:
+     * - Slot fragment vnodes with :slotted SFC styles.
+     * - Component vnodes (during patch/hydration) so that its root node can
+     *   inherit the component's slotScopeIds
+     * @internal
+     */
+    slotScopeIds: string[] | null;
+    /**
+     * @internal
+     */
+    ssContent: VNode | null;
+  }
+  /* eslint-disable */
+  interface ComponentCustomProperties {
+    $permission: (key: string | string[]) => boolean;
+  }
+}
+export {};

package/template/meadmin/view/admin/vite.config.ts

@@ -0,0 +1,110 @@
+import autoprefixer from 'autoprefixer';
+import { resolve } from 'path';
+import { ConfigEnv, UserConfigExport } from 'vite';
+import plugins from './plugins/index.js';
+// @ts-ignore
+import px2rem from 'postcss-plugin-px2rem';
+
+function pathResolve(dir: string) {
+  return resolve(import.meta.dirname, '.', dir);
+}
+export default async (configEnv: ConfigEnv): Promise<UserConfigExport> => {
+  return {
+    root: import.meta.dirname,
+    base: process.env.VIEW_ADMIN_PATH_PRE,
+    envPrefix: 'VIEW_ADMIN_',
+    plugins: await plugins(configEnv),
+    css: {
+      preprocessorOptions: {
+        scss: {
+          additionalData: `@use "@/styles/variables.scss" as *;`,
+        },
+      },
+      postcss: {
+        plugins: [
+          autoprefixer,
+          px2rem({
+            rootValue: 14, //换算基数，将 px 替换为 1/rootValue rem (即设计图下的fontSize)
+            // unitPrecision: 5, //允许REM单位增长到的十进制数字。
+            propWhiteList: ['font-size'], //默认值是一个空数组，这意味着禁用白名单并启用所有属性。
+            // propBlackList: ['font-size', 'border'], //不应从 px 更改为 rem 的属性
+            exclude: /(node_module)/, //默认false，可以（reg）利用正则表达式排除某些文件夹的方法，例如/(node_module)\/如果想把前端UI框架内的px也转换成rem，请把此属性设为默认值
+            // selectorBlackList: [], //要忽略并保留为px的选择器
+            // ignoreIdentifier: false,  //（boolean/string）忽略单个属性的方法，启用ignoreidentifier后，replace将自动设置为true。
+            // replace: true, // （布尔值）替换包含REM的规则，而不是添加回退。
+            mediaQuery: false, //（布尔值）允许在媒体查询中转换px。
+            minPixelValue: 2, //设置要替换的最小像素值(包含)。 默认 0
+          }),
+        ],
+      },
+    },
+    resolve: {
+      alias: [
+        // /@/xxxx => src/xxxx
+        {
+          find: /@\//,
+          replacement: pathResolve('src') + '/',
+        },
+      ],
+      extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'],
+    },
+
+    define: {
+      __SSR__: `true`,
+      __DEV__: configEnv.mode === 'development' ? `true` : `false`,
+      __COMPAT__: `false`,
+      __FEATURE_SUSPENSE__: `true`,
+      __FEATURE_PROD_DEVTOOLS__: `false`,
+    },
+    server: {
+      warmup: {
+        //提前转换和缓存文件以进行预热。可以在服务器启动时提高初始页面加载速度，并防止转换瀑布
+        clientFiles: [
+          //仅在客户端使用的文件,路径相对于root
+          './src/main.ts',
+          './src/utils/request.ts',
+        ],
+      },
+    },
+    experimental: {
+      //ssr需求代码
+      renderBuiltUrl(filename, { hostType, type, ssr }) {
+        if (ssr && type === 'asset' && hostType === 'js') {
+          return {
+            runtime: `__ssr_vue_processAssetPath(${JSON.stringify(filename)})`,
+          };
+        }
+      },
+    },
+
+    build: {
+      rollupOptions: {
+        experimentalLogSideEffects: false,
+        output: {
+          experimentalMinChunkSize: 20 * 1024,
+          manualChunks(id: string) {
+            if (['vue', 'vue-router', 'pinia', 'vue-request', 'jquery', 'axios'].some((v) => new RegExp(`.*node_modules/.*${v}.*`).test(id))) {
+              return 'core';
+            }
+            if (['@element-plus/icons-vue'].some((v) => new RegExp(`.*node_modules/.*${v}.*`).test(id))) {
+              return 'elIcon';
+            }
+            return null;
+          },
+        },
+      },
+      emptyOutDir: true,
+    },
+    optimizeDeps: {
+      //因为项目中很多用到了自动引入和动态加载，所以vite首次扫描依赖项会扫描不全，这里强制扫描src下全局,并加载element-plus。
+      entries: ['src/**/*.{ts,tsx,vue}', './index.html'],
+      include: [
+        'element-plus/es/components/loading/style/css',
+        'element-plus/es/components/message/style/css',
+        'element-plus/es/components/message-box/style/css',
+        'element-plus/es/components/notification/style/css',
+        'node_modules/element-plus/es/index.mjs',
+      ],
+    },
+  };
+};

package/template/meadmin/view/index/.prettierignore

@@ -0,0 +1,28 @@
+## OS
+.DS_Store
+.idea
+.editorconfig
+pnpm-lock.yaml
+.npmrc
+
+# Ignored suffix
+*.log
+*.md
+*.svg
+*.png
+*.ico
+*ignore
+LICENSE
+.env*
+## Local
+test
+.husky
+.github
+
+## Built-files
+.cache
+dist
+template
+
+## auto create files
+types/auto-imports.d.ts

package/template/meadmin/view/index/.prettierrc.cjs

@@ -0,0 +1,4 @@
+// .prettierrc.js
+module.exports = {
+  ...require('../../.prettierrc.cjs'),
+};

package/template/meadmin/view/index/README.md

@@ -0,0 +1,84 @@
+# 前台页面
+
+## 注意事项
+
+支持服务端渲染，开发需寻遵循以下事项，以兼容服务端渲染特性
+
+- 如需使用window对象需增加服务端渲染判断
+```
+if (!import.meta.env.SSR) {
+  //下面代码仅在客户端执行
+  window.addEventListener('resize', () => mitter.emit(event.RESIZE));
+}
+
+```
+
+- request请求需在setup顶层创建，以规避服务端渲染“跨请求状态污染”
+```
+//login.vue
+<script setup lang="ts" name="Login">
+//...
+import {  loginCaptchaApi } from '@/api/login';
+const { data: captchaObj, runAsync: getCaptchRun } = loginCaptchaApi();
+const getCaptch = async () => {
+  await getCaptchRun();
+  //...
+};
+await getCaptch();
+//...
+</script>
+
+```
+- 如在组件外发送请求需透传app给request方法，
+```
+//login.ts
+export function loginApi<T extends boolean = true>(returnAxios: T = true as T, app?:App) {
+  return request<LoginResult, [LoginParams], T>(
+    (params) => ({
+      url: 'login/login',
+      method: 'post',
+      data: params,
+    }),
+    {},
+    returnAxios,
+    app,
+  );
+}
+```
+```
+ // userStore
+  login: async function (app:App, params: LoginParams) {
+    //...
+    const res = await loginApi(true,app)(params);
+    //...
+  },
+```
+```
+//login.vue
+const _this = getCurrentInstance();
+const submit = async () => {
+  //...
+  await userStore.login(_this!.appContext.app,loginParams);
+};
+//...
+```
+- 请求直接，在setp 顶层await否则服务端渲染期间无法获取到数据。
+
+- 如需在组件外创建store，需传入pinia
+```
+//request.ts
+
+export function request<R, P extends unknown[] = [], T = boolean>(
+  axiosConfig: (...args: P) => AxiosRequestConfig | Promise<AxiosRequestConfig>,
+  options?: RequestOptions<R, P>,
+  returnAxios?: T,
+  app?: App,
+) {
+//...
+ store = app?.config.globalProperties.$pinia;
+ const userStore = useUserStore(store);
+//...
+}
+
+```
+

package/template/meadmin/view/index/cli/autoImport.ts

@@ -0,0 +1,3 @@
+#!/usr/bin/env ts-node
+import autoImport from '../plugins/autoImport.js';
+autoImport().buildStart();

package/template/meadmin/view/index/eslint.config.js

@@ -0,0 +1,91 @@
+import eslint from '@eslint/js';
+import eslintConfigPrettier from 'eslint-config-prettier';
+import eslintPluginVue from 'eslint-plugin-vue';
+import { defineConfig } from 'eslint/config';
+import globals from 'globals';
+import tseslint from 'typescript-eslint';
+
+export default defineConfig(
+  eslint.configs.recommended,
+  tseslint.configs.recommended,
+  eslintPluginVue.configs['flat/recommended'],
+  {
+    files: ['**/*.{ts,vue}'],
+    languageOptions: {
+      ecmaVersion: 'latest',
+      sourceType: 'module',
+      globals: globals.browser,
+      parserOptions: {
+        parser: tseslint.parser,
+        tsconfigRootDir: import.meta.dirname,
+      },
+    },
+    rules: {
+      // override/add rules settings here, such as:
+      '@typescript-eslint/no-explicit-any': 'off',
+      '@typescript-eslint/no-unused-expressions': [
+        'error',
+        {
+          allowShortCircuit: true, //允许使用逻辑短路语句，例如 a && b()。
+          allowTernary: true, //允许使用三元运算符 a ? b() : c()
+        },
+      ],
+      'vue/multi-word-component-names': 'off',
+      'vue/no-required-prop-with-default': 'off',
+      'vue/require-default-prop': 'off',
+      '@typescript-eslint/ban-ts-comment': 'off',
+      'no-undef': 'off', // ts(2304)
+      'no-async-promise-executor': 'off',
+      'vue/prefer-import-from-vue': 'off',
+      'vue/no-v-html': 'off',
+      '@typescript-eslint/no-unsafe-function-type': 'off',
+      '@typescript-eslint/naming-convention': [
+        'error',
+        {
+          selector: 'default',
+          format: ['camelCase', 'PascalCase'],
+          leadingUnderscore: 'allowSingleOrDouble',
+          filter: {
+            // you can expand this regex to add more allowed names
+            regex: '^((__v_.*)|([0-9]+))$',
+            match: false,
+          },
+        },
+        {
+          selector: 'variable',
+          modifiers: ['const'],
+          format: ['camelCase', 'UPPER_CASE', 'PascalCase'],
+          leadingUnderscore: 'allowSingleOrDouble',
+        },
+        {
+          selector: ['memberLike'],
+          format: null,
+          // format: ['camelCase', 'PascalCase'],
+          // leadingUnderscore: 'allowSingleOrDouble',
+          // filter: {
+          //   // you can expand this regex to add more allowed names
+          //   regex: '^((__v_.*)|([0-9]+))$',
+          //   match: false,
+          // },
+        },
+        {
+          selector: 'enumMember',
+          format: ['camelCase', 'PascalCase', 'UPPER_CASE'],
+          leadingUnderscore: 'allowSingleOrDouble',
+        },
+        {
+          selector: ['typeLike', 'enum'],
+          format: ['PascalCase'],
+          leadingUnderscore: 'allowSingleOrDouble',
+        },
+        {
+          selector: ['default'],
+          modifiers: ['destructured', 'exported'],
+          format: null,
+        },
+      ],
+    },
+  },
+  { ignores: ['**/*.d.ts', '**/coverage', '**/dist'] },
+  eslintConfigPrettier,
+);

package/template/meadmin/view/index/index.html

@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en" class="me-default">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <base target="_blank" />
+    <title>me-admin</title>
+    <style>
+      body {
+        margin: 0;
+        padding: 0;
+      }
+    </style>
+    <!--preload-links-->
+  </head>
+  <body>
+    <!--app-teleports-->
+    <div id="app"><!--app-html--></div>
+    <script type="module" src="/src/entry-client.ts"></script>
+  </body>
+</html>

package/template/meadmin/view/index/packageTemplate.json

@@ -0,0 +1,122 @@
+{
+  "name": "index-template",
+  "private": true,
+  "version": "1.0.0",
+  "type": "module",
+  "author": {
+    "name": "meadmin-cn",
+    "email": "yuntian001z@qq.com",
+    "url": "https://github.com/yuntian001"
+  },
+  "scripts": {
+    "format": "prettier --write --cache .",
+    "dev": "vite",
+    "build": "npm run type-check && vite build -m prod ",
+    "build-github": "npm run type-check && vite build -m prod --base=/meadmin-template/",
+    "type-check": "npx tsx ./cli/autoImport.ts  && vue-tsc --noEmit",
+    "preview": "vite preview",
+    "release-main": "release-it -c .release-it-main.json",
+    "release-template": "release-it",
+    "eslint": "eslint . --cache --ext .vue,.ts,.tsx",
+    "eslint:fix": "eslint . --ext .vue,.ts,.tsx --fix",
+    "prettier": "prettier --cache  -l \"./**/*\"",
+    "prettier:fix": "prettier --write --cache  -l \"./**/*\""
+  },
+  "dependencies": {
+    "@element-plus/icons-vue": "^2.3.2",
+    "@meadmin-cn/vite-plugin-mock": "^2.9.8",
+    "@vue/shared": "^3.5.22",
+    "@vueuse/core": "^9.13.0",
+    "@wangeditor/editor": "^5.1.23",
+    "@wangeditor/editor-for-vue": "^5.1.12",
+    "axios": "^1.12.2",
+    "dayjs": "^1.11.18",
+    "echarts": "^5.6.0",
+    "element-plus": "^2.13.0",
+    "format-number": "^3.0.0",
+    "jquery": "^3.7.1",
+    "js-cookie": "^3.0.5",
+    "lodash-es": "^4.17.21",
+    "md-editor-v3": "^2.11.3",
+    "mockjs": "^1.1.0",
+    "nprogress": "^0.2.0",
+    "path-browserify": "^1.0.1",
+    "pinia": "^2.3.1",
+    "qs": "^6.14.0",
+    "serialize-javascript": "^6.0.2",
+    "spark-md5": "^3.0.2",
+    "tableexport": "^5.2.0",
+    "vite-plugin-compression2": "^2.4.0",
+    "vue": "^3.5.22",
+    "vue-form-create": "^1.2.12",
+    "vue-request": "^2.0.4",
+    "vue-router": "^4.5.1",
+    "vxe-pc-ui": "^4.10.12",
+    "vxe-table": "^4.17.2",
+    "vxe-table-plugin-element": "^4.0.4",
+    "xe-utils": "^3.7.9"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.28.4",
+    "@babel/eslint-parser": "^7.28.4",
+    "@babel/plugin-transform-runtime": "^7.28.3",
+    "@babel/preset-env": "^7.28.3",
+    "@babel/runtime": "^7.28.4",
+    "@commitlint/cli": "^17.8.1",
+    "@commitlint/config-conventional": "^17.8.1",
+    "@eslint/js": "^9.39.2",
+    "@rollup/plugin-babel": "^5.3.1",
+    "@types/jquery": "^3.5.33",
+    "@types/js-cookie": "^3.0.6",
+    "@types/lodash-es": "^4.17.12",
+    "@types/mockjs": "^1.0.10",
+    "@types/node": "^20.19.21",
+    "@types/nprogress": "^0.2.3",
+    "@types/path-browserify": "^1.0.3",
+    "@types/qs": "^6.14.0",
+    "@types/serialize-javascript": "^5.0.4",
+    "@types/spark-md5": "^3.0.5",
+    "@vitejs/plugin-vue": "^6.0.2",
+    "@yuntian001/vue-setup-extend": "^1.0.0",
+    "autoprefixer": "^10.4.21",
+    "core-js": "^3.46.0",
+    "eslint": "^9.39.2",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-vue": "10.7.0",
+    "globals": "^17.2.0",
+    "husky": "^8.0.3",
+    "lint-staged": "^13.3.0",
+    "postcss-plugin-px2rem": "^0.8.1",
+    "prettier": "2.8.8",
+    "rollup-plugin-visualizer": "^5.14.0",
+    "sass": "^1.93.2",
+    "terser": "^5.44.0",
+    "tsx": "^4.20.6",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.54.0",
+    "unplugin-auto-import": "^20.2.0",
+    "unplugin-vue-components": "^30.0.0",
+    "vite": "^7.2.4",
+    "vite-plugin-autogeneration-import-file": "^3.0.1",
+    "vite-svg-loader": "^5.1.0",
+    "vue-eslint-parser": "^10.2.0",
+    "vue-tsc": "^2.2.12",
+    "xregexp": "^5.1.2"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/meadmin-cn/meadmin.git"
+  },
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/meadmin-cn/meadmin/issues"
+  },
+  "homepage": "https://github.com/meadmin-cn/meadmin",
+  "lint-staged": {
+    "**/*": "prettier --cache --write --ignore-unknown",
+    "*.{vue,ts,tsx}": "eslint --cache --fix"
+  },
+  "engines": {
+    "node": ">=20.10.0"
+  }
+}

package/template/meadmin/view/index/plugins/autoComponents.ts

@@ -0,0 +1,10 @@
+import { ElementPlusResolver } from 'unplugin-vue-components/resolvers';
+import Components from 'unplugin-vue-components/vite';
+import { resolver } from './autoImport.js';
+export default () =>
+  Components({
+    // 组件自动注册(包括components下的所有.vue组件和ElementPlus组件)
+    include: [],
+    dts: false,
+    resolvers: [ElementPlusResolver({ importStyle: false }), resolver([3], [2])],
+  });

package/template/meadmin/view/index/plugins/autoImport.ts

@@ -0,0 +1,64 @@
+import * as fs from 'node:fs';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { createPlugin } from 'vite-plugin-autogeneration-import-file';
+const { autoImport, resolver: resolverFn } = createPlugin();
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+function pathResolve(dir: string) {
+  return resolve(__dirname, '../', dir);
+}
+export default () =>
+  autoImport([
+    // 自动生成
+    {
+      // svg icon type
+      pattern: ['*.svg'],
+      dir: pathResolve('src/icons/svg'),
+      toFile: pathResolve('types/meIconComponents.d.ts'),
+      name: 'MeIcon_{{name}}',
+      template: fs.readFileSync(pathResolve('./template/meIconComponents.d.ts'), 'utf-8'),
+      codeTemplates: [{ key: '//code', template: '{{name}}: Icon;\n    ' }],
+    },
+    {
+      // pinia module
+      pattern: ['**/*.{ts,js}', '*.{ts,js}'],
+      dir: pathResolve('src/store/modules'),
+      toFile: pathResolve('src/store/module.ts'),
+      name: 'use_{{name}}_store',
+    },
+    {
+      // auto import directives
+      pattern: ['*.ts', '**/index.ts'],
+      dir: pathResolve('src/directives'),
+      toFile: pathResolve('types/directives.d.ts'),
+      template: fs.readFileSync(pathResolve('./template/directives.d.ts'), 'utf-8'),
+      codeTemplates: [
+        {
+          key: '//code',
+          template: "{{name}}: typeof import('{{path}}')['default'];\n    ",
+        },
+      ],
+      name: 'V_{{name}}',
+    },
+    {
+      // auto import components
+      pattern: ['*.{vue,ts}', '**/index.{vue,ts}'],
+      dir: pathResolve('src/components'),
+      toFile: pathResolve('types/components.d.ts'),
+      template: fs.readFileSync(pathResolve('./template/components.d.ts'), 'utf-8'),
+      codeTemplates: [
+        {
+          key: '//code',
+          template: "{{name}}: typeof import('{{path}}')['default'];\n    ",
+        },
+        {
+          key: '//typeCode',
+          template: "type {{name}}Instance = InstanceType<typeof import('{{path}}')['default']>;\n  ",
+        },
+      ],
+      name: '_{{name}}',
+    },
+  ]);
+
+export const resolver = resolverFn;

package/template/meadmin/view/index/plugins/autoImportApi.ts

@@ -0,0 +1,14 @@
+import { resolve } from 'path';
+import AutoImport from 'unplugin-auto-import/vite';
+import { ElementPlusResolver } from 'unplugin-vue-components/resolvers';
+function pathResolve(dir: string) {
+  return resolve(import.meta.dirname, '../', dir);
+}
+export default () =>
+  AutoImport({
+    // 自动加载API
+    imports: ['vue', 'vue-router', 'pinia', '@vueuse/core'],
+    // 可以选择auto-imports.d.ts生成的位置，使用ts建议设置为'src/auto-imports.d.ts'
+    dts: pathResolve('types/auto-imports.d.ts'),
+    resolvers: [ElementPlusResolver({ importStyle: false })],
+  });

package/template/meadmin/view/index/plugins/babel.ts

@@ -0,0 +1,25 @@
+import { babel } from '@rollup/plugin-babel';
+import { createRequire } from 'node:module';
+export default () =>
+  babel({
+    babelrc: false,
+    extensions: ['.ts', '.tsx'],
+    plugins: [['@babel/plugin-transform-runtime', { useESModules: true }]],
+    presets: [
+      [
+        '@babel/preset-env',
+        {
+          targets: ['chrome 87', 'safari 13', 'firefox 78', 'edge 88'],
+          useBuiltIns: 'usage',
+          bugfixes: true,
+          loose: false,
+          modules: false,
+          corejs: createRequire(import.meta.url)('core-js/package.json').version,
+          shippedProposals: true,
+          ignoreBrowserslistConfig: true,
+        },
+      ],
+    ],
+    exclude: 'node_modules/**',
+    babelHelpers: 'runtime',
+  });