perf: add eslint import rules, improve the coupling of some components

Author: anncwb

apps/web-antd/src/app.vue

@@ -30,7 +30,10 @@ const tokenTheme = computed(() => {
 </script>
 
 <template>
-  <GlobalProvider>
+  <GlobalProvider
+    :enable-ai-assistant="preferences.app.aiAssistant"
+    :is-mobile="preferences.app.isMobile"
+  >
     <ConfigProvider :locale="antdLocale" :theme="tokenTheme">
       <App>
         <RouterView />

internal/lint-configs/eslint-config/src/custom-config.ts

@@ -1,12 +1,125 @@
 import type { Linter } from 'eslint';
 
+const restrictedImportIgnores = [
+  '**/vite.config.mts',
+  '**/tailwind.config.mjs',
+  '**/postcss.config.mjs',
+];
+
 const customConfig: Linter.FlatConfig[] = [
+  // shadcn-ui 内部组件是自动生成的，这里忽略
   {
     files: ['packages/@core/ui-kit/shadcn-ui/**/**'],
     rules: {
       'vue/require-default-prop': 'off',
     },
   },
+  {
+    // apps内部的一些基础规则
+    files: ['apps/**/**'],
+    ignores: restrictedImportIgnores,
+    rules: {
+      'no-restricted-imports': [
+        'error',
+        {
+          patterns: [
+            {
+              group: ['#/api/*'],
+              message:
+                'The #/api package cannot be imported, please use the @core package itself',
+            },
+            {
+              group: ['#/layouts/*'],
+              message:
+                'The #/layouts package cannot be imported, please use the @core package itself',
+            },
+            {
+              group: ['#/locales/*'],
+              message:
+                'The #/locales package cannot be imported, please use the @core package itself',
+            },
+            {
+              group: ['#/stores/*'],
+              message:
+                'The #/stores package cannot be imported, please use the @core package itself',
+            },
+            {
+              group: ['#/forward/*'],
+              message:
+                'The #/forward package cannot be imported, please use the @core package itself',
+            },
+          ],
+        },
+      ],
+    },
+  },
+  {
+    // @core内部组件，不能引入@vben/* 里面的包
+    files: ['packages/@core/**/**'],
+    ignores: restrictedImportIgnores,
+    rules: {
+      'no-restricted-imports': [
+        'error',
+        {
+          // 如果需要，可以指定禁止特定的子路径
+          patterns: [
+            {
+              group: ['@vben/*'],
+              message:
+                'The @core package cannot import the @vben package, please use the @core package itself',
+            },
+          ],
+        },
+      ],
+    },
+  },
+  {
+    // @core/shared内部组件，不能引入@vben/* 或者 @vben-core/* 里面的包
+    files: ['packages/@core/shared/**/**'],
+    ignores: restrictedImportIgnores,
+    rules: {
+      'no-restricted-imports': [
+        'error',
+        {
+          // 如果需要，可以指定禁止特定的子路径
+          patterns: [
+            {
+              group: ['@vben/*', '@vben-core/*'],
+              message:
+                'The @vben-core/shared package cannot import the @vben package, please use the @core/shared package itself',
+            },
+          ],
+        },
+      ],
+    },
+  },
+  {
+    // 不能引入@vben/*里面的包
+    files: [
+      'packages/types/**/**',
+      'packages/utils/**/**',
+      'packages/icons/**/**',
+      'packages/constants/**/**',
+      'packages/styles/**/**',
+    ],
+    ignores: restrictedImportIgnores,
+    rules: {
+      'no-restricted-imports': [
+        'error',
+        {
+          // 如果需要，可以指定禁止特定的子路径
+          patterns: [
+            {
+              group: ['@vben/*'],
+              message:
+                'The @vben package cannot be imported, please use the @core package itself',
+            },
+          ],
+        },
+      ],
+    },
+  },
+  // 后端模拟代码，不需要太多规则
   {
     files: ['apps/backend-mock/**/**'],
     rules: {

packages/@core/locales/src/i18n.ts

@@ -8,7 +8,6 @@ import { createI18n } from 'vue-i18n';
 
 const loadedLanguages = new Set<string>();
 
-// TODO：import.meta.env，会导致该包依赖外部项目必须是vite才可以
 const i18n = createI18n({
   globalInjection: true,
   legacy: false,

packages/@core/shared/toolkit/src/dom.ts

@@ -1,7 +1,6 @@
 /**
  * 获取元素可见高度
  * @param element
- * @returns
  */
 function getElementVisibleHeight(
   element?: HTMLElement | null | undefined,

packages/@core/shared/typings/vue-router.d.ts

@@ -1,3 +1,4 @@
+/* eslint-disable no-restricted-imports */
 import type { RouteMeta as IRouteMeta } from '@vben-core/typings';
 
 import 'vue-router';

packages/business/widgets/src/global-provider/global-provider.vue

@@ -1,16 +1,22 @@
 <script setup lang="ts">
-import { preferences } from '@vben-core/preferences';
 import { Toaster } from '@vben-core/shadcn-ui';
 
 import { CozeAssistant } from '../coze-assistant';
 
+interface Props {
+  enableAiAssistant?: boolean;
+  isMobile?: boolean;
+}
+
 defineOptions({ name: 'GlobalProvider' });
+
+withDefaults(defineProps<Props>(), {
+  enableAiAssistant: false,
+  isMobile: false,
+});
 </script>
 <template>
   <Toaster />
-  <CozeAssistant
-    v-if="preferences.app.aiAssistant"
-    :is-mobile="preferences.app.isMobile"
-  />
+  <CozeAssistant v-if="enableAiAssistant" :is-mobile="isMobile" />
   <slot></slot>
 </template>

packages/business/widgets/src/global-search/search-panel.vue

@@ -26,7 +26,7 @@ const emit = defineEmits<{ close: [] }>();
 
 const router = useRouter();
 const searchHistory = useLocalStorage<MenuRecordRaw[]>(
-  `__search-history-${import.meta.env.PROD ? 'prod' : 'dev'}__`,
+  `__search-history-${location.hostname}__`,
   [],
 );
 const activeIndex = ref(-1);