diff --git a/src/components/connection/connection-item.tsx b/src/components/connection/connection-item.tsx
index 3ec7583c7..da407d8d6 100644
--- a/src/components/connection/connection-item.tsx
+++ b/src/components/connection/connection-item.tsx
@@ -2,9 +2,8 @@ import dayjs from "dayjs";
 import { useLockFn } from "ahooks";
 import { styled, ListItem, IconButton, ListItemText } from "@mui/material";
 import { CloseRounded } from "@mui/icons-material";
-import { ApiType } from "../../services/types";
-import { deleteConnection } from "../../services/api";
-import parseTraffic from "../../utils/parse-traffic";
+import { deleteConnection } from "@/services/api";
+import parseTraffic from "@/utils/parse-traffic";
 
 const Tag = styled("span")(({ theme }) => ({
   display: "inline-block",
diff --git a/src/components/layout/layout-traffic.tsx b/src/components/layout/layout-traffic.tsx
index 9d02ba374..c7247db6e 100644
--- a/src/components/layout/layout-traffic.tsx
+++ b/src/components/layout/layout-traffic.tsx
@@ -4,13 +4,12 @@ import { useRecoilValue } from "recoil";
 import { Box, Typography } from "@mui/material";
 import { ArrowDownward, ArrowUpward } from "@mui/icons-material";
 import { listen } from "@tauri-apps/api/event";
-import { ApiType } from "../../services/types";
-import { getInformation } from "../../services/api";
-import { getVergeConfig } from "../../services/cmds";
-import { atomClashPort } from "../../services/states";
+import { getInformation } from "@/services/api";
+import { getVergeConfig } from "@/services/cmds";
+import { atomClashPort } from "@/services/states";
 import TrafficGraph from "./traffic-graph";
 import useLogSetup from "./use-log-setup";
-import parseTraffic from "../../utils/parse-traffic";
+import parseTraffic from "@/utils/parse-traffic";
 
 // setup the traffic
 const LayoutTraffic = () => {
diff --git a/src/components/layout/update-dialog.tsx b/src/components/layout/update-dialog.tsx
index f35de41aa..971d5b3ee 100644
--- a/src/components/layout/update-dialog.tsx
+++ b/src/components/layout/update-dialog.tsx
@@ -13,8 +13,8 @@ import {
 } from "@mui/material";
 import { relaunch } from "@tauri-apps/api/process";
 import { checkUpdate, installUpdate } from "@tauri-apps/api/updater";
-import { killSidecar, restartSidecar } from "../../services/cmds";
-import { atomUpdateState } from "../../services/states";
+import { killSidecar, restartSidecar } from "@/services/cmds";
+import { atomUpdateState } from "@/services/states";
 import Notice from "../base/base-notice";
 
 interface Props {
diff --git a/src/components/layout/use-custom-theme.ts b/src/components/layout/use-custom-theme.ts
index 2aa07a601..86a9d9d30 100644
--- a/src/components/layout/use-custom-theme.ts
+++ b/src/components/layout/use-custom-theme.ts
@@ -3,9 +3,9 @@ import { useEffect, useMemo } from "react";
 import { useRecoilState } from "recoil";
 import { createTheme } from "@mui/material";
 import { appWindow } from "@tauri-apps/api/window";
-import { getVergeConfig } from "../../services/cmds";
-import { atomThemeMode } from "../../services/states";
-import { defaultTheme, defaultDarkTheme } from "../../pages/_theme";
+import { getVergeConfig } from "@/services/cmds";
+import { atomThemeMode } from "@/services/states";
+import { defaultTheme, defaultDarkTheme } from "@/pages/_theme";
 
 /**
  * custome theme
diff --git a/src/components/layout/use-log-setup.ts b/src/components/layout/use-log-setup.ts
index d4a9eeee2..9c5f0d50c 100644
--- a/src/components/layout/use-log-setup.ts
+++ b/src/components/layout/use-log-setup.ts
@@ -2,9 +2,8 @@ import dayjs from "dayjs";
 import { useEffect, useState } from "react";
 import { useSetRecoilState } from "recoil";
 import { listen } from "@tauri-apps/api/event";
-import { ApiType } from "../../services/types";
-import { getInformation } from "../../services/api";
-import { atomLogData } from "../../services/states";
+import { getInformation } from "@/services/api";
+import { atomLogData } from "@/services/states";
 
 const MAX_LOG_NUM = 1000;
 
diff --git a/src/components/log/log-item.tsx b/src/components/log/log-item.tsx
index 9d99c8c4b..fff9729d9 100644
--- a/src/components/log/log-item.tsx
+++ b/src/components/log/log-item.tsx
@@ -1,5 +1,4 @@
 import { styled, Box } from "@mui/material";
-import { ApiType } from "../../services/types";
 
 const Item = styled(Box)(({ theme }) => ({
   padding: "8px 0",
diff --git a/src/components/profile/enhanced.tsx b/src/components/profile/enhanced.tsx
index 0105bea76..6072f01d2 100644
--- a/src/components/profile/enhanced.tsx
+++ b/src/components/profile/enhanced.tsx
@@ -24,8 +24,7 @@ import {
   enhanceProfiles,
   changeProfileChain,
   changeProfileValid,
-} from "../../services/cmds";
-import { CmdType } from "../../services/types";
+} from "@/services/cmds";
 import ProfileMore from "./profile-more";
 import Notice from "../base/base-notice";
 
diff --git a/src/components/profile/file-editor.tsx b/src/components/profile/file-editor.tsx
index f7125bad9..e1a94dbdd 100644
--- a/src/components/profile/file-editor.tsx
+++ b/src/components/profile/file-editor.tsx
@@ -9,8 +9,8 @@ import {
   DialogContent,
   DialogTitle,
 } from "@mui/material";
-import { atomThemeMode } from "../../services/states";
-import { readProfileFile, saveProfileFile } from "../../services/cmds";
+import { atomThemeMode } from "@/services/states";
+import { readProfileFile, saveProfileFile } from "@/services/cmds";
 import Notice from "../base/base-notice";
 
 import "monaco-editor/esm/vs/basic-languages/javascript/javascript.contribution.js";
diff --git a/src/components/profile/profile-edit.tsx b/src/components/profile/profile-edit.tsx
index 83cd5306d..74d079f75 100644
--- a/src/components/profile/profile-edit.tsx
+++ b/src/components/profile/profile-edit.tsx
@@ -12,8 +12,7 @@ import {
   TextField,
 } from "@mui/material";
 import { Settings } from "@mui/icons-material";
-import { CmdType } from "../../services/types";
-import { patchProfile } from "../../services/cmds";
+import { patchProfile } from "@/services/cmds";
 import Notice from "../base/base-notice";
 
 interface Props {
diff --git a/src/components/profile/profile-item.tsx b/src/components/profile/profile-item.tsx
index c7a13c7dc..94ded72cc 100644
--- a/src/components/profile/profile-item.tsx
+++ b/src/components/profile/profile-item.tsx
@@ -16,10 +16,9 @@ import {
   Menu,
 } from "@mui/material";
 import { RefreshRounded } from "@mui/icons-material";
-import { CmdType } from "../../services/types";
-import { atomLoadingCache } from "../../services/states";
-import { updateProfile, deleteProfile, viewProfile } from "../../services/cmds";
-import parseTraffic from "../../utils/parse-traffic";
+import { atomLoadingCache } from "@/services/states";
+import { updateProfile, deleteProfile, viewProfile } from "@/services/cmds";
+import parseTraffic from "@/utils/parse-traffic";
 import ProfileEdit from "./profile-edit";
 import FileEditor from "./file-editor";
 import Notice from "../base/base-notice";
diff --git a/src/components/profile/profile-more.tsx b/src/components/profile/profile-more.tsx
index 15129d5a9..348dc7cd3 100644
--- a/src/components/profile/profile-more.tsx
+++ b/src/components/profile/profile-more.tsx
@@ -11,9 +11,8 @@ import {
   MenuItem,
   Menu,
 } from "@mui/material";
-import { CmdType } from "../../services/types";
-import { viewProfile } from "../../services/cmds";
-import enhance from "../../services/enhance";
+import { viewProfile } from "@/services/cmds";
+import enhance from "@/services/enhance";
 import ProfileEdit from "./profile-edit";
 import FileEditor from "./file-editor";
 import Notice from "../base/base-notice";
diff --git a/src/components/profile/profile-new.tsx b/src/components/profile/profile-new.tsx
index 10a24ade6..48b3319e5 100644
--- a/src/components/profile/profile-new.tsx
+++ b/src/components/profile/profile-new.tsx
@@ -15,7 +15,7 @@ import {
   TextField,
 } from "@mui/material";
 import { Settings } from "@mui/icons-material";
-import { createProfile } from "../../services/cmds";
+import { createProfile } from "@/services/cmds";
 import Notice from "../base/base-notice";
 import FileInput from "./file-input";
 
diff --git a/src/components/proxy/proxy-global.tsx b/src/components/proxy/proxy-global.tsx
index 0a22f5535..9053cd4e9 100644
--- a/src/components/proxy/proxy-global.tsx
+++ b/src/components/proxy/proxy-global.tsx
@@ -2,13 +2,12 @@ import useSWR, { useSWRConfig } from "swr";
 import { useEffect, useRef, useState } from "react";
 import { useLockFn } from "ahooks";
 import { Virtuoso } from "react-virtuoso";
-import { ApiType } from "../../services/types";
-import { updateProxy } from "../../services/api";
-import { getProfiles, patchProfile } from "../../services/cmds";
+import { updateProxy } from "@/services/api";
+import { getProfiles, patchProfile } from "@/services/cmds";
+import delayManager from "@/services/delay";
 import useSortProxy from "./use-sort-proxy";
 import useHeadState from "./use-head-state";
 import useFilterProxy from "./use-filter-proxy";
-import delayManager from "../../services/delay";
 import ProxyHead from "./proxy-head";
 import ProxyItem from "./proxy-item";
 
diff --git a/src/components/proxy/proxy-group.tsx b/src/components/proxy/proxy-group.tsx
index 384cffefa..6d6bccf08 100644
--- a/src/components/proxy/proxy-group.tsx
+++ b/src/components/proxy/proxy-group.tsx
@@ -15,13 +15,12 @@ import {
   ExpandLessRounded,
   ExpandMoreRounded,
 } from "@mui/icons-material";
-import { ApiType } from "../../services/types";
-import { updateProxy } from "../../services/api";
-import { getProfiles, patchProfile } from "../../services/cmds";
+import { updateProxy } from "@/services/api";
+import { getProfiles, patchProfile } from "@/services/cmds";
+import delayManager from "@/services/delay";
 import useSortProxy from "./use-sort-proxy";
 import useHeadState from "./use-head-state";
 import useFilterProxy from "./use-filter-proxy";
-import delayManager from "../../services/delay";
 import ProxyHead from "./proxy-head";
 import ProxyItem from "./proxy-item";
 
diff --git a/src/components/proxy/proxy-head.tsx b/src/components/proxy/proxy-head.tsx
index 6178eb54a..1e8731079 100644
--- a/src/components/proxy/proxy-head.tsx
+++ b/src/components/proxy/proxy-head.tsx
@@ -13,7 +13,7 @@ import {
   SortByAlphaRounded,
   SortRounded,
 } from "@mui/icons-material";
-import delayManager from "../../services/delay";
+import delayManager from "@/services/delay";
 import type { HeadState } from "./use-head-state";
 import type { ProxySortType } from "./use-sort-proxy";
 
diff --git a/src/components/proxy/proxy-item.tsx b/src/components/proxy/proxy-item.tsx
index 30d3e85e0..60d88249c 100644
--- a/src/components/proxy/proxy-item.tsx
+++ b/src/components/proxy/proxy-item.tsx
@@ -12,8 +12,7 @@ import {
   SxProps,
   Theme,
 } from "@mui/material";
-import { ApiType } from "../../services/types";
-import delayManager from "../../services/delay";
+import delayManager from "@/services/delay";
 
 interface Props {
   groupName: string;
diff --git a/src/components/proxy/use-filter-proxy.ts b/src/components/proxy/use-filter-proxy.ts
index 66cea1a17..9ec8d3c06 100644
--- a/src/components/proxy/use-filter-proxy.ts
+++ b/src/components/proxy/use-filter-proxy.ts
@@ -1,6 +1,5 @@
 import { useMemo } from "react";
-import { ApiType } from "../../services/types";
-import delayManager from "../../services/delay";
+import delayManager from "@/services/delay";
 
 const regex1 = /delay([=<>])(\d+|timeout|error)/i;
 const regex2 = /type=(.*)/i;
diff --git a/src/components/proxy/use-head-state.ts b/src/components/proxy/use-head-state.ts
index 7fcd44f7b..20e839e3b 100644
--- a/src/components/proxy/use-head-state.ts
+++ b/src/components/proxy/use-head-state.ts
@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useState } from "react";
 import { useRecoilValue } from "recoil";
-import { atomCurrentProfile } from "../../services/states";
+import { atomCurrentProfile } from "@/services/states";
 import { ProxySortType } from "./use-sort-proxy";
 
 export interface HeadState {
diff --git a/src/components/proxy/use-sort-proxy.ts b/src/components/proxy/use-sort-proxy.ts
index e80736ffb..d63cb8c1b 100644
--- a/src/components/proxy/use-sort-proxy.ts
+++ b/src/components/proxy/use-sort-proxy.ts
@@ -1,6 +1,5 @@
 import { useMemo } from "react";
-import { ApiType } from "../../services/types";
-import delayManager from "../../services/delay";
+import delayManager from "@/services/delay";
 
 // default | delay | alpha
 export type ProxySortType = 0 | 1 | 2;
diff --git a/src/components/setting/config-viewer.tsx b/src/components/setting/mods/config-viewer.tsx
similarity index 94%
rename from src/components/setting/config-viewer.tsx
rename to src/components/setting/mods/config-viewer.tsx
index e28ba3bf9..5af6a45f2 100644
--- a/src/components/setting/config-viewer.tsx
+++ b/src/components/setting/mods/config-viewer.tsx
@@ -10,8 +10,8 @@ import {
   DialogTitle,
 } from "@mui/material";
 import { InfoRounded } from "@mui/icons-material";
-import { atomThemeMode } from "../../services/states";
-import { getRunningConfig } from "../../services/cmds";
+import { atomThemeMode } from "../../../services/states";
+import { getRunningConfig } from "../../../services/cmds";
 
 import "monaco-editor/esm/vs/basic-languages/javascript/javascript.contribution.js";
 import "monaco-editor/esm/vs/basic-languages/yaml/yaml.contribution.js";
diff --git a/src/components/setting/core-switch.tsx b/src/components/setting/mods/core-switch.tsx
similarity index 92%
rename from src/components/setting/core-switch.tsx
rename to src/components/setting/mods/core-switch.tsx
index 54905758c..25053aad7 100644
--- a/src/components/setting/core-switch.tsx
+++ b/src/components/setting/mods/core-switch.tsx
@@ -3,9 +3,9 @@ import { useState } from "react";
 import { useLockFn } from "ahooks";
 import { Menu, MenuItem } from "@mui/material";
 import { Settings } from "@mui/icons-material";
-import { changeClashCore, getVergeConfig } from "../../services/cmds";
-import { getVersion } from "../../services/api";
-import Notice from "../base/base-notice";
+import { changeClashCore, getVergeConfig } from "@/services/cmds";
+import { getVersion } from "@/services/api";
+import Notice from "@/components/base/base-notice";
 
 const VALID_CORE = [
   { name: "Clash", core: "clash" },
diff --git a/src/components/setting/guard-state.tsx b/src/components/setting/mods/guard-state.tsx
similarity index 98%
rename from src/components/setting/guard-state.tsx
rename to src/components/setting/mods/guard-state.tsx
index 7e4f0d0f8..9b51b2eae 100644
--- a/src/components/setting/guard-state.tsx
+++ b/src/components/setting/mods/guard-state.tsx
@@ -1,5 +1,5 @@
 import { cloneElement, isValidElement, ReactNode, useRef } from "react";
-import noop from "../../utils/noop";
+import noop from "@/utils/noop";
 
 interface Props<Value> {
   value?: Value;
diff --git a/src/components/setting/palette-switch.tsx b/src/components/setting/mods/palette-switch.tsx
similarity index 100%
rename from src/components/setting/palette-switch.tsx
rename to src/components/setting/mods/palette-switch.tsx
diff --git a/src/components/setting/service-mode.tsx b/src/components/setting/mods/service-mode.tsx
similarity index 96%
rename from src/components/setting/service-mode.tsx
rename to src/components/setting/mods/service-mode.tsx
index 6472f0322..e6d50e53d 100644
--- a/src/components/setting/service-mode.tsx
+++ b/src/components/setting/mods/service-mode.tsx
@@ -14,9 +14,9 @@ import {
   installService,
   uninstallService,
   patchVergeConfig,
-} from "../../services/cmds";
-import Notice from "../base/base-notice";
-import noop from "../../utils/noop";
+} from "@/services/cmds";
+import Notice from "@/components/base/base-notice";
+import noop from "@/utils/noop";
 
 interface Props {
   open: boolean;
diff --git a/src/components/setting/sysproxy-tooltip.tsx b/src/components/setting/mods/sysproxy-tooltip.tsx
similarity index 96%
rename from src/components/setting/sysproxy-tooltip.tsx
rename to src/components/setting/mods/sysproxy-tooltip.tsx
index 5e3b68e7c..5641fa0e8 100644
--- a/src/components/setting/sysproxy-tooltip.tsx
+++ b/src/components/setting/mods/sysproxy-tooltip.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from "react";
 import { InfoRounded } from "@mui/icons-material";
 import { ClickAwayListener, Tooltip } from "@mui/material";
-import { getSystemProxy } from "../../services/cmds";
+import { getSystemProxy } from "@/services/cmds";
 
 const SysproxyTooltip = () => {
   const [open, setOpen] = useState(false);
diff --git a/src/components/setting/theme-mode-switch.tsx b/src/components/setting/mods/theme-mode-switch.tsx
similarity index 94%
rename from src/components/setting/theme-mode-switch.tsx
rename to src/components/setting/mods/theme-mode-switch.tsx
index 994cdd142..f717976ce 100644
--- a/src/components/setting/theme-mode-switch.tsx
+++ b/src/components/setting/mods/theme-mode-switch.tsx
@@ -1,6 +1,5 @@
 import { useTranslation } from "react-i18next";
 import { Button, ButtonGroup } from "@mui/material";
-import { CmdType } from "../../services/types";
 
 type ThemeValue = CmdType.VergeConfig["theme_mode"];
 
diff --git a/src/components/setting/setting-clash.tsx b/src/components/setting/setting-clash.tsx
index 8f7bcbeb4..17e2a4430 100644
--- a/src/components/setting/setting-clash.tsx
+++ b/src/components/setting/setting-clash.tsx
@@ -10,22 +10,18 @@ import {
   Typography,
   Box,
 } from "@mui/material";
-import { ApiType } from "../../services/types";
-import { atomClashPort } from "../../services/states";
-import { patchClashConfig } from "../../services/cmds";
+import { atomClashPort } from "@/services/states";
+import { patchClashConfig } from "@/services/cmds";
 import { SettingList, SettingItem } from "./setting";
-import { getClashConfig, getVersion, updateConfigs } from "../../services/api";
+import { getClashConfig, getVersion, updateConfigs } from "@/services/api";
 import Notice from "../base/base-notice";
-import GuardState from "./guard-state";
-import CoreSwitch from "./core-switch";
+import GuardState from "./mods/guard-state";
+import CoreSwitch from "./mods/core-switch";
 
 interface Props {
   onError: (err: Error) => void;
 }
 
-// const MULTI_CORE = !!import.meta.env.VITE_MULTI_CORE;
-const MULTI_CORE = true;
-
 const SettingClash = ({ onError }: Props) => {
   const { t } = useTranslation();
   const { mutate } = useSWRConfig();
@@ -136,14 +132,10 @@ const SettingClash = ({ onError }: Props) => {
       <SettingItem>
         <ListItemText
           primary={
-            MULTI_CORE ? (
-              <Box sx={{ display: "flex", alignItems: "center" }}>
-                <span style={{ marginRight: 4 }}>{t("Clash Core")}</span>
-                <CoreSwitch />
-              </Box>
-            ) : (
-              t("Clash Core")
-            )
+            <Box sx={{ display: "flex", alignItems: "center" }}>
+              <span style={{ marginRight: 4 }}>{t("Clash Core")}</span>
+              <CoreSwitch />
+            </Box>
           }
         />
         <Typography sx={{ py: 1 }}>{clashVer}</Typography>
diff --git a/src/components/setting/setting-system.tsx b/src/components/setting/setting-system.tsx
index ad8a36523..aeebe8a39 100644
--- a/src/components/setting/setting-system.tsx
+++ b/src/components/setting/setting-system.tsx
@@ -13,14 +13,13 @@ import {
   checkService,
   getVergeConfig,
   patchVergeConfig,
-} from "../../services/cmds";
+} from "@/services/cmds";
 import { SettingList, SettingItem } from "./setting";
-import { CmdType } from "../../services/types";
-import GuardState from "./guard-state";
-import ServiceMode from "./service-mode";
-import ConfigViewer from "./config-viewer";
-import SysproxyTooltip from "./sysproxy-tooltip";
-import getSystem from "../../utils/get-system";
+import getSystem from "@/utils/get-system";
+import GuardState from "./mods/guard-state";
+import ServiceMode from "./mods/service-mode";
+import ConfigViewer from "./mods/config-viewer";
+import SysproxyTooltip from "./mods/sysproxy-tooltip";
 
 interface Props {
   onError?: (err: Error) => void;
diff --git a/src/components/setting/setting-theme.tsx b/src/components/setting/setting-theme.tsx
index b00579bbb..22c097c8a 100644
--- a/src/components/setting/setting-theme.tsx
+++ b/src/components/setting/setting-theme.tsx
@@ -15,8 +15,8 @@ import {
   TextField,
   useTheme,
 } from "@mui/material";
-import { getVergeConfig, patchVergeConfig } from "../../services/cmds";
-import { defaultTheme, defaultDarkTheme } from "../../pages/_theme";
+import { getVergeConfig, patchVergeConfig } from "@/services/cmds";
+import { defaultTheme, defaultDarkTheme } from "@/pages/_theme";
 
 interface Props {
   open: boolean;
diff --git a/src/components/setting/setting-verge.tsx b/src/components/setting/setting-verge.tsx
index f5f12cd9f..07421bc00 100644
--- a/src/components/setting/setting-verge.tsx
+++ b/src/components/setting/setting-verge.tsx
@@ -14,13 +14,12 @@ import {
   openAppDir,
   openLogsDir,
   patchVergeConfig,
-} from "../../services/cmds";
+} from "@/services/cmds";
 import { ArrowForward } from "@mui/icons-material";
 import { SettingList, SettingItem } from "./setting";
-import { CmdType } from "../../services/types";
-import { version } from "../../../package.json";
-import ThemeModeSwitch from "./theme-mode-switch";
-import GuardState from "./guard-state";
+import { version } from "@root/package.json";
+import ThemeModeSwitch from "./mods/theme-mode-switch";
+import GuardState from "./mods/guard-state";
 import SettingTheme from "./setting-theme";
 
 interface Props {
diff --git a/src/pages/_layout.tsx b/src/pages/_layout.tsx
index 212b2e3c0..bbd958587 100644
--- a/src/pages/_layout.tsx
+++ b/src/pages/_layout.tsx
@@ -10,16 +10,16 @@ import { alpha, List, Paper, ThemeProvider } from "@mui/material";
 import { listen } from "@tauri-apps/api/event";
 import { appWindow } from "@tauri-apps/api/window";
 import { routers } from "./_routers";
-import { getAxios } from "../services/api";
-import { atomCurrentProfile } from "../services/states";
-import { getVergeConfig, getProfiles } from "../services/cmds";
-import { ReactComponent as LogoSvg } from "../assets/image/logo.svg";
-import LayoutItem from "../components/layout/layout-item";
-import LayoutControl from "../components/layout/layout-control";
-import LayoutTraffic from "../components/layout/layout-traffic";
-import UpdateButton from "../components/layout/update-button";
-import useCustomTheme from "../components/layout/use-custom-theme";
-import getSystem from "../utils/get-system";
+import { getAxios } from "@/services/api";
+import { atomCurrentProfile } from "@/services/states";
+import { getVergeConfig, getProfiles } from "@/services/cmds";
+import { ReactComponent as LogoSvg } from "@/assets/image/logo.svg";
+import LayoutItem from "@/components/layout/layout-item";
+import LayoutControl from "@/components/layout/layout-control";
+import LayoutTraffic from "@/components/layout/layout-traffic";
+import UpdateButton from "@/components/layout/update-button";
+import useCustomTheme from "@/components/layout/use-custom-theme";
+import getSystem from "@/utils/get-system";
 import "dayjs/locale/zh-cn";
 
 dayjs.extend(relativeTime);
diff --git a/src/pages/connections.tsx b/src/pages/connections.tsx
index 71652c5aa..a5fdad233 100644
--- a/src/pages/connections.tsx
+++ b/src/pages/connections.tsx
@@ -3,10 +3,9 @@ import { useLockFn } from "ahooks";
 import { Box, Button, Paper, TextField } from "@mui/material";
 import { Virtuoso } from "react-virtuoso";
 import { useTranslation } from "react-i18next";
-import { ApiType } from "../services/types";
-import { closeAllConnections, getInformation } from "../services/api";
-import BasePage from "../components/base/base-page";
-import ConnectionItem from "../components/connection/connection-item";
+import { closeAllConnections, getInformation } from "@/services/api";
+import BasePage from "@/components/base/base-page";
+import ConnectionItem from "@/components/connection/connection-item";
 
 const initConn = { uploadTotal: 0, downloadTotal: 0, connections: [] };
 
diff --git a/src/pages/logs.tsx b/src/pages/logs.tsx
index 936ba192f..c0c139677 100644
--- a/src/pages/logs.tsx
+++ b/src/pages/logs.tsx
@@ -3,9 +3,9 @@ import { useRecoilState } from "recoil";
 import { Box, Button, MenuItem, Paper, Select, TextField } from "@mui/material";
 import { Virtuoso } from "react-virtuoso";
 import { useTranslation } from "react-i18next";
-import { atomLogData } from "../services/states";
-import BasePage from "../components/base/base-page";
-import LogItem from "../components/log/log-item";
+import { atomLogData } from "@/services/states";
+import BasePage from "@/components/base/base-page";
+import LogItem from "@/components/log/log-item";
 
 const LogPage = () => {
   const { t } = useTranslation();
diff --git a/src/pages/profiles.tsx b/src/pages/profiles.tsx
index 9279401e2..8beec8d65 100644
--- a/src/pages/profiles.tsx
+++ b/src/pages/profiles.tsx
@@ -9,14 +9,14 @@ import {
   patchProfile,
   selectProfile,
   importProfile,
-} from "../services/cmds";
-import { getProxies, updateProxy } from "../services/api";
-import { atomCurrentProfile } from "../services/states";
-import Notice from "../components/base/base-notice";
-import BasePage from "../components/base/base-page";
-import ProfileNew from "../components/profile/profile-new";
-import ProfileItem from "../components/profile/profile-item";
-import EnhancedMode from "../components/profile/enhanced";
+} from "@/services/cmds";
+import { getProxies, updateProxy } from "@/services/api";
+import { atomCurrentProfile } from "@/services/states";
+import Notice from "@/components/base/base-notice";
+import BasePage from "@/components/base/base-page";
+import ProfileNew from "@/components/profile/profile-new";
+import ProfileItem from "@/components/profile/profile-item";
+import EnhancedMode from "@/components/profile/enhanced";
 
 const ProfilePage = () => {
   const { t } = useTranslation();
diff --git a/src/pages/proxies.tsx b/src/pages/proxies.tsx
index 7001bd5ce..945806e35 100644
--- a/src/pages/proxies.tsx
+++ b/src/pages/proxies.tsx
@@ -3,12 +3,12 @@ import { useEffect } from "react";
 import { useLockFn } from "ahooks";
 import { useTranslation } from "react-i18next";
 import { Button, ButtonGroup, List, Paper } from "@mui/material";
-import { getClashConfig, updateConfigs } from "../services/api";
-import { patchClashConfig } from "../services/cmds";
-import { getProxies } from "../services/api";
-import BasePage from "../components/base/base-page";
-import ProxyGroup from "../components/proxy/proxy-group";
-import ProxyGlobal from "../components/proxy/proxy-global";
+import { getClashConfig, updateConfigs } from "@/services/api";
+import { patchClashConfig } from "@/services/cmds";
+import { getProxies } from "@/services/api";
+import BasePage from "@/components/base/base-page";
+import ProxyGroup from "@/components/proxy/proxy-group";
+import ProxyGlobal from "@/components/proxy/proxy-global";
 
 const ProxyPage = () => {
   const { t } = useTranslation();
diff --git a/src/pages/settings.tsx b/src/pages/settings.tsx
index e8c244631..fcf7bd6f1 100644
--- a/src/pages/settings.tsx
+++ b/src/pages/settings.tsx
@@ -1,10 +1,10 @@
 import { Paper } from "@mui/material";
 import { useTranslation } from "react-i18next";
-import Notice from "../components/base/base-notice";
-import BasePage from "../components/base/base-page";
-import SettingVerge from "../components/setting/setting-verge";
-import SettingClash from "../components/setting/setting-clash";
-import SettingSystem from "../components/setting/setting-system";
+import Notice from "@/components/base/base-notice";
+import BasePage from "@/components/base/base-page";
+import SettingVerge from "@/components/setting/setting-verge";
+import SettingClash from "@/components/setting/setting-clash";
+import SettingSystem from "@/components/setting/setting-system";
 
 const SettingPage = () => {
   const { t } = useTranslation();
diff --git a/src/services/api.ts b/src/services/api.ts
index bb183a089..39cb226ec 100644
--- a/src/services/api.ts
+++ b/src/services/api.ts
@@ -1,6 +1,5 @@
 import axios, { AxiosInstance } from "axios";
 import { getClashInfo } from "./cmds";
-import { ApiType } from "./types";
 
 let axiosIns: AxiosInstance = null!;
 let server = "";
diff --git a/src/services/cmds.ts b/src/services/cmds.ts
index 08b69870f..456fab037 100644
--- a/src/services/cmds.ts
+++ b/src/services/cmds.ts
@@ -1,6 +1,5 @@
 import { invoke } from "@tauri-apps/api/tauri";
-import { ApiType, CmdType } from "./types";
-import Notice from "../components/base/base-notice";
+import Notice from "@/components/base/base-notice";
 
 export async function getProfiles() {
   return invoke<CmdType.ProfilesConfig>("get_profiles");
diff --git a/src/services/enhance.ts b/src/services/enhance.ts
index 1fbee88b0..9a027e3a5 100644
--- a/src/services/enhance.ts
+++ b/src/services/enhance.ts
@@ -1,7 +1,6 @@
 import { emit, listen, Event } from "@tauri-apps/api/event";
 import { appWindow } from "@tauri-apps/api/window";
-import { CmdType } from "./types";
-import ignoreCase from "../utils/ignore-case";
+import ignoreCase from "@/utils/ignore-case";
 
 const DEFAULT_FIELDS = [
   "rules",
diff --git a/src/services/i18n.ts b/src/services/i18n.ts
index e3d8d3112..1bd00aa69 100644
--- a/src/services/i18n.ts
+++ b/src/services/i18n.ts
@@ -1,7 +1,7 @@
 import i18n from "i18next";
 import { initReactI18next } from "react-i18next";
-import en from "../locales/en.json";
-import zh from "../locales/zh.json";
+import en from "@/locales/en.json";
+import zh from "@/locales/zh.json";
 
 const resources = {
   en: { translation: en },
diff --git a/src/services/states.ts b/src/services/states.ts
index 6d7ebeab2..c283d0b52 100644
--- a/src/services/states.ts
+++ b/src/services/states.ts
@@ -1,5 +1,4 @@
 import { atom } from "recoil";
-import { ApiType } from "./types";
 
 export const atomThemeMode = atom<"light" | "dark">({
   key: "atomThemeMode",
diff --git a/src/services/types.ts b/src/services/types.d.ts
similarity index 83%
rename from src/services/types.ts
rename to src/services/types.d.ts
index 2edea25bf..6aafd1189 100644
--- a/src/services/types.ts
+++ b/src/services/types.d.ts
@@ -1,8 +1,9 @@
+// declare global {
 /**
  * Some interface for clash api
  */
-export namespace ApiType {
-  export interface ConfigData {
+declare namespace ApiType {
+  interface ConfigData {
     port: number;
     mode: string;
     ipv6: boolean;
@@ -15,13 +16,13 @@ export namespace ApiType {
     "tproxy-port": number;
   }
 
-  export interface RuleItem {
+  interface RuleItem {
     type: string;
     payload: string;
     proxy: string;
   }
 
-  export interface ProxyItem {
+  interface ProxyItem {
     name: string;
     type: string;
     udp: boolean;
@@ -33,22 +34,22 @@ export namespace ApiType {
     now?: string;
   }
 
-  export type ProxyGroupItem = Omit<ProxyItem, "all"> & {
+  type ProxyGroupItem = Omit<ProxyItem, "all"> & {
     all: ProxyItem[];
   };
 
-  export interface TrafficItem {
+  interface TrafficItem {
     up: number;
     down: number;
   }
 
-  export interface LogItem {
+  interface LogItem {
     type: string;
     time?: string;
     payload: string;
   }
 
-  export interface ConnectionsItem {
+  interface ConnectionsItem {
     id: string;
     metadata: {
       network: string;
@@ -69,7 +70,7 @@ export namespace ApiType {
     curDownload?: number; // calculate
   }
 
-  export interface Connections {
+  interface Connections {
     downloadTotal: number;
     uploadTotal: number;
     connections: ConnectionsItem[];
@@ -79,17 +80,17 @@ export namespace ApiType {
 /**
  * Some interface for command
  */
-export namespace CmdType {
-  export type ProfileType = "local" | "remote" | "merge" | "script";
+declare namespace CmdType {
+  type ProfileType = "local" | "remote" | "merge" | "script";
 
-  export interface ClashInfo {
+  interface ClashInfo {
     status: string;
     port?: string;
     server?: string;
     secret?: string;
   }
 
-  export interface ProfileItem {
+  interface ProfileItem {
     uid: string;
     type?: ProfileType | string;
     name?: string;
@@ -110,20 +111,20 @@ export namespace CmdType {
     option?: ProfileOption;
   }
 
-  export interface ProfileOption {
+  interface ProfileOption {
     user_agent?: string;
     with_proxy?: boolean;
     update_interval?: number;
   }
 
-  export interface ProfilesConfig {
+  interface ProfilesConfig {
     current?: string;
     chain?: string[];
     valid?: string[];
     items?: ProfileItem[];
   }
 
-  export interface VergeConfig {
+  interface VergeConfig {
     language?: string;
     clash_core?: string;
     theme_mode?: "light" | "dark" | "system";
@@ -152,7 +153,7 @@ export namespace CmdType {
 
   type ClashConfigValue = any;
 
-  export interface ProfileMerge {
+  interface ProfileMerge {
     // clash config fields (default supports)
     rules?: ClashConfigValue;
     proxies?: ClashConfigValue;
@@ -179,7 +180,7 @@ export namespace CmdType {
   }
 
   // partial of the clash config
-  export type ProfileData = Partial<{
+  type ProfileData = Partial<{
     rules: any[];
     proxies: any[];
     "proxy-groups": any[];
@@ -189,22 +190,23 @@ export namespace CmdType {
     [k: string]: any;
   }>;
 
-  export interface ChainItem {
+  interface ChainItem {
     item: ProfileItem;
     merge?: ProfileMerge;
     script?: string;
   }
 
-  export interface EnhancedPayload {
+  interface EnhancedPayload {
     chain: ChainItem[];
     valid: string[];
     current: ProfileData;
     callback: string;
   }
 
-  export interface EnhancedResult {
+  interface EnhancedResult {
     data: ProfileData;
     status: string;
     error?: string;
   }
 }
+// }
diff --git a/tsconfig.json b/tsconfig.json
index 9f8365997..a285c97f2 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "baseUrl": ".",
     "target": "ESNext",
     "useDefineForClassFields": true,
     "lib": ["DOM", "DOM.Iterable", "ESNext"],
@@ -14,7 +15,11 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react-jsx"
+    "jsx": "react-jsx",
+    "paths": {
+      "@/*": ["src/*"],
+      "@root/*": ["./*"]
+    }
   },
   "include": ["./src"]
 }
diff --git a/vite.config.ts b/vite.config.ts
index 6ca73e5b4..6992f5f70 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,4 +1,5 @@
 import { defineConfig } from "vite";
+import path from "path";
 import svgr from "vite-plugin-svgr";
 import react from "@vitejs/plugin-react";
 import monaco from "vite-plugin-monaco-editor";
@@ -15,4 +16,10 @@ export default defineConfig({
     outDir: "../dist",
     emptyOutDir: true,
   },
+  resolve: {
+    alias: {
+      "@": path.resolve("./src"),
+      "@root": path.resolve("."),
+    },
+  },
 });