style: sort imports (#746)

eslint.config.mjs

@@ -1,28 +1,42 @@
 import antfu from '@antfu/eslint-config'
+import simpleImportSort from 'eslint-plugin-simple-import-sort'
 
-export default antfu({
-  rules: {
-    'vue/max-attributes-per-line': [
-      'error',
-      {
-        singleline: {
-          max: 5,
+export default antfu(
+  {
+    rules: {
+      'vue/max-attributes-per-line': [
+        'error',
+        {
+          singleline: {
+            max: 5,
+          },
+          multiline: {
+            max: 5,
+          },
         },
-        multiline: {
-          max: 5,
-        },
-      },
-    ],
-    'no-alert': 'off',
-    'style/quote-props': 'off',
+      ],
+      'no-alert': 'off',
+      'style/quote-props': 'off',
+    },
+    eslint: {
+      ignorePatterns: [
+        'dist',
+        'node_modules',
+        'public',
+        'extension',
+        'extension-firefox',
+      ],
+    },
   },
-  eslint: {
-    ignorePatterns: [
-      'dist',
-      'node_modules',
-      'public',
-      'extension',
-      'extension-firefox',
-    ],
+  {
+    plugins: {
+      'simple-import-sort': simpleImportSort,
+    },
+    rules: {
+      'import/order': 'off',
+      'sort-imports': 'off',
+      'simple-import-sort/imports': 'error',
+      'simple-import-sort/exports': 'error',
+    },
   },
-})
+)

package.json

@@ -63,6 +63,7 @@
     "cross-env": "^7.0.3",
     "crx": "^5.0.1",
     "eslint": "^9.2.0",
+    "eslint-plugin-simple-import-sort": "^12.1.0",
     "esno": "^4.7.0",
     "fs-extra": "^11.2.0",
     "jsdom": "^24.0.0",

pnpm-lock.yaml

@@ -81,6 +81,9 @@ importers:
       eslint:
         specifier: ^9.2.0
         version: 9.2.0
+      eslint-plugin-simple-import-sort:
+        specifier: ^12.1.0
+        version: 12.1.0(eslint@9.2.0)
       esno:
         specifier: ^4.7.0
         version: 4.7.0
@@ -2367,6 +2370,11 @@ packages:
       vue-eslint-parser:
         optional: true
 
+  eslint-plugin-simple-import-sort@12.1.0:
+    resolution: {integrity: sha512-Y2fqAfC11TcG/WP3TrI1Gi3p3nc8XJyEOJYHyEPEGI/UAgNx6akxxlX74p7SbAQdLcgASKhj8M0GKvH3vq/+ig==}
+    peerDependencies:
+      eslint: '>=5.0.0'
+
   eslint-plugin-toml@0.11.0:
     resolution: {integrity: sha512-sau+YvPU4fWTjB+qtBt3n8WS87aoDCs+BVbSUAemGaIsRNbvR9uEk+Tt892iLHTGvp/DPWYoCX4/8DoyAbB+sQ==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
@@ -7934,6 +7942,10 @@ snapshots:
       - supports-color
       - typescript
 
+  eslint-plugin-simple-import-sort@12.1.0(eslint@9.2.0):
+    dependencies:
+      eslint: 9.2.0
+
   eslint-plugin-toml@0.11.0(eslint@9.2.0):
     dependencies:
       debug: 4.3.4

scripts/client.ts

@@ -1,6 +1,6 @@
 import type { ErrorPayload, HMRPayload, Update } from 'vite'
-import type { ViteHotContext } from 'vite/types/hot'
 import type { InferCustomEventPayload } from 'vite/types/customEvent'
+import type { ViteHotContext } from 'vite/types/hot'
 
 // Vite v3 doesn't export overlay
 // import { ErrorOverlay, overlayId } from 'vite/src/client/overlay'

scripts/manifest.ts

@@ -1,4 +1,5 @@
 import fs from 'fs-extra'
+
 import { getManifest } from '../src/manifest'
 import { isFirefox, log, r } from './utils'
 

scripts/prepare.ts

@@ -1,7 +1,9 @@
 // generate stub index.html files for dev entry
 import { execSync } from 'node:child_process'
-import fs from 'fs-extra'
+
 import chokidar from 'chokidar'
+import fs from 'fs-extra'
+
 import { isDev, isFirefox, log, r } from './utils'
 
 /**

scripts/utils.ts

@@ -1,6 +1,7 @@
 import { dirname, resolve } from 'node:path'
 import process from 'node:process'
 import { fileURLToPath } from 'node:url'
+
 import { bgCyan, black } from 'kolorist'
 
 export const port = Number.parseInt(process.env.PORT || '') || 3303

src/background/index.ts

@@ -1,4 +1,5 @@
 import browser from 'webextension-polyfill'
+
 import { setupAllMsgLstnrs } from './messageListeners'
 
 browser.runtime.onInstalled.addListener((): void => {

src/background/messageListeners/index.ts

@@ -1,10 +1,10 @@
 import browser from 'webextension-polyfill'
-import { apiListenerFactory } from '../utils'
 
-import API_AUTH from './auth'
+import { apiListenerFactory } from '../utils'
 import API_ANIME from './anime'
-import API_HISTORY from './history'
+import API_AUTH from './auth'
 import API_FAVORITE from './favorite'
+import API_HISTORY from './history'
 import API_MOMENT from './moment'
 import API_NOTIFICATION from './notification'
 import API_RANKING from './ranking'

src/background/utils.ts

@@ -119,14 +119,14 @@ function apiListenerFactory(API_MAP: APIMAP) {
 }
 
 export {
-  type FetchAfterHandler,
-  toJsonHandler,
-  toData,
-  sendResponseHandler,
-  AHS,
-  type Message,
   type _FETCH,
+  AHS,
   type API,
-  type APIMAP,
   apiListenerFactory,
+  type APIMAP,
+  type FetchAfterHandler,
+  type Message,
+  sendResponseHandler,
+  toData,
+  toJsonHandler,
 }

src/components/Dialog.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { onKeyStroke } from '@vueuse/core'
+
 import Button from '~/components/Button.vue'
 import { useBewlyApp } from '~/composables/useAppProvider'
 

src/components/Dock/Dock.vue

@@ -1,11 +1,12 @@
 <script setup lang="ts">
-import Tooltip from '../Tooltip.vue'
-import type { HoveringDockItem } from './types'
+import { useDark } from '~/composables/useDark'
 import { AppPage } from '~/enums/appEnums'
 import { settings } from '~/logic'
 import type { DockItem } from '~/stores/mainStore'
 import { useMainStore } from '~/stores/mainStore'
-import { useDark } from '~/composables/useDark'
+
+import Tooltip from '../Tooltip.vue'
+import type { HoveringDockItem } from './types'
 
 defineProps<{ activatedPage: AppPage }>()
 

src/components/HorizontalScrollView.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { Ref } from 'vue'
+
 import { settings } from '~/logic'
 
 const scrollListWrap = ref<HTMLElement>() as Ref<HTMLElement>

src/components/LongCoverCard/LongCoverCard.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { removeHttpFromUrl } from '~/utils/main'
 import { numFormatter } from '~/utils/dataFormatter'
+import { removeHttpFromUrl } from '~/utils/main'
 
 defineProps<{
   url: string

src/components/RightSideButtons/RightSideButtons.vue

@@ -1,8 +1,9 @@
 <script setup lang="ts">
+import Button from '~/components/Button.vue'
+import { useDark } from '~/composables/useDark'
+
 import Tooltip from '../Tooltip.vue'
 import type { HoveringDockItem } from './types'
-import { useDark } from '~/composables/useDark'
-import Button from '~/components/Button.vue'
 
 const emit = defineEmits(['settings-visibility-change'])
 const { isDark, toggleDark } = useDark()

src/components/SearchBar/SearchBar.vue

@@ -1,5 +1,10 @@
 <script setup lang="ts">
 import { onKeyStroke } from '@vueuse/core'
+
+import { useApiClient } from '~/composables/api'
+import { useBewlyImage } from '~/composables/useImage'
+import { findLeafActiveElement } from '~/utils/element'
+
 import type { HistoryItem, SuggestionItem, SuggestionResponse } from './searchHistoryProvider'
 import {
   addSearchHistory,
@@ -7,9 +12,6 @@ import {
   getSearchHistory,
   removeSearchHistory,
 } from './searchHistoryProvider'
-import { useApiClient } from '~/composables/api'
-import { findLeafActiveElement } from '~/utils/element'
-import { useBewlyImage } from '~/composables/useImage'
 
 defineProps<{
   darkenOnFocus?: boolean

src/components/Settings/Settings.vue

@@ -1,10 +1,11 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
-import OverlayScrollbarsComponent from '../OverlayScrollbarsComponent'
 
+import { settings } from '~/logic'
+
+import OverlayScrollbarsComponent from '../OverlayScrollbarsComponent'
 import type { MenuItem } from './types'
 import { MenuType } from './types'
-import { settings } from '~/logic'
 
 const emit = defineEmits(['close'])
 

src/components/Settings/components/About.vue

@@ -1,10 +1,12 @@
 <script setup lang="ts">
 import browser from 'webextension-polyfill'
-import { version } from '../../../../package.json'
+
 import Button from '~/components/Button.vue'
 import Dialog from '~/components/Dialog.vue'
-import { settings } from '~/logic'
 import Tooltip from '~/components/Tooltip.vue'
+import { settings } from '~/logic'
+
+import { version } from '../../../../package.json'
 
 const importSettingsRef = ref<HTMLElement>()
 const dialogVisible = reactive({

src/components/Settings/components/Appearance.vue

@@ -1,14 +1,16 @@
 <script lang="ts" setup>
 import { useI18n } from 'vue-i18n'
-import SettingsItem from './SettingsItem.vue'
-import SettingsItemGroup from './SettingsItemGroup.vue'
-import { settings } from '~/logic'
+
 import Input from '~/components/Input.vue'
 import Radio from '~/components/Radio.vue'
 import Select from '~/components/Select.vue'
 import Slider from '~/components/Slider.vue'
 import Tooltip from '~/components/Tooltip.vue'
 import { useBewlyImage } from '~/composables/useImage'
+import { settings } from '~/logic'
+
+import SettingsItem from './SettingsItem.vue'
+import SettingsItemGroup from './SettingsItemGroup.vue'
 
 const { wallpapers, getBewlyImage } = useBewlyImage()
 

src/components/Settings/components/Compatibility.vue

@@ -1,9 +1,10 @@
 <script lang="ts" setup>
-import SettingsItem from './SettingsItem.vue'
-import SettingsItemGroup from './SettingsItemGroup.vue'
+import Radio from '~/components/Radio.vue'
 import { settings } from '~/logic'
 import { isHomePage } from '~/utils/main'
-import Radio from '~/components/Radio.vue'
+
+import SettingsItem from './SettingsItem.vue'
+import SettingsItemGroup from './SettingsItemGroup.vue'
 
 watch(() => settings.value.useOriginalBilibiliHomepage, () => {
   if (isHomePage())

src/components/Settings/components/General.vue

@@ -1,14 +1,16 @@
 <script lang="ts" setup>
 import { useI18n } from 'vue-i18n'
 import draggable from 'vuedraggable'
-import SettingsItem from './SettingsItem.vue'
-import SettingsItemGroup from './SettingsItemGroup.vue'
+
 import Button from '~/components/Button.vue'
 import Radio from '~/components/Radio.vue'
 import Select from '~/components/Select.vue'
 import { settings } from '~/logic'
 import { useMainStore } from '~/stores/mainStore'
 
+import SettingsItem from './SettingsItem.vue'
+import SettingsItemGroup from './SettingsItemGroup.vue'
+
 const mainStore = useMainStore()
 const { t, locale } = useI18n()
 

src/components/Settings/components/Home.vue

@@ -1,17 +1,19 @@
 <script lang="ts" setup>
-import type { Ref } from 'vue'
 import QRCodeVue from 'qrcode.vue'
+import type { Ref } from 'vue'
 import { useToast } from 'vue-toastification'
 import draggable from 'vuedraggable'
-import SearchPage from './SearchPage.vue'
-import ChildSettingsDialog from './ChildSettingsDialog.vue'
-import SettingsItem from './SettingsItem.vue'
-import SettingsItemGroup from './SettingsItemGroup.vue'
-import { getTVLoginQRCode, pollTVLoginQRCode, revokeAccessKey } from '~/utils/authProvider'
-import { accessKey, settings } from '~/logic'
-import { useMainStore } from '~/stores/mainStore'
+
 import Button from '~/components/Button.vue'
 import Radio from '~/components/Radio.vue'
+import { accessKey, settings } from '~/logic'
+import { useMainStore } from '~/stores/mainStore'
+import { getTVLoginQRCode, pollTVLoginQRCode, revokeAccessKey } from '~/utils/authProvider'
+
+import ChildSettingsDialog from './ChildSettingsDialog.vue'
+import SearchPage from './SearchPage.vue'
+import SettingsItem from './SettingsItem.vue'
+import SettingsItemGroup from './SettingsItemGroup.vue'
 
 const mainStore = useMainStore()
 const toast = useToast()

src/components/Settings/components/SearchPage.vue

@@ -1,12 +1,13 @@
 <script lang="ts" setup>
-import SettingsItem from './SettingsItem.vue'
-import SettingsItemGroup from './SettingsItemGroup.vue'
-import { settings } from '~/logic'
 import Input from '~/components/Input.vue'
 import Radio from '~/components/Radio.vue'
 import Slider from '~/components/Slider.vue'
 import Tooltip from '~/components/Tooltip.vue'
 import { useBewlyImage } from '~/composables/useImage'
+import { settings } from '~/logic'
+
+import SettingsItem from './SettingsItem.vue'
+import SettingsItemGroup from './SettingsItemGroup.vue'
 
 const { searchBarCharacters, wallpapers, getBewlyImage } = useBewlyImage()
 

src/components/TopBar/TopBar.vue

@@ -1,10 +1,16 @@
 <script setup lang="ts">
+import { useMouseInElement } from '@vueuse/core'
 import type { Ref, UnwrapNestedRefs } from 'vue'
 import { onMounted, watch } from 'vue'
-import { useMouseInElement } from '@vueuse/core'
+
+import { useApiClient } from '~/composables/api'
+import { useBewlyApp } from '~/composables/useAppProvider'
+import { useDelayedHover } from '~/composables/useDelayedHover'
+import { settings } from '~/logic'
+import { getUserID, isHomePage } from '~/utils/main'
+import emitter from '~/utils/mitt'
+
 import SearchBar from '../SearchBar/SearchBar.vue'
-import type { UnReadDm, UnReadMessage, UserInfo } from './types'
-import { updateInterval } from './notify'
 import ChannelsPop from './components/ChannelsPop.vue'
 import FavoritesPop from './components/FavoritesPop.vue'
 import HistoryPop from './components/HistoryPop.vue'
@@ -14,12 +20,8 @@ import NotificationsPop from './components/NotificationsPop.vue'
 import UploadPop from './components/UploadPop.vue'
 import UserPanelPop from './components/UserPanelPop.vue'
 import WatchLaterPop from './components/WatchLaterPop.vue'
-import { getUserID, isHomePage } from '~/utils/main'
-import { settings } from '~/logic'
-import emitter from '~/utils/mitt'
-import { useBewlyApp } from '~/composables/useAppProvider'
-import { useApiClient } from '~/composables/api'
-import { useDelayedHover } from '~/composables/useDelayedHover'
+import { updateInterval } from './notify'
+import type { UnReadDm, UnReadMessage, UserInfo } from './types'
 
 // import { useTopBarStore } from '~/stores/topBarStore'
 

src/components/TopBar/components/ChannelsPop.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
+
 import { isHomePage } from '~/utils/main'
 
 const { t } = useI18n()

src/components/TopBar/components/FavoritesPop.vue

@@ -1,12 +1,14 @@
 <script setup lang="ts">
 import type { Ref } from 'vue'
 import { onMounted, reactive, ref, watch } from 'vue'
-import type { FavoriteCategory, FavoriteResource } from '../types'
-import { getUserID, isHomePage, removeHttpFromUrl, smoothScrollToTop } from '~/utils/main'
-import { calcCurrentTime } from '~/utils/dataFormatter'
+
 import Empty from '~/components/Empty.vue'
 import Loading from '~/components/Loading.vue'
 import { useApiClient } from '~/composables/api'
+import { calcCurrentTime } from '~/utils/dataFormatter'
+import { getUserID, isHomePage, removeHttpFromUrl, smoothScrollToTop } from '~/utils/main'
+
+import type { FavoriteCategory, FavoriteResource } from '../types'
 
 const api = useApiClient()
 

src/components/TopBar/components/HistoryPop.vue

@@ -1,16 +1,17 @@
 <script setup lang="ts">
-import { useI18n } from 'vue-i18n'
+import { useDateFormat } from '@vueuse/core'
 import type { Ref } from 'vue'
 import { onMounted, reactive, ref, watch } from 'vue'
-import { useDateFormat } from '@vueuse/core'
-import { isHomePage, removeHttpFromUrl, smoothScrollToTop } from '~/utils/main'
-import { calcCurrentTime } from '~/utils/dataFormatter'
-import { Business } from '~/models/history/history'
-import type { List as HistoryItem, HistoryResult } from '~/models/history/history'
+import { useI18n } from 'vue-i18n'
+
 import Empty from '~/components/Empty.vue'
 import Loading from '~/components/Loading.vue'
 import Progress from '~/components/Progress.vue'
 import { useApiClient } from '~/composables/api'
+import type { HistoryResult, List as HistoryItem } from '~/models/history/history'
+import { Business } from '~/models/history/history'
+import { calcCurrentTime } from '~/utils/dataFormatter'
+import { isHomePage, removeHttpFromUrl, smoothScrollToTop } from '~/utils/main'
 
 const { t } = useI18n()
 const api = useApiClient()

src/components/TopBar/components/MomentsPop.vue

@@ -1,13 +1,14 @@
 <script setup lang="ts">
-import { useI18n } from 'vue-i18n'
 import { onMounted, reactive, ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+
 import Empty from '~/components/Empty.vue'
 import Loading from '~/components/Loading.vue'
-import type { TopBarMomentResult } from '~/models/moment/topBarMoment'
-import type { TopBarLiveMomentResult } from '~/models/moment/topBarLiveMoment'
-import { getCSRF, isHomePage, smoothScrollToTop } from '~/utils/main'
 import Tooltip from '~/components/Tooltip.vue'
 import { useApiClient } from '~/composables/api'
+import type { TopBarLiveMomentResult } from '~/models/moment/topBarLiveMoment'
+import type { TopBarMomentResult } from '~/models/moment/topBarMoment'
+import { getCSRF, isHomePage, smoothScrollToTop } from '~/utils/main'
 
 type MomentType = 'video' | 'live' | 'article'
 interface MomentTab { type: MomentType, name: any }

src/components/TopBar/components/MorePop.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
+
 import { getUserID, isHomePage } from '~/utils/main'
 
 const { t } = useI18n()

src/components/TopBar/components/NotificationsPop.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
-import { isHomePage } from '~/utils/main'
+
 import { useApiClient } from '~/composables/api'
+import { isHomePage } from '~/utils/main'
 
 const { t } = useI18n()
 const api = useApiClient()

src/components/TopBar/components/UserPanelPop.vue

@@ -1,10 +1,12 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
-import type { UserInfo, UserStat } from '../types'
-import { revokeAccessKey } from '~/utils/authProvider'
-import { getCSRF, getUserID, isHomePage } from '~/utils/main'
-import { numFormatter } from '~/utils/dataFormatter'
+
 import { useApiClient } from '~/composables/api'
+import { revokeAccessKey } from '~/utils/authProvider'
+import { numFormatter } from '~/utils/dataFormatter'
+import { getCSRF, getUserID, isHomePage } from '~/utils/main'
+
+import type { UserInfo, UserStat } from '../types'
 
 defineProps<{
   userInfo: UserInfo

src/components/TopBar/components/WatchLaterPop.vue

@@ -1,12 +1,13 @@
 <script setup lang="ts">
 import { onMounted, reactive, ref } from 'vue'
-import { calcCurrentTime } from '~/utils/dataFormatter'
-import type { List as VideoItem, WatchLaterResult } from '~/models/video/watchLater'
-import { isHomePage, removeHttpFromUrl } from '~/utils/main'
+
 import Empty from '~/components/Empty.vue'
 import Loading from '~/components/Loading.vue'
 import Progress from '~/components/Progress.vue'
 import { useApiClient } from '~/composables/api'
+import type { List as VideoItem, WatchLaterResult } from '~/models/video/watchLater'
+import { calcCurrentTime } from '~/utils/dataFormatter'
+import { isHomePage, removeHttpFromUrl } from '~/utils/main'
 
 const api = useApiClient()
 const watchLaterList = reactive<VideoItem[]>([])

src/components/VideoCard/VideoCard.vue

@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import Tooltip from '../Tooltip.vue'
 import Button from '~/components/Button.vue'
 import { useApiClient } from '~/composables/api'
 import { settings } from '~/logic'
@@ -7,6 +6,8 @@ import type { VideoPreviewResult } from '~/models/video/videoPreview'
 import { calcCurrentTime, calcTimeSince, numFormatter } from '~/utils/dataFormatter'
 import { getCSRF, removeHttpFromUrl } from '~/utils/main'
 
+import Tooltip from '../Tooltip.vue'
+
 interface Props {
   id: number
   duration?: number

src/composables/useAppProvider.ts

@@ -1,4 +1,5 @@
 import type { Ref } from 'vue'
+
 import type { AppPage } from '~/enums/appEnums'
 
 export interface BewlyAppProvider {

src/composables/useDark.ts

@@ -1,4 +1,5 @@
 import { usePreferredDark } from '@vueuse/core'
+
 import { settings } from '~/logic'
 
 export function useDark() {

src/composables/useStorageLocal.ts

@@ -1,4 +1,3 @@
-import { storage } from 'webextension-polyfill'
 import type {
   MaybeRef,
   RemovableRef,
@@ -8,6 +7,7 @@ import type {
 import {
   useStorageAsync,
 } from '@vueuse/core'
+import { storage } from 'webextension-polyfill'
 
 const storageLocal: StorageLikeAsync = {
   removeItem(key: string) {

src/contentScripts/index.ts

@@ -1,15 +1,16 @@
-import { createApp } from 'vue'
-
 import 'uno.css'
 import '~/styles'
-import App from './views/App.vue'
-import { setupApp } from '~/logic/common-setup'
-import { SVG_ICONS } from '~/utils/svgIcons'
-import { injectCSS, isHomePage } from '~/utils/main'
-import { settings } from '~/logic'
 
-import { runWhenIdle } from '~/utils/lazyLoad'
+import { createApp } from 'vue'
+
 import { useDark } from '~/composables/useDark'
+import { settings } from '~/logic'
+import { setupApp } from '~/logic/common-setup'
+import { runWhenIdle } from '~/utils/lazyLoad'
+import { injectCSS, isHomePage } from '~/utils/main'
+import { SVG_ICONS } from '~/utils/svgIcons'
+
+import App from './views/App.vue'
 
 const isFirefox: boolean = /Firefox/i.test(navigator.userAgent)
 

src/contentScripts/views/Anime/Anime.vue

@@ -1,10 +1,4 @@
 <script setup lang="ts">
-import AnimeTimeTable from './components/AnimeTimeTable.vue'
-import { getUserID, openLinkToNewTab } from '~/utils/main'
-import { numFormatter } from '~/utils/dataFormatter'
-import type { List as WatchListItem, WatchListResult } from '~/models/anime/watchList'
-import type { List as PopularAnimeItem, PopularAnimeResult } from '~/models/anime/popular'
-import type { ItemSubItem as RecommendationItem, RecommendationResult } from '~/models/anime/recommendation'
 import Button from '~/components/Button.vue'
 import Empty from '~/components/Empty.vue'
 import HorizontalScrollView from '~/components/HorizontalScrollView.vue'
@@ -12,6 +6,13 @@ import LongCoverCard from '~/components/LongCoverCard/LongCoverCard.vue'
 import LongCoverCardSkeleton from '~/components/LongCoverCard/LongCoverCardSkeleton.vue'
 import { useApiClient } from '~/composables/api'
 import { useBewlyApp } from '~/composables/useAppProvider'
+import type { List as PopularAnimeItem, PopularAnimeResult } from '~/models/anime/popular'
+import type { ItemSubItem as RecommendationItem, RecommendationResult } from '~/models/anime/recommendation'
+import type { List as WatchListItem, WatchListResult } from '~/models/anime/watchList'
+import { numFormatter } from '~/utils/dataFormatter'
+import { getUserID, openLinkToNewTab } from '~/utils/main'
+
+import AnimeTimeTable from './components/AnimeTimeTable.vue'
 
 const api = useApiClient()
 const animeWatchList = reactive<WatchListItem[]>([])

src/contentScripts/views/Anime/components/AnimeTimeTable.vue

@@ -2,10 +2,11 @@
 import type { Ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import browser from 'webextension-polyfill'
-import { removeHttpFromUrl } from '~/utils/main'
-import type { Result as TimetableItem, TimetableResult } from '~/models/anime/timeTable'
+
 import HorizontalScrollView from '~/components/HorizontalScrollView.vue'
 import { useApiClient } from '~/composables/api'
+import type { Result as TimetableItem, TimetableResult } from '~/models/anime/timeTable'
+import { removeHttpFromUrl } from '~/utils/main'
 
 const { t } = useI18n()
 const api = useApiClient()

src/contentScripts/views/App.vue

@@ -3,6 +3,7 @@ import { useDebounceFn, useThrottleFn, useToggle } from '@vueuse/core'
 import type { Ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import browser from 'webextension-polyfill'
+
 import AppBackground from '~/components/AppBackground.vue'
 import BackToTopAndRefreshButtons from '~/components/BackToTopAndRefreshButtons.vue'
 import Dock from '~/components/Dock/Dock.vue'

src/contentScripts/views/Favorites/Favorites.vue

@@ -1,20 +1,21 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
-import { getCSRF, getUserID, openLinkToNewTab, removeHttpFromUrl } from '~/utils/main'
-import type { FavoriteCategory, FavoriteResource } from '~/components/TopBar/types'
-import emitter from '~/utils/mitt'
-import { settings } from '~/logic'
-import type { Media as FavoriteItem, FavoritesResult } from '~/models/video/favorite'
-import type { List as CategoryItem, FavoritesCategoryResult } from '~/models/video/favoriteCategory'
+
 import Button from '~/components/Button.vue'
 import Empty from '~/components/Empty.vue'
 import Input from '~/components/Input.vue'
 import Loading from '~/components/Loading.vue'
 import Select from '~/components/Select.vue'
 import Tooltip from '~/components/Tooltip.vue'
+import type { FavoriteCategory, FavoriteResource } from '~/components/TopBar/types'
 import VideoCard from '~/components/VideoCard/VideoCard.vue'
 import { useApiClient } from '~/composables/api'
 import { useBewlyApp } from '~/composables/useAppProvider'
+import { settings } from '~/logic'
+import type { FavoritesResult, Media as FavoriteItem } from '~/models/video/favorite'
+import type { FavoritesCategoryResult, List as CategoryItem } from '~/models/video/favoriteCategory'
+import { getCSRF, getUserID, openLinkToNewTab, removeHttpFromUrl } from '~/utils/main'
+import emitter from '~/utils/mitt'
 
 const { t } = useI18n()
 const api = useApiClient()

src/contentScripts/views/History/History.vue

@@ -1,16 +1,17 @@
 <script setup lang="ts">
 import { useDateFormat } from '@vueuse/core'
 import { useI18n } from 'vue-i18n'
+
 import Button from '~/components/Button.vue'
-import { getCSRF, removeHttpFromUrl } from '~/utils/main'
-import { calcCurrentTime } from '~/utils/dataFormatter'
-import { Business } from '~/models/history/history'
-import type { List as HistoryItem, HistoryResult } from '~/models/history/history'
-import type { List as HistorySearchItem, HistorySearchResult } from '~/models/video/historySearch'
 import Empty from '~/components/Empty.vue'
 import Progress from '~/components/Progress.vue'
 import { useApiClient } from '~/composables/api'
 import { useBewlyApp } from '~/composables/useAppProvider'
+import type { HistoryResult, List as HistoryItem } from '~/models/history/history'
+import { Business } from '~/models/history/history'
+import type { HistorySearchResult, List as HistorySearchItem } from '~/models/video/historySearch'
+import { calcCurrentTime } from '~/utils/dataFormatter'
+import { getCSRF, removeHttpFromUrl } from '~/utils/main'
 
 const { t } = useI18n()
 const api = useApiClient()

src/contentScripts/views/Home/Home.vue

@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import type { GridLayoutIcon } from './types'
-import { HomeSubPage } from './types'
 import Logo from '~/components/Logo.vue'
 import SearchBar from '~/components/SearchBar/SearchBar.vue'
 import { useBewlyApp } from '~/composables/useAppProvider'
@@ -11,6 +9,9 @@ import { useMainStore } from '~/stores/mainStore'
 import { delay } from '~/utils/main'
 import emitter from '~/utils/mitt'
 
+import type { GridLayoutIcon } from './types'
+import { HomeSubPage } from './types'
+
 const mainStore = useMainStore()
 const { handleBackToTop, scrollbarRef } = useBewlyApp()
 const { getBewlyImage } = useBewlyImage()

src/contentScripts/views/Home/components/Following.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import type { Ref } from 'vue'
-import type { GridLayout } from '~/logic'
-import type { DataItem as MomentItem, MomentResult } from '~/models/moment/moment'
+
 import Button from '~/components/Button.vue'
 import Empty from '~/components/Empty.vue'
 import Loading from '~/components/Loading.vue'
@@ -9,6 +8,8 @@ import VideoCard from '~/components/VideoCard/VideoCard.vue'
 import VideoCardSkeleton from '~/components/VideoCard/VideoCardSkeleton.vue'
 import { useApiClient } from '~/composables/api'
 import { useBewlyApp } from '~/composables/useAppProvider'
+import type { GridLayout } from '~/logic'
+import type { DataItem as MomentItem, MomentResult } from '~/models/moment/moment'
 
 const props = defineProps<{
   gridLayout: GridLayout

src/contentScripts/views/Home/components/ForYou.vue

@@ -1,15 +1,8 @@
 <script setup lang="ts">
-import type { Ref } from 'vue'
 import { onKeyStroke } from '@vueuse/core'
+import type { Ref } from 'vue'
 import { useToast } from 'vue-toastification'
-import { Type as ThreePointV2Type } from '~/models/video/appForYou'
-import type { AppForYouResult, Item as AppVideoItem, ThreePointV2 } from '~/models/video/appForYou'
-import type { Item as VideoItem, forYouResult } from '~/models/video/forYou'
-import type { GridLayout } from '~/logic'
-import { accessKey, settings } from '~/logic'
-import { LanguageType } from '~/enums/appEnums'
-import { TVAppKey, getTvSign } from '~/utils/authProvider'
-import { isVerticalVideo } from '~/utils/uriParse'
+
 import Button from '~/components/Button.vue'
 import Dialog from '~/components/Dialog.vue'
 import Empty from '~/components/Empty.vue'
@@ -18,6 +11,14 @@ import VideoCard from '~/components/VideoCard/VideoCard.vue'
 import VideoCardSkeleton from '~/components/VideoCard/VideoCardSkeleton.vue'
 import { useApiClient } from '~/composables/api'
 import { useBewlyApp } from '~/composables/useAppProvider'
+import { LanguageType } from '~/enums/appEnums'
+import type { GridLayout } from '~/logic'
+import { accessKey, settings } from '~/logic'
+import type { AppForYouResult, Item as AppVideoItem, ThreePointV2 } from '~/models/video/appForYou'
+import { Type as ThreePointV2Type } from '~/models/video/appForYou'
+import type { forYouResult, Item as VideoItem } from '~/models/video/forYou'
+import { getTvSign, TVAppKey } from '~/utils/authProvider'
+import { isVerticalVideo } from '~/utils/uriParse'
 
 const props = defineProps<{
   gridLayout: GridLayout

src/contentScripts/views/Home/components/Ranking.vue

@@ -1,18 +1,20 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
-import type { RankingType } from '../types'
-import type { RankingResult, List as RankingVideoItem } from '~/models/video/ranking'
-import type { List as RankingPgcItem, RankingPgcResult } from '~/models/video/rankingPgc'
-import type { GridLayout } from '~/logic'
-import { settings } from '~/logic'
-import emitter from '~/utils/mitt'
+
 import LongCoverCard from '~/components/LongCoverCard/LongCoverCard.vue'
 import LongCoverCardSkeleton from '~/components/LongCoverCard/LongCoverCardSkeleton.vue'
 import OverlayScrollbarsComponent from '~/components/OverlayScrollbarsComponent'
 import VideoCard from '~/components/VideoCard/VideoCard.vue'
 import VideoCardSkeleton from '~/components/VideoCard/VideoCardSkeleton.vue'
-import { useBewlyApp } from '~/composables/useAppProvider'
 import { useApiClient } from '~/composables/api'
+import { useBewlyApp } from '~/composables/useAppProvider'
+import type { GridLayout } from '~/logic'
+import { settings } from '~/logic'
+import type { List as RankingVideoItem, RankingResult } from '~/models/video/ranking'
+import type { List as RankingPgcItem, RankingPgcResult } from '~/models/video/rankingPgc'
+import emitter from '~/utils/mitt'
+
+import type { RankingType } from '../types'
 
 const props = defineProps<{
   gridLayout: GridLayout

src/contentScripts/views/Home/components/SubscribedSeries.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import type { Ref } from 'vue'
-import type { GridLayout } from '~/logic'
-import type { DataItem as MomentItem, MomentResult } from '~/models/moment/moment'
+
 import Button from '~/components/Button.vue'
 import Empty from '~/components/Empty.vue'
 import Loading from '~/components/Loading.vue'
@@ -9,6 +8,8 @@ import VideoCard from '~/components/VideoCard/VideoCard.vue'
 import VideoCardSkeleton from '~/components/VideoCard/VideoCardSkeleton.vue'
 import { useApiClient } from '~/composables/api'
 import { useBewlyApp } from '~/composables/useAppProvider'
+import type { GridLayout } from '~/logic'
+import type { DataItem as MomentItem, MomentResult } from '~/models/moment/moment'
 
 const props = defineProps<{
   gridLayout: GridLayout

src/contentScripts/views/Home/components/Trending.vue

@@ -1,12 +1,13 @@
 <script setup lang="ts">
 import type { Ref } from 'vue'
-import type { GridLayout } from '~/logic'
-import type { TrendingResult, List as VideoItem } from '~/models/video/trending'
+
 import Loading from '~/components/Loading.vue'
 import VideoCard from '~/components/VideoCard/VideoCard.vue'
 import VideoCardSkeleton from '~/components/VideoCard/VideoCardSkeleton.vue'
 import { useApiClient } from '~/composables/api'
 import { useBewlyApp } from '~/composables/useAppProvider'
+import type { GridLayout } from '~/logic'
+import type { List as VideoItem, TrendingResult } from '~/models/video/trending'
 
 const props = defineProps<{
   gridLayout: GridLayout

src/contentScripts/views/Search/Search.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
-import { settings } from '~/logic'
 import Logo from '~/components/Logo.vue'
 import SearchBar from '~/components/SearchBar/SearchBar.vue'
+import { settings } from '~/logic'
 </script>
 
 <template>

src/contentScripts/views/WatchLater/WatchLater.vue

@@ -1,14 +1,15 @@
 <script setup lang="ts">
 import { useDateFormat } from '@vueuse/core'
 import { useI18n } from 'vue-i18n'
-import { getCSRF, openLinkToNewTab, removeHttpFromUrl } from '~/utils/main'
-import { calcCurrentTime } from '~/utils/dataFormatter'
-import type { List as VideoItem, WatchLaterResult } from '~/models/video/watchLater'
+
 import Button from '~/components/Button.vue'
 import Empty from '~/components/Empty.vue'
 import Progress from '~/components/Progress.vue'
 import { useApiClient } from '~/composables/api'
 import { useBewlyApp } from '~/composables/useAppProvider'
+import type { List as VideoItem, WatchLaterResult } from '~/models/video/watchLater'
+import { calcCurrentTime } from '~/utils/dataFormatter'
+import { getCSRF, openLinkToNewTab, removeHttpFromUrl } from '~/utils/main'
 
 const { t } = useI18n()
 const api = useApiClient()

src/logic/common-setup.ts

@@ -1,10 +1,12 @@
-import type { App } from 'vue'
-import { getCurrentContext } from 'webext-bridge'
-import Toast, { POSITION } from 'vue-toastification'
-import { createPinia } from 'pinia'
-import { i18n } from '~/utils/i18n'
 import 'vue-toastification/dist/index.css'
 
+import { createPinia } from 'pinia'
+import type { App } from 'vue'
+import Toast, { POSITION } from 'vue-toastification'
+import { getCurrentContext } from 'webext-bridge'
+
+import { i18n } from '~/utils/i18n'
+
 const pinia = createPinia()
 
 export async function setupApp(app: App) {

src/logic/storage.ts

@@ -1,6 +1,6 @@
 import { useStorageLocal } from '~/composables/useStorageLocal'
-import type { AppPage } from '~/enums/appEnums'
 import type { HomeSubPage } from '~/contentScripts/views/Home/types'
+import type { AppPage } from '~/enums/appEnums'
 
 // TODO: refactor: implement storage functionality using pinia + useStorageLocal()
 

src/manifest.ts

@@ -1,5 +1,6 @@
 import fs from 'fs-extra'
 import type { Manifest } from 'webextension-polyfill'
+
 import type PkgType from '../package.json'
 import { isDev, isFirefox, port, r } from '../scripts/utils'
 

src/options/main.ts

@@ -1,6 +1,8 @@
-import { createApp } from 'vue'
-import App from './Options.vue'
 import '../styles'
 
+import { createApp } from 'vue'
+
+import App from './Options.vue'
+
 const app = createApp(App)
 app.mount('#app')

src/popup/Popup.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { storageDemo } from '~/logic/storage'
 import Logo from '~/components/Logo.vue'
+import { storageDemo } from '~/logic/storage'
 
 function openOptionsPage() {
   browser.runtime.openOptionsPage()

src/popup/main.ts

@@ -1,6 +1,8 @@
-import { createApp } from 'vue'
-import App from './Popup.vue'
 import '../styles'
 
+import { createApp } from 'vue'
+
+import App from './Popup.vue'
+
 const app = createApp(App)
 app.mount('#app')

src/stores/mainStore.ts

@@ -1,4 +1,5 @@
 import { defineStore } from 'pinia'
+
 import { HomeSubPage } from '~/contentScripts/views/Home/types'
 import { AppPage } from '~/enums/appEnums'
 

src/stores/topBarStore.ts

@@ -1,4 +1,5 @@
 import { defineStore } from 'pinia'
+
 import type { AppPage } from '~/enums/appEnums'
 import { TopBarPopup } from '~/enums/appEnums'
 import { getUserID } from '~/utils/main'

src/styles/adaptedStyles/index.ts

@@ -5,6 +5,7 @@ import './modal.scss'
 import './btn.scss'
 import './userCard.scss'
 import './videoPlayer.scss'
+
 import { isHomePage } from '~/utils/main'
 
 async function setupStyles() {

src/tests/uriParse.spec.ts

@@ -1,4 +1,5 @@
 import { expect, it } from 'vitest'
+
 import { isVerticalVideo, parseBilibiliUri } from '~/utils/uriParse'
 
 const uri = 'bilibili://video/1053268502?cid=1511056422&player_height=1080&player_preload=%7B%22expire_time%22%3A1713852338%2C%22cid%22%3A1511056422%2C%22quality%22%3A16%2C%22file_info%22%3A%7B%2216%22%3A%7B%22infos%22%3A%5B%7B%22filesize%22%3A1498511%2C%22timelength%22%3A133143%7D%5D%7D%2C%2264%22%3A%7B%22infos%22%3A%5B%7B%22filesize%22%3A3624796%2C%22timelength%22%3A133074%7D%5D%7D%7D%2C%22video_codecid%22%3A7%2C%22video_project%22%3Atrue%2C%22url%22%3A%22http%3A%2F%2Fupos-sz-mirror08h.bilivideo.com%2Fupgcxcode%2F22%2F64%2F1511056422%2F1511056422-1-16.mp4%3Fe%3Dig8euxZM2rNcNbRVhwdVhwdlhWdVhwdVhoNvNC8BqJIzNbfqXBvEuENvNC8aNEVEtEvE9IMvXBvE2ENvNCImNEVEIj0Y2J_aug859r1qXg8gNEVE5XREto8z5JZC2X2gkX5L5F1eTX1jkXlsTXHeux_f2o859IB_%5Cu0026uipk%3D5%5Cu0026nbs%3D1%5Cu0026deadline%3D1713855938%5Cu0026gen%3Dplayurlv2%5Cu0026os%3D08hbv%5Cu0026oi%3D1744363898%5Cu0026trid%3D982a81d34ec344f8a79f645c8973f533U%5Cu0026mid%3D223973299%5Cu0026platform%3Dipad%5Cu0026upsig%3D679618b920edd60df22058962747c2a0%5Cu0026uparams%3De%2Cuipk%2Cnbs%2Cdeadline%2Cgen%2Cos%2Coi%2Ctrid%2Cmid%2Cplatform%5Cu0026bvc%3Dvod%5Cu0026nettype%3D0%5Cu0026orderid%3D0%2C3%5Cu0026buvid%3D%5Cu0026build%3D74800100%5Cu0026f%3DU_0_0%5Cu0026bw%3D11267%5Cu0026logo%3D80000000%22%2C%22accept_formats%22%3A%5B%7B%22quality%22%3A64%2C%22format%22%3A%22mp4720%22%2C%22description%22%3A%22%E9%AB%98%E6%B8%85%20720P%22%2C%22new_description%22%3A%22720P%20%E9%AB%98%E6%B8%85%22%2C%22display_desc%22%3A%22720P%22%2C%22need_login%22%3Atrue%7D%2C%7B%22quality%22%3A16%2C%22format%22%3A%22mp4%22%2C%22description%22%3A%22%E6%B5%81%E7%95%85%20360P%22%2C%22new_description%22%3A%22360P%20%E6%B5%81%E7%95%85%22%2C%22display_desc%22%3A%22360P%22%7D%5D%2C%22backup_url%22%3A%5B%22http%3A%2F%2Fupos-sz-mirror08c.bilivideo.com%2Fupgcxcode%2F22%2F64%2F1511056422%2F1511056422-1-16.mp4%3Fe%3Dig8euxZM2rNcNbRVhwdVhwdlhWdVhwdVhoNvNC8BqJIzNbfqXBvEuENvNC8aNEVEtEvE9IMvXBvE2ENvNCImNEVEIj0Y2J_aug859r1qXg8gNEVE5XREto8z5JZC2X2gkX5L5F1eTX1jkXlsTXHeux_f2o859IB_%5Cu0026uipk%3D5%5Cu0026nbs%3D1%5Cu0026deadline%3D1713855938%5Cu0026gen%3Dplayurlv2%5Cu0026os%3D08cbv%5Cu0026oi%3D1744363898%5Cu0026trid%3D982a81d34ec344f8a79f645c8973f533U%5Cu0026mid%3D223973299%5Cu0026platform%3Dipad%5Cu0026upsig%3D1e3cfe4756d7f7ee5875216a269acdfa%5Cu0026uparams%3De%2Cuipk%2Cnbs%2Cdeadline%2Cgen%2Cos%2Coi%2Ctrid%2Cmid%2Cplatform%5Cu0026bvc%3Dvod%5Cu0026nettype%3D0%5Cu0026orderid%3D1%2C3%5Cu0026buvid%3D%5Cu0026build%3D74800100%5Cu0026f%3DU_0_0%5Cu0026bw%3D11267%5Cu0026logo%3D40000000%22%2C%22http%3A%2F%2Fupos-sz-mirrorhwb.bilivideo.com%2Fupgcxcode%2F22%2F64%2F1511056422%2F1511056422-1-16.mp4%3Fe%3Dig8euxZM2rNcNbRVhwdVhwdlhWdVhwdVhoNvNC8BqJIzNbfqXBvEuENvNC8aNEVEtEvE9IMvXBvE2ENvNCImNEVEIj0Y2J_aug859r1qXg8gNEVE5XREto8z5JZC2X2gkX5L5F1eTX1jkXlsTXHeux_f2o859IB_%5Cu0026uipk%3D5%5Cu0026nbs%3D1%5Cu0026deadline%3D1713855938%5Cu0026gen%3Dplayurlv2%5Cu0026os%3Dhwbbv%5Cu0026oi%3D1744363898%5Cu0026trid%3D982a81d34ec344f8a79f645c8973f533U%5Cu0026mid%3D223973299%5Cu0026platform%3Dipad%5Cu0026upsig%3Db63767f2be0c0f9c3fd3fb88761ac797%5Cu0026uparams%3De%2Cuipk%2Cnbs%2Cdeadline%2Cgen%2Cos%2Coi%2Ctrid%2Cmid%2Cplatform%5Cu0026bvc%3Dvod%5Cu0026nettype%3D0%5Cu0026orderid%3D2%2C3%5Cu0026buvid%3D%5Cu0026build%3D74800100%5Cu0026f%3DU_0_0%5Cu0026bw%3D11267%5Cu0026logo%3D40000000%22%5D%2C%22union_player%22%3A%7B%22biz_type%22%3A1%2C%22dimension%22%3A%7B%22width%22%3A1920%2C%22height%22%3A1080%7D%2C%22aid%22%3A1053268502%7D%7D&player_rotate=0&player_width=1920&report_flow_data=%7B%22flow_card_type%22%3A%22av%22%2C%22flow_source%22%3A%22ann_dssm_u2i%24dssm_u2u%22%7D&trackid=all_49.router-pegasus-1475688-56f5559cb5-9vnj2.1713848738314.953'

src/utils/authProvider.ts

@@ -1,7 +1,8 @@
 // import browser from 'webextension-polyfill'
-import { appSign } from './appSign'
 import { accessKey } from '~/logic/storage'
 
+import { appSign } from './appSign'
+
 export function revokeAccessKey() {
   accessKey.value = null
 }

src/utils/dataFormatter.ts

@@ -1,7 +1,8 @@
-import { LanguageType } from './../enums/appEnums'
 import { settings } from '~/logic'
 import { i18n } from '~/utils/i18n'
 
+import { LanguageType } from './../enums/appEnums'
+
 export const { t } = i18n.global
 
 export function numFormatter(num: number) {

src/utils/i18n.ts

@@ -1,5 +1,5 @@
-import { createI18n } from 'vue-i18n'
 import messages from '@intlify/unplugin-vue-i18n/messages'
+import { createI18n } from 'vue-i18n'
 
 export const i18n = createI18n({
   legacy: false,

src/utils/mitt.ts

@@ -1,5 +1,5 @@
-import mitt from 'mitt'
 import type { Emitter } from 'mitt'
+import mitt from 'mitt'
 
 const emitter: Emitter<any> = mitt()
 export default emitter

tsup.config.ts

@@ -1,4 +1,5 @@
 import { defineConfig } from 'tsup'
+
 import { isDev, isFirefox } from './scripts/utils'
 
 export default defineConfig(() => ({

unocss.config.ts

@@ -1,5 +1,5 @@
-import { defineConfig } from 'unocss/vite'
 import { presetAttributify, presetIcons, presetTypography, presetUno, transformerDirectives } from 'unocss'
+import { defineConfig } from 'unocss/vite'
 
 const remRE = /(-?[\.\d]+)rem/g
 

vite-mv3-hmr.ts

@@ -1,6 +1,8 @@
 import { dirname, join } from 'node:path'
-import type { HMRPayload, PluginOption } from 'vite'
+
 import fs from 'fs-extra'
+import type { HMRPayload, PluginOption } from 'vite'
+
 import { isFirefox, isWin, r } from './scripts/utils'
 
 const targetDir = r(isFirefox ? 'extension-firefox' : 'extension')

vite.config.content.ts

@@ -1,7 +1,8 @@
 import { defineConfig } from 'vite'
-import { sharedConfig } from './vite.config'
-import { isDev, isFirefox, r } from './scripts/utils'
+
 import packageJson from './package.json'
+import { isDev, isFirefox, r } from './scripts/utils'
+import { sharedConfig } from './vite.config'
 
 // bundling the content script using Vite
 export default defineConfig({

vite.config.ts

@@ -1,13 +1,15 @@
 /// <reference types="vitest" />
 
 import { dirname, relative } from 'node:path'
+
+import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite'
+import replace from '@rollup/plugin-replace'
+import Vue from '@vitejs/plugin-vue'
+import UnoCSS from 'unocss/vite'
+import AutoImport from 'unplugin-auto-import/vite'
 import type { UserConfig } from 'vite'
 import { defineConfig } from 'vite'
-import Vue from '@vitejs/plugin-vue'
-import replace from '@rollup/plugin-replace'
-import AutoImport from 'unplugin-auto-import/vite'
-import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite'
-import UnoCSS from 'unocss/vite'
+
 import { isDev, isFirefox, port, r } from './scripts/utils'
 import { MV3Hmr } from './vite-mv3-hmr'