Remove the dependency on umi.js; replace Less with Sass; use Vite.

package.json

@@ -1,18 +1,18 @@
 {
   "private": true,
   "scripts": {
-    "start": "electron ./build/main.js",
-    "postinstall": "umi generate tmp",
-    "test:umi": "umi-test",
-    "test:coverage": "umi-test --coverage",
+    "start": "cross-env NODE_ENV=development electron ./build/main.js",
     "test": "rm -rf ./test/tmp/* && mocha -r espower-typescript/guess -r tsconfig-paths/register \"test/**/*.test.ts\"",
-    "dev": "concurrently \"npm run dev:main\" \"npm run dev:renderer\"",
-    "dev:main": "webpack --config scripts/webpack.main.config.js -w",
-    "dev:renderer": "cross-env APP_ROOT=src/renderer umi dev",
+    "clean:dist": "rimraf ./dist/*",
+    "clean:build": "rimraf ./build/*",
+    "dev": "npm run clean:build && concurrently \"npm run dev:main\" \"npm run dev:renderer\"",
+    "dev:main": "vite build --watch --config ./vite.main.config.ts",
+    "dev:renderer": "vite --config ./vite.render.config.ts",
     "version:up": "node ./scripts/version_up.js",
-    "build": "npm run version:up && concurrently \"npm run build:main\" \"npm run build:renderer\"",
-    "build:main": "cross-env NODE_ENV=production webpack --config scripts/webpack.main.prod.config.js",
-    "build:renderer": "cross-env APP_ROOT=src/renderer umi build",
+    "_build": "npm run clean:build && npm run version:up && concurrently \"npm run build:main\" \"npm run build:renderer\"",
+    "build:main": "cross-env NODE_ENV=production vite build --config ./vite.main.config.ts",
+    "build:renderer": "cross-env NODE_ENV=production vite build --config ./vite.render.config.ts",
+    "build": "npm run _build",
     "make": "node scripts/make.js",
     "make:dev": "cross-env SKIP_NOTARIZATION=1 cross-env MAKE_FOR=dev npm run make",
     "make:linux": "cross-env SKIP_NOTARIZATION=1 cross-env MAKE_FOR=linux npm run make",
@@ -28,7 +28,7 @@
     "md5": "2.3.0",
     "md5-file": "5.0.0",
     "mkdirp": "1.0.4",
-    "potdb": "2.3.3",
+    "potdb": "2.5.4",
     "tslib": "2.4.0",
     "uuid": "8.3.2"
   },
@@ -52,8 +52,6 @@
     "@types/react-dom": "18.0.5",
     "@types/react-window": "1.8.5",
     "@types/uuid": "8.3.4",
-    "@umijs/preset-react": "2.x",
-    "@umijs/test": "3.5.24",
     "@vitejs/plugin-react": "3.0.1",
     "ahooks": "3.4.0",
     "babel-loader": "8.2.5",
@@ -80,12 +78,12 @@
     "react-icons": "4.3.1",
     "react-router-dom": "6.8.0",
     "react-window": "1.8.7",
+    "rimraf": "^4.1.2",
     "sass": "1.58.0",
     "smooth-scroll-into-view-if-needed": "1.1.33",
     "ts-node": "10.8.0",
     "tsconfig-paths-webpack-plugin": "3.5.2",
     "typescript": "4.7.2",
-    "umi": "3.5.35",
     "vite": "4.0.4",
     "vite-plugin-static-copy": "0.13.0",
     "vite-plugin-svgr": "2.4.0",

src/common/default_configs.ts

@@ -1,4 +1,4 @@
-import { LocaleName } from '@root/common/i18n'
+import { LocaleName } from '@common/i18n'
 import { FolderModeType } from './data.d'
 
 export type WriteModeType = null | 'overwrite' | 'append'

src/common/hostsFn.ts

@@ -3,11 +3,7 @@
  * @homepage: https://oldj.net
  */
 
-import {
-  FolderModeType,
-  IHostsBasicData,
-  IHostsListObject,
-} from '@root/common/data'
+import { FolderModeType, IHostsBasicData, IHostsListObject } from '@common/data'
 import lodash from 'lodash'
 
 type PartHostsObjectType = Partial<IHostsListObject> & { id: string }
@@ -77,7 +73,7 @@ export const setOnStateOfItem = (
   id: string,
   on: boolean,
   default_choice_mode: FolderModeType = 0,
-  multi_chose_folder_switch_all: boolean = false
+  multi_chose_folder_switch_all: boolean = false,
 ): IHostsListObject[] => {
   let new_list: IHostsListObject[] = lodash.cloneDeep(list)
 
@@ -86,7 +82,7 @@ export const setOnStateOfItem = (
 
   item.on = on
 
-  let itemIsInTopLevel = isInTopLevel(list, id);
+  let itemIsInTopLevel = isInTopLevel(list, id)
   if (multi_chose_folder_switch_all) {
     item = switchFolderChild(item, on)
     !itemIsInTopLevel && switchItemParentIsON(new_list, item, on)
@@ -129,9 +125,9 @@ export const setOnStateOfItem = (
 }
 
 export const switchItemParentIsON = (
-    list: IHostsListObject[],
-    item: IHostsListObject,
-    on: boolean
+  list: IHostsListObject[],
+  item: IHostsListObject,
+  on: boolean,
 ) => {
   let parent = getParentOfItem(list, item.id)
 
@@ -158,10 +154,7 @@ export const switchItemParentIsON = (
   }
 }
 
-export const switchFolderChild = (
-    item: IHostsListObject,
-    on: boolean,
-): IHostsListObject => {
+export const switchFolderChild = (item: IHostsListObject, on: boolean): IHostsListObject => {
   if (item.type != 'folder') {
     return item
   }
@@ -179,7 +172,7 @@ export const switchFolderChild = (
     })
   }
 
-  return item;
+  return item
 }
 
 export const deleteItemById = (list: IHostsListObject[], id: string) => {

src/common/i18n/index.ts

@@ -9,7 +9,7 @@ import zh from './languages/zh'
 import fr from './languages/fr'
 import de from './languages/de'
 import ja from './languages/ja'
-import { LanguageDict, LanguageKey } from '@root/common/types'
+import { LanguageDict, LanguageKey } from '@common/types'
 
 export const languages = {
   en,

src/common/i18n/languages/de.ts

@@ -3,7 +3,7 @@
  * @homepage: https://bergo.dev
  */
 
-import { LanguageDict } from '@root/common/types'
+import { LanguageDict } from '@common/types'
 
 const lang: LanguageDict = {
   _app_name: 'SwitchHosts',
@@ -32,8 +32,7 @@ const lang: LanguageDict = {
   close: 'Schließen',
   colon: ': ',
   commands: 'Befehle',
-  commands_help:
-    'Die folgenden Systembefehle werden ausgeführt, wenn Hosts angewendet werden:',
+  commands_help: 'Die folgenden Systembefehle werden ausgeführt, wenn Hosts angewendet werden:',
   commands_title: 'Befehl nach dem Anlegen eines Hosts',
   comment_current_line: 'Aktuelle Zeile kommentieren',
   content: 'Inhalt',
@@ -67,8 +66,7 @@ const lang: LanguageDict = {
   host: 'Gastgeber',
   hosts_add: 'Neue Hosts hinzufügen',
   hosts_delete: 'Diesen Host löschen',
-  hosts_delete_confirm:
-    'Sind Sie sicher, dass Sie die aktuellen Hosts löschen wollen?',
+  hosts_delete_confirm: 'Sind Sie sicher, dass Sie die aktuellen Hosts löschen wollen?',
   hosts_edit: 'Hosts bearbeiten',
   hosts_title: 'Titel des Hosts',
   hosts_type: 'Hosts Typ',
@@ -105,8 +103,7 @@ const lang: LanguageDict = {
   minutes: 'Minuten',
   move_items_to_trashcan: 'Verschiebe {0} Objekte in den Mülleimer',
   move_to_trashcan: 'In die Mülltonne verschieben',
-  multi_chose_folder_switch_all:
-    'Mehrfachauswahl-Ordnerschalter zur Steuerung von Unterelementen',
+  multi_chose_folder_switch_all: 'Mehrfachauswahl-Ordnerschalter zur Steuerung von Unterelementen',
   need_to_relaunch: 'Muss neu gestartet werden',
   need_to_relaunch_after_setting_changed:
     'Die Einstellungen wurden geändert und werden erst nach einem Neustart der App wirksam.',
@@ -153,8 +150,7 @@ const lang: LanguageDict = {
   sudo_prompt_title: 'Geben Sie Ihr sudo-Passwort ein',
   system_hosts: 'System-Hosts',
   system_hosts_history: 'Historische Versionen der System-Hosts',
-  system_hosts_history_delete_confirm:
-    'Sind Sie sicher, dass Sie dieses Element löschen wollen?',
+  system_hosts_history_delete_confirm: 'Sind Sie sicher, dass Sie dieses Element löschen wollen?',
   system_hosts_history_help:
     'Wenn die Gesamtzahl der historischen Einträge diese Grenze überschreitet, wird der älteste Eintrag gelöscht.',
   system_hosts_history_limit: 'Maximale Anzahl von Datensätzen: ',
@@ -169,8 +165,7 @@ const lang: LanguageDict = {
   toggle_full_screen: 'Vollbildmodus einschalten',
   trashcan: 'Mülleimer',
   trashcan_clear: 'Den Mülleimer leeren',
-  trashcan_clear_confirm:
-    'Sind Sie sicher, dass Sie den Mülleimer leeren wollen?',
+  trashcan_clear_confirm: 'Sind Sie sicher, dass Sie den Mülleimer leeren wollen?',
   trashcan_delete_confirm: 'Möchten Sie dieses Objekt vollständig löschen?',
   trashcan_restore: 'Wiederherstellen',
   tray_mini_window: 'Taskleistensymbol-Verknüpfung',
@@ -192,8 +187,7 @@ const lang: LanguageDict = {
   write_mode: 'Schreibmodus',
   write_mode_append_help:
     'Hängen Sie die neuen Datensätze an das Ende der Hosts-Datei des Systems an.',
-  write_mode_overwrite_help:
-    'Überschreibt die Systemhosts-Datei mit den neuen Datensätzen.',
+  write_mode_overwrite_help: 'Überschreibt die Systemhosts-Datei mit den neuen Datensätzen.',
   write_mode_set: 'Schreibmodus einstellen',
   your_data_is: 'Ihre Datendateien sind gespeichert in:',
   your_hosts_file_is: 'Ihre Hosts-Datei befindet sich in:',

src/common/i18n/languages/fr.ts

@@ -3,7 +3,7 @@
  * @homepage: https://github.com/Aktilor
  */
 
-import { LanguageDict } from '@root/common/types'
+import { LanguageDict } from '@common/types'
 
 const lang: LanguageDict = {
   _app_name: 'SwitchHosts',
@@ -32,8 +32,7 @@ const lang: LanguageDict = {
   close: 'Fermer',
   colon: ' : ',
   commands: 'Commandes',
-  commands_help:
-    "Les commandes systèmes suivantes seront exécutées quand l'hosts sera activé :",
+  commands_help: "Les commandes systèmes suivantes seront exécutées quand l'hosts sera activé :",
   commands_title: "Commandes une fois qu'un hosts est activé",
   comment_current_line: 'Commenter cette ligne',
   content: 'Contenu',
@@ -152,8 +151,7 @@ const lang: LanguageDict = {
   sudo_prompt_title: 'Entrez votre mot de passe sudo',
   system_hosts: 'Hosts du système',
   system_hosts_history: 'Historique des versions hosts du système',
-  system_hosts_history_delete_confirm:
-    'Êtes-vous sûr de vouloir supprimer cet élément ?',
+  system_hosts_history_delete_confirm: 'Êtes-vous sûr de vouloir supprimer cet élément ?',
   system_hosts_history_help:
     "Si le nombre total d'enregistrements dépasse cette limite, l'enregistrement le plus ancien sera supprimé.",
   system_hosts_history_limit: "Nombre max. d'enregistrements : ",
@@ -176,8 +174,7 @@ const lang: LanguageDict = {
   unhide: 'Démasquer',
   untitled: 'Sans titre',
   url_placeholder: 'http:// ou https:// ou file://',
-  usage_data_agree:
-    "Oui, soumettre de manière anonyme mes données d'utilisation",
+  usage_data_agree: "Oui, soumettre de manière anonyme mes données d'utilisation",
   usage_data_help:
     "Voulez-vous nous aider à améliorer SwitchHosts en soumettant périodiquement vos données d'utilisation de manière anonyme ?",
   usage_data_title: 'Rendez SwitchHosts meilleur !',

src/common/i18n/languages/ja.ts

@@ -3,7 +3,7 @@
  * @homepage: https://kamatte.me
  */
 
-import { LanguageDict } from '@root/common/types'
+import { LanguageDict } from '@common/types'
 
 const lang: LanguageDict = {
   _app_name: 'SwitchHosts',
@@ -22,7 +22,7 @@ const lang: LanguageDict = {
   choice_mode: '選択モード',
   choice_mode_default: 'デフォルト',
   choice_mode_desc:
-      '最上位階層のhostsにのみ有効で、各フォルダーでは独自に選択モードを設定できます。',
+    '最上位階層のhostsにのみ有効で、各フォルダーでは独自に選択モードを設定できます。',
   choice_mode_multiple: '複数',
   choice_mode_single: '単一',
   choices: '選択',
@@ -32,8 +32,7 @@ const lang: LanguageDict = {
   close: '閉じる',
   colon: ': ',
   commands: 'コマンド',
-  commands_help:
-      'hostsが適用されたとき、以下のシステムコマンドを実行します:',
+  commands_help: 'hostsが適用されたとき、以下のシステムコマンドを実行します:',
   commands_title: 'hosts適用後のコマンド',
   comment_current_line: '現在の行をコメントアウト',
   content: '内容',
@@ -76,7 +75,7 @@ const lang: LanguageDict = {
   hours: '時間',
   http_api_on: 'HTTP APIを有効化',
   http_api_on_desc:
-      '{0}番ポートで実行され、Alfredなどのサードパーティソフトウェアでhostsを切り替えるために使用できます。',
+    '{0}番ポートで実行され、Alfredなどのサードパーティソフトウェアでhostsを切り替えるために使用できます。',
   http_api_only_local: 'HTTP APIを 127.0.0.1 のみでリッスンする',
   ignore_case: '大文字と小文字を区別しない',
   import: 'インポート',
@@ -97,18 +96,17 @@ const lang: LanguageDict = {
   local: 'ローカル',
   match: '一致',
   migrate_confirm:
-      'SwitchHosts v4.0は新しいデータ保存形式を使用します。古いデータを新しい形式に移行しますか？',
+    'SwitchHosts v4.0は新しいデータ保存形式を使用します。古いデータを新しい形式に移行しますか？',
   migrate_data: 'データ移行',
   minimize: '最小化',
   minute: '分',
   minutes: '分',
   move_items_to_trashcan: '{0}件をごみ箱に入れる',
   move_to_trashcan: 'ゴミ箱に入れる',
-  multi_chose_folder_switch_all:
-      'フォルダーの切り替えで配下のアイテムを一括操作',
+  multi_chose_folder_switch_all: 'フォルダーの切り替えで配下のアイテムを一括操作',
   need_to_relaunch: '再起動が必要です',
   need_to_relaunch_after_setting_changed:
-      '変更された設定はアプリケーションの再起動後に有効になります。',
+    '変更された設定はアプリケーションの再起動後に有効になります。',
   never: 'なし',
   new: '新規',
   new_version_found: '新しいバージョンが見つかりました',
@@ -132,13 +130,12 @@ const lang: LanguageDict = {
   remote: 'リモート',
   remove_duplicate_records: '重複レコードを削除',
   remove_duplicate_records_desc:
-      '1つのドメインに複数のIPアドレスを指定している場合、先頭のIPアドレスのみが有効になり、以降のIPアドレスはコメントに変換されます。',
+    '1つのドメインに複数のIPアドレスを指定している場合、先頭のIPアドレスのみが有効になり、以降のIPアドレスはコメントに変換されます。',
   replace: '置換',
   replace_all: 'すべて置換',
   replace_history: '置換履歴',
   reset: 'リセット',
-  reset_data_dir_confirm:
-      'データフォルダーの場所をデフォルト ({0}) に戻してもよろしいですか？',
+  reset_data_dir_confirm: 'データフォルダーの場所をデフォルト ({0}) に戻してもよろしいですか？',
   reset_zoom: 'ズームをリセット',
   search: '検索',
   select_all: 'すべて選択',
@@ -152,8 +149,7 @@ const lang: LanguageDict = {
   sudo_prompt_title: '管理者パスワードを入力してください',
   system_hosts: 'システムhosts',
   system_hosts_history: 'システムhostsのバージョン履歴',
-  system_hosts_history_delete_confirm:
-      'この履歴を削除してもよろしいですか？',
+  system_hosts_history_delete_confirm: 'この履歴を削除してもよろしいですか？',
   system_hosts_history_help: '履歴件数がこれを超えると、最も古い履歴が削除されます。',
   system_hosts_history_limit: '履歴の最大件数: ',
   test: 'テスト',
@@ -176,21 +172,18 @@ const lang: LanguageDict = {
   untitled: '無題',
   url_placeholder: 'http:// または https:// または file://',
   usage_data_agree: 'はい、匿名の利用データを送信します。',
-  usage_data_help:
-      '匿名の利用データを定期的に送信し、SwitchHostsの改善にご協力いただけませんか？',
+  usage_data_help: '匿名の利用データを定期的に送信し、SwitchHostsの改善にご協力いただけませんか？',
   usage_data_title: 'SwitchHostsの改善に協力する',
   use_proxy: 'プロキシを使用',
   use_system_window_frame:
-      'システムのウィンドウフレームを使用。アプリケーションの再起動が必要です。',
+    'システムのウィンドウフレームを使用。アプリケーションの再起動が必要です。',
   view: '表示',
   where_is_my_data: 'データはどこに保存されますか？',
   where_is_my_hosts: 'hostsファイルはどこにありますか？',
   window: 'ウィンドウ',
   write_mode: '書き込みモード',
-  write_mode_append_help:
-      '新しいレコードをシステムhostsの末尾に追記します。',
-  write_mode_overwrite_help:
-      '新しいレコードでシステムhostsを上書きします。',
+  write_mode_append_help: '新しいレコードをシステムhostsの末尾に追記します。',
+  write_mode_overwrite_help: '新しいレコードでシステムhostsを上書きします。',
   write_mode_set: '書き込みモードを設定',
   your_data_is: 'あなたのデータファイルはこちらに保存されています:',
   your_hosts_file_is: 'あなたのhostsファイルはこちらにあります:',

src/common/i18n/languages/zh.ts

@@ -3,7 +3,7 @@
  * @homepage: https://oldj.net
  */
 
-import { LanguageDict } from '@root/common/types'
+import { LanguageDict } from '@common/types'
 
 const lang: LanguageDict = {
   _app_name: 'SwitchHosts',
@@ -93,8 +93,7 @@ const lang: LanguageDict = {
   loading: '加载中...',
   local: '本地',
   match: '匹配',
-  migrate_confirm:
-    'SwitchHosts v4.0 使用了新的数据存储格式，是否迁移旧数据为新格式？',
+  migrate_confirm: 'SwitchHosts v4.0 使用了新的数据存储格式，是否迁移旧数据为新格式？',
   migrate_data: '迁移数据',
   minimize: '最小化',
   minute: '分钟',
@@ -126,8 +125,7 @@ const lang: LanguageDict = {
   reload: '重载',
   remote: '远程',
   remove_duplicate_records: '移除重复的记录',
-  remove_duplicate_records_desc:
-    '如果一个域名指向多个 IP，只有第一条会生效，后面的将被转为注释。',
+  remove_duplicate_records_desc: '如果一个域名指向多个 IP，只有第一条会生效，后面的将被转为注释。',
   replace: '替换',
   replace_all: '替换所有',
   replace_history: '替换历史',
@@ -147,8 +145,7 @@ const lang: LanguageDict = {
   system_hosts: '系统 Hosts',
   system_hosts_history: '系统 Hosts 历史版本',
   system_hosts_history_delete_confirm: '确实要删除该项记录吗？',
-  system_hosts_history_help:
-    '如果历史记录的总数超过这个限制，最老的记录将被删除。',
+  system_hosts_history_help: '如果历史记录的总数超过这个限制，最老的记录将被删除。',
   system_hosts_history_limit: '最大记录数：',
   test: '测试',
   theme: '主题',

src/common/types.d.ts

@@ -4,7 +4,7 @@
  * @homepage: https://oldj.net
  */
 
-import { HostsType } from '@root/common/data'
+import { HostsType } from '@common/data'
 import { MenuItemConstructorOptions } from 'electron'
 import { default as lang } from './i18n/languages/en'
 

src/main/actions/checkUpdate.ts

@@ -7,9 +7,9 @@
 import { broadcast } from '@main/core/agent'
 import { localdb } from '@main/data'
 import { GET } from '@main/libs/request'
-import { server_url } from '@root/common/constants'
-import events from '@root/common/events'
-import version from '@root/version.json'
+import { server_url } from '@common/constants'
+import events from '@common/events'
+import version from '@/version.json'
 import compareVersions from 'compare-versions'
 import { v4 as uuid4 } from 'uuid'
 import type { AxiosResponse } from 'axios'

src/main/actions/cmd/changeDataDir.ts

@@ -7,7 +7,7 @@ import { app, BrowserWindow, dialog, OpenDialogOptions, OpenDialogReturnValue }
 import { localdb } from '@main/data'
 import getDataFolder, { getDefaultDataDir } from '@main/libs/getDataDir'
 import getI18N from '@main/core/getI18N'
-import { IActionFunc } from '@root/main/types'
+import { IActionFunc } from '@main/types'
 
 export default async function (
   this: IActionFunc,

src/main/actions/cmd/getHistoryList.ts

@@ -5,7 +5,7 @@
  */
 
 import { cfgdb } from '@main/data'
-import { ICommandRunResult } from '@root/common/data'
+import { ICommandRunResult } from '@common/data'
 
 export default async (): Promise<ICommandRunResult[]> => {
   return await cfgdb.collection.cmd_history.all()

src/main/actions/cmd/tryToRun.ts

@@ -5,10 +5,10 @@
  */
 
 import { cfgdb } from '@main/data'
-import { ICommandRunResult } from '@root/common/data'
+import { ICommandRunResult } from '@common/data'
 import { exec } from 'child_process'
 import { broadcast } from '@main/core/agent'
-import events from '@root/common/events'
+import events from '@common/events'
 
 const run = (cmd: string): Promise<ICommandRunResult> =>
   new Promise((resolve) => {
@@ -44,9 +44,7 @@ export default async () => {
   if (all.length > max_records) {
     let n = all.length - max_records
     for (let i = 0; i < n; i++) {
-      await cfgdb.collection.cmd_history.delete(
-        (item) => item._id === all[i]._id,
-      )
+      await cfgdb.collection.cmd_history.delete((item) => item._id === all[i]._id)
     }
   }
 

src/main/actions/config/all.ts

@@ -4,7 +4,7 @@
  */
 
 import { cfgdb } from '@main/data'
-import default_configs, { ConfigsType } from '@root/common/default_configs'
+import default_configs, { ConfigsType } from '@common/default_configs'
 
 export default async (): Promise<ConfigsType> => {
   if (!default_configs.locale && global.system_locale) {

src/main/actions/config/get.ts

@@ -4,7 +4,7 @@
  */
 
 import { cfgdb } from '@main/data'
-import default_configs, { ConfigsType } from '@root/common/default_configs'
+import default_configs, { ConfigsType } from '@common/default_configs'
 
 export default async <K extends keyof ConfigsType>(key: K) => {
   return (await cfgdb.dict.cfg.get(key, default_configs[key])) as ConfigsType[K]

src/main/actions/config/set.ts

@@ -4,12 +4,9 @@
  */
 
 import { cfgdb } from '@main/data'
-import { ConfigsType } from '@root/common/default_configs'
+import { ConfigsType } from '@common/default_configs'
 
-export default async <K extends keyof ConfigsType>(
-  key: K,
-  value: ConfigsType[K],
-) => {
+export default async <K extends keyof ConfigsType>(key: K, value: ConfigsType[K]) => {
   console.log(`config:store.set [${key}]: ${value}`)
   await cfgdb.dict.cfg.set(key, value)
 }

src/main/actions/config/update.ts

@@ -7,7 +7,7 @@ import { updateTrayTitle } from '@main/actions'
 import { cfgdb } from '@main/data'
 import * as http_api from '@main/http'
 import { makeMainMenu } from '@main/ui/menu'
-import { ConfigsType } from '@root/common/default_configs'
+import { ConfigsType } from '@common/default_configs'
 import { app } from 'electron'
 
 export default async (data: Partial<ConfigsType>) => {
@@ -33,7 +33,6 @@ export default async (data: Partial<ConfigsType>) => {
     }
   }
 
-
   if (old_configs.hide_dock_icon !== data.hide_dock_icon) {
     if (data.hide_dock_icon) {
       app.dock.hide()

src/main/actions/find/findBy.ts

@@ -5,8 +5,8 @@
 
 import splitContent from '@main/actions/find/splitContent'
 import getContentOfHosts from '@main/actions/hosts/getContent'
-import { flatten } from '@root/common/hostsFn'
-import { IFindItem } from '@root/common/types'
+import { flatten } from '@common/hostsFn'
+import { IFindItem } from '@common/types'
 import findInContent from 'src/main/actions/find/findPositionsInContent'
 import { getList } from '../index'
 
@@ -15,10 +15,7 @@ export interface IFindOptions {
   is_ignore_case: boolean
 }
 
-export default async (
-  keyword: string,
-  options: IFindOptions,
-): Promise<IFindItem[]> => {
+export default async (keyword: string, options: IFindOptions): Promise<IFindItem[]> => {
   console.log(keyword)
   let result_items: IFindItem[] = []
 

src/main/actions/find/findPositionsInContent.ts

@@ -3,19 +3,11 @@
  * @homepage: https://oldj.net
  */
 
-import { IFindPosition } from '@root/common/types'
+import { IFindPosition } from '@common/types'
 
 type MatchResult = Pick<
   IFindPosition,
-  | 'start'
-  | 'end'
-  | 'before'
-  | 'match'
-  | 'after'
-  | 'line'
-  | 'line_pos'
-  | 'end_line'
-  | 'end_line_pos'
+  'start' | 'end' | 'before' | 'match' | 'after' | 'line' | 'line_pos' | 'end_line' | 'end_line_pos'
 >
 
 export default (content: string, exp: RegExp): MatchResult[] => {

src/main/actions/find/splitContent.ts

@@ -3,16 +3,13 @@
  * @homepage: https://oldj.net
  */
 
-import { IFindPosition, IFindSplitter } from '@root/common/types'
+import { IFindPosition, IFindSplitter } from '@common/types'
 
 type MatchResult = Pick<IFindPosition, 'start' | 'end' | 'match'> & {
   [key: string]: any
 }
 
-export default (
-  content: string,
-  find_results: MatchResult[],
-): IFindSplitter[] => {
+export default (content: string, find_results: MatchResult[]): IFindSplitter[] => {
   let spliters: IFindSplitter[] = []
 
   let last_end = 0

src/main/actions/getBasicData.ts

@@ -4,15 +4,10 @@
  */
 
 import { swhdb } from '@main/data'
-import {
-  IHostsBasicData,
-  IHostsListObject,
-  ITrashcanListObject,
-  VersionType,
-} from '@root/common/data'
-import { flatten } from '@root/common/hostsFn'
+import { IHostsBasicData, IHostsListObject, ITrashcanListObject, VersionType } from '@common/data'
+import { flatten } from '@common/hostsFn'
 import { v4 as uuid4 } from 'uuid'
-import version from '@root/version.json'
+import version from '@/version.json'
 
 const normalizeList = (list: IHostsListObject[]): IHostsListObject[] => {
   let flat = flatten(list)
@@ -25,9 +20,7 @@ const normalizeList = (list: IHostsListObject[]): IHostsListObject[] => {
   return list
 }
 
-const normalizeTrashcan = (
-  list: ITrashcanListObject[],
-): ITrashcanListObject[] => {
+const normalizeTrashcan = (list: ITrashcanListObject[]): ITrashcanListObject[] => {
   list.map((item) => {
     if (!item.id) {
       item.id = uuid4()
@@ -46,7 +39,7 @@ export default async (): Promise<IHostsBasicData> => {
 
   let list = normalizeList(await swhdb.list.tree.all())
   let trashcan = normalizeTrashcan(await swhdb.list.trashcan.all())
-  let v = await swhdb.dict.meta.get<VersionType>('version', version)
+  let v = (await swhdb.dict.meta.get<VersionType>('version', version)) || [0, 0, 0, 0]
 
   return {
     ...default_data,

src/main/actions/hosts/getContent.ts

@@ -5,13 +5,11 @@
 
 import { configGet, getItemFromList, getList } from '@main/actions'
 import { swhdb } from '@main/data'
-import { IHostsContentObject } from '@root/common/data'
-import { findItemById, flatten } from '@root/common/hostsFn'
+import { IHostsContentObject } from '@common/data'
+import { findItemById, flatten } from '@common/hostsFn'
 
 const getContentById = async (id: string) => {
-  let hosts_content = await swhdb.collection.hosts.find<IHostsContentObject>(
-    (i) => i.id === id,
-  )
+  let hosts_content = await swhdb.collection.hosts.find<IHostsContentObject>((i) => i.id === id)
   return hosts_content?.content || ''
 }
 
@@ -28,7 +26,7 @@ const getContentOfHosts = async (id: string): Promise<string> => {
 
   let list = await getList()
 
-  let multi_chose_folder_switch_all = await configGet('multi_chose_folder_switch_all');
+  let multi_chose_folder_switch_all = await configGet('multi_chose_folder_switch_all')
   let isSkipFolder = multi_chose_folder_switch_all && hosts.folder_mode !== 1
 
   if (type === 'folder' && !isSkipFolder) {

src/main/actions/hosts/getHistoryList.ts

@@ -5,7 +5,7 @@
  */
 
 import { swhdb } from '@main/data'
-import { IHostsHistoryObject } from '@root/common/data'
+import { IHostsHistoryObject } from '@common/data'
 
 export default async (): Promise<IHostsHistoryObject[]> => {
   let list = await swhdb.collection.history.all<IHostsHistoryObject>()

src/main/actions/hosts/refresh.ts

@@ -9,9 +9,9 @@ import { broadcast } from '@main/core/agent'
 
 import { swhdb } from '@main/data'
 import { GET } from '@main/libs/request'
-import { IHostsListObject, IOperationResult } from '@root/common/data'
-import events from '@root/common/events'
-import * as hostsFn from '@root/common/hostsFn'
+import { IHostsListObject, IOperationResult } from '@common/data'
+import events from '@common/events'
+import * as hostsFn from '@common/hostsFn'
 import dayjs from 'dayjs'
 import * as fs from 'fs'
 import { URL } from 'url'

src/main/actions/hosts/setContent.ts

@@ -4,12 +4,10 @@
  */
 
 import { swhdb } from '@main/data'
-import { IHostsContentObject } from '@root/common/data'
+import { IHostsContentObject } from '@common/data'
 
 export default async (id: string, content: string) => {
-  let d = await swhdb.collection.hosts.find<IHostsContentObject>(
-    (i) => i.id === id,
-  )
+  let d = await swhdb.collection.hosts.find<IHostsContentObject>((i) => i.id === id)
   if (!d || !d._id) {
     await swhdb.collection.hosts.insert({ id, content })
   } else {

src/main/actions/hosts/setSystemHosts.ts

@@ -3,19 +3,14 @@
  * @homepage: https://oldj.net
  */
 
-import {
-  configGet,
-  deleteHistory,
-  getHistoryList,
-  updateTrayTitle,
-} from '@main/actions'
+import { configGet, deleteHistory, getHistoryList, updateTrayTitle } from '@main/actions'
 import tryToRun from '@main/actions/cmd/tryToRun'
 import { broadcast } from '@main/core/agent'
 import { swhdb } from '@main/data'
 import safePSWD from '@main/libs/safePSWD'
 import { IHostsWriteOptions } from '@main/types'
-import { IHostsHistoryObject } from '@root/common/data'
-import events from '@root/common/events'
+import { IHostsHistoryObject } from '@common/data'
+import events from '@common/events'
 import { exec } from 'child_process'
 import * as fs from 'fs'
 import md5 from 'md5'
@@ -68,15 +63,9 @@ const addHistory = async (content: string) => {
   }
 }
 
-const writeWithSudo = (
-  sys_hosts_path: string,
-  content: string,
-): Promise<IWriteResult> =>
+const writeWithSudo = (sys_hosts_path: string, content: string): Promise<IWriteResult> =>
   new Promise((resolve) => {
-    let tmp_fn = path.join(
-      os.tmpdir(),
-      `swh_${new Date().getTime()}_${Math.random()}.txt`,
-    )
+    let tmp_fn = path.join(os.tmpdir(), `swh_${new Date().getTime()}_${Math.random()}.txt`)
     fs.writeFileSync(tmp_fn, content, 'utf-8')
 
     let cmd = [
@@ -117,10 +106,7 @@ const writeWithSudo = (
     })
   })
 
-const write = async (
-  content: string,
-  options?: IHostsWriteOptions,
-): Promise<IWriteResult> => {
+const write = async (content: string, options?: IHostsWriteOptions): Promise<IWriteResult> => {
   const sys_hosts_path = await getPathOfSystemHosts()
   const fn_md5 = await md5File(sys_hosts_path)
   const content_md5 = md5(content)
@@ -184,8 +170,7 @@ const makeAppendContent = async (content: string): Promise<string> => {
   const old_content = await fs.promises.readFile(sys_hosts_path, 'utf-8')
 
   let index = old_content.indexOf(CONTENT_START)
-  let new_content =
-    index > -1 ? old_content.substring(0, index).trimEnd() : old_content
+  let new_content = index > -1 ? old_content.substring(0, index).trimEnd() : old_content
 
   if (!content) {
     return new_content + '\n'
@@ -210,10 +195,7 @@ const setSystemHosts = async (
   if (success) {
     if (typeof old_content === 'string') {
       let histories = await getHistoryList()
-      if (
-        histories.length === 0 ||
-        histories[histories.length - 1].content !== old_content
-      ) {
+      if (histories.length === 0 || histories[histories.length - 1].content !== old_content) {
         await addHistory(old_content)
       }
     }

src/main/actions/list/getContentOfList.ts

@@ -4,9 +4,9 @@
  */
 
 import { configGet, getHostsContent } from '@main/actions'
-import { IHostsListObject } from '@root/common/data'
-import { flatten } from '@root/common/hostsFn'
-import normalize, { INormalizeOptions } from '@root/common/normalize'
+import { IHostsListObject } from '@common/data'
+import { flatten } from '@common/hostsFn'
+import normalize, { INormalizeOptions } from '@common/normalize'
 
 const getContentOfList = async (list: IHostsListObject[]): Promise<string> => {
   const content_list: string[] = []

src/main/actions/list/getItem.ts

@@ -4,8 +4,8 @@
  */
 
 import { getList } from '@main/actions'
-import { IHostsListObject } from '@root/common/data'
-import { findItemById } from '@root/common/hostsFn'
+import { IHostsListObject } from '@common/data'
+import { findItemById } from '@common/hostsFn'
 
 export default async (id: string): Promise<IHostsListObject | undefined> => {
   let list = await getList()

src/main/actions/list/getList.ts

@@ -4,7 +4,7 @@
  */
 
 import { swhdb } from '@main/data'
-import { IHostsListObject } from '@root/common/data'
+import { IHostsListObject } from '@common/data'
 
 export default async (): Promise<IHostsListObject[]> => {
   return await swhdb.list.tree.all()

src/main/actions/list/moveItemToTrashcan.ts

@@ -6,9 +6,9 @@
 import { getList } from '@main/actions'
 import { broadcast } from '@main/core/agent'
 import { swhdb } from '@main/data'
-import { IHostsListObject, ITrashcanObject } from '@root/common/data'
-import events from '@root/common/events'
-import * as hostsFn from '@root/common/hostsFn'
+import { IHostsListObject, ITrashcanObject } from '@common/data'
+import events from '@common/events'
+import * as hostsFn from '@common/hostsFn'
 
 export default async (id: string) => {
   let list: IHostsListObject[] = await getList()

src/main/actions/list/setList.ts

@@ -4,7 +4,7 @@
  */
 
 import { swhdb } from '@main/data'
-import { IHostsListObject } from '@root/common/data'
+import { IHostsListObject } from '@common/data'
 
 export default async (list: IHostsListObject[]) => {
   await swhdb.list.tree.set(list)

src/main/actions/migrate/export.ts

@@ -9,7 +9,7 @@ import { swhdb } from '@main/data'
 import { dialog } from 'electron'
 import { promises as fs } from 'fs'
 import * as path from 'path'
-import version from '@root/version.json'
+import version from '@/version.json'
 
 export default async (): Promise<string | null | false> => {
   let { lang } = await getI18N()

src/main/actions/migrate/importFromUrl.ts

@@ -13,7 +13,7 @@ export default async (url: string): Promise<boolean | null | string> => {
   let res
   try {
     res = await GET(url)
-  } catch (e) {
+  } catch (e: any) {
     console.error(e)
     return e.message
   }
@@ -35,11 +35,7 @@ export default async (url: string): Promise<boolean | null | string> => {
     data = res.data
   }
 
-  if (
-    typeof data !== 'object' ||
-    !data.version ||
-    !Array.isArray(data.version)
-  ) {
+  if (typeof data !== 'object' || !data.version || !Array.isArray(data.version)) {
     return 'invalid_data'
   }
 

src/main/actions/migrate/importV3Data.ts

@@ -7,8 +7,8 @@
 // import data from v3 to v4
 
 import { swhdb } from '@main/data'
-import { cleanHostsList, flatten } from '@root/common/hostsFn'
-import version from '@root/version.json'
+import { cleanHostsList, flatten } from '@common/hostsFn'
+import version from '@/version.json'
 
 export default async (old_data: any) => {
   old_data = cleanHostsList(old_data)

src/main/actions/migrate/migrateData.ts

@@ -8,9 +8,9 @@
 
 import importV3Data from '@main/actions/migrate/importV3Data'
 import getDataFolder from '@main/libs/getDataDir'
-import { IHostsBasicData, VersionType } from '@root/common/data'
-import { cleanHostsList } from '@root/common/hostsFn'
-import version from '@root/version.json'
+import { IHostsBasicData, VersionType } from '@common/data'
+import { cleanHostsList } from '@common/hostsFn'
+import version from '@/version.json'
 import * as fs from 'fs'
 import path from 'path'
 

src/main/actions/trashcan/clear.ts

@@ -4,7 +4,7 @@
  */
 
 import { swhdb } from '@main/data'
-import { flatten } from '@root/common/hostsFn'
+import { flatten } from '@common/hostsFn'
 
 export default async () => {
   let trashcan_items = await swhdb.list.trashcan.all()

src/main/actions/trashcan/deleteItem.ts

@@ -4,15 +4,13 @@
  */
 
 import { swhdb } from '@main/data'
-import { ITrashcanListObject } from '@root/common/data'
-import { flatten } from '@root/common/hostsFn'
+import { ITrashcanListObject } from '@common/data'
+import { flatten } from '@common/hostsFn'
 
 export default async (id: string): Promise<boolean> => {
   // Permanently delete the specified item with id.
 
-  let trashcan_item: ITrashcanListObject = await swhdb.list.trashcan.find(
-    (i) => i.data.id === id,
-  )
+  let trashcan_item: ITrashcanListObject = await swhdb.list.trashcan.find((i) => i.data.id === id)
 
   if (!trashcan_item) {
     console.log(`can't find trashcan_item with id #${id}.`)

src/main/actions/trashcan/getList.ts

@@ -4,7 +4,7 @@
  */
 
 import { swhdb } from '@main/data'
-import { IHostsListObject } from '@root/common/data'
+import { IHostsListObject } from '@common/data'
 
 export default async (): Promise<IHostsListObject[]> => {
   return await swhdb.list.trashcan.all()

src/main/actions/trashcan/restoreItem.ts

@@ -5,16 +5,11 @@
 
 import { getList, setList } from '@main/actions'
 import { swhdb } from '@main/data'
-import { getNodeById } from '@root/common/tree'
-import {
-  IHostsListObject,
-  ITrashcanListObject,
-} from '@root/common/data'
+import { getNodeById } from '@common/tree'
+import { IHostsListObject, ITrashcanListObject } from '@common/data'
 
 export default async (id: string): Promise<boolean> => {
-  let trashcan_item: ITrashcanListObject = await swhdb.list.trashcan.find(
-    (i) => i.data.id === id,
-  )
+  let trashcan_item: ITrashcanListObject = await swhdb.list.trashcan.find((i) => i.data.id === id)
 
   if (!trashcan_item) {
     console.log(`can't find trashcan_item with id #${id}.`)

src/main/actions/updateTrayTitle.ts

@@ -7,7 +7,7 @@
 import { getList } from '@main/actions/index'
 import { cfgdb } from '@main/data'
 import { tray } from '@main/ui/tray'
-import { flatten } from '@root/common/hostsFn'
+import { flatten } from '@common/hostsFn'
 
 export default async (show?: boolean, title?: string) => {
   if (!tray) return

src/main/core/getI18N.ts

@@ -5,8 +5,8 @@
  */
 
 import { configGet } from '@main/actions'
-import { LocaleName } from '@root/common/i18n'
-import { I18N } from '@root/common/i18n'
+import { LocaleName } from '@common/i18n'
+import { I18N } from '@common/i18n'
 
 export default async (locale?: LocaleName): Promise<I18N> => {
   if (!locale) {

src/main/core/popupMenu.ts

@@ -5,7 +5,7 @@
  */
 
 import { broadcast } from '@main/core/agent'
-import { IPopupMenuOption } from '@root/common/types'
+import { IPopupMenuOption } from '@common/types'
 import { ipcMain, Menu, MenuItem } from 'electron'
 
 ipcMain.on('x_popup_menu', (e, options: IPopupMenuOption) => {

src/main/http/api/list.ts

@@ -5,15 +5,15 @@
  */
 
 import { getList } from '@main/actions'
-import { IHostsListObject } from '@root/common/data'
-import { flatten } from '@root/common/hostsFn'
+import { IHostsListObject } from '@common/data'
+import { flatten } from '@common/hostsFn'
 import { Request, Response } from 'express'
 
 const list = async (req: Request, res: Response) => {
   let list: IHostsListObject[]
   try {
     list = await getList()
-  } catch (e) {
+  } catch (e: any) {
     res.end(
       JSON.stringify({
         success: false,

src/main/http/api/toggle.ts

@@ -6,8 +6,8 @@
 
 import { getList } from '@main/actions'
 import { broadcast } from '@main/core/agent'
-import events from '@root/common/events'
-import { findItemById } from '@root/common/hostsFn'
+import events from '@common/events'
+import { findItemById } from '@common/hostsFn'
 import { Request, Response } from 'express'
 
 const toggle = async (req: Request, res: Response) => {

src/main/http/index.ts

@@ -4,7 +4,7 @@
  * @homepage: https://oldj.net
  */
 
-import { http_api_port } from '@root/common/constants'
+import { http_api_port } from '@common/constants'
 import express from 'express'
 import { Server } from 'http'
 import api_router from './api/index'
@@ -37,9 +37,7 @@ export const start = (http_api_only_local: boolean): boolean => {
   try {
     let listenIp = http_api_only_local ? '127.0.0.1' : '0.0.0.0'
     server = app.listen(http_api_port, listenIp, function () {
-      console.log(
-        `SwitchHosts HTTP server is listening on port ${http_api_port}!`,
-      )
+      console.log(`SwitchHosts HTTP server is listening on port ${http_api_port}!`)
       console.log(`-> http://${listenIp}:${http_api_port}`)
     })
   } catch (e) {

src/main/libs/cron.ts

@@ -6,9 +6,9 @@
 
 import { checkUpdate, getList, refreshHosts } from '@main/actions'
 import { broadcast } from '@main/core/agent'
-import { IHostsListObject } from '@root/common/data'
-import events from '@root/common/events'
-import { flatten } from '@root/common/hostsFn'
+import { IHostsListObject } from '@common/data'
+import events from '@common/events'
+import { flatten } from '@common/hostsFn'
 
 let t: any
 let ts_last_server_check = 0

src/main/libs/getIndex.ts

@@ -14,7 +14,7 @@ export default (): string => {
     index = 'http://127.0.0.1:8220'
   } else {
     index = url.format({
-      pathname: path.join(__dirname, 'renderer', 'index.html'),
+      pathname: path.join(__dirname, 'index.html'),
       protocol: 'file:',
       slashes: true,
     })

src/main/libs/request.ts

@@ -7,7 +7,7 @@
 import { configGet } from '@main/actions'
 import axios, { AxiosRequestConfig } from 'axios'
 import querystring from 'querystring'
-import version from '@root/version.json'
+import version from '@/version.json'
 
 interface IParams {
   [key: string]: string | string[] | number

src/main/libs/tracer.ts

@@ -1,6 +1,6 @@
 import { configGet } from '@main/actions'
 import { GET } from '@main/libs/request'
-import { server_url } from '@root/common/constants'
+import { server_url } from '@common/constants'
 
 class Tracer {
   data: string[]

src/main/main.ts

@@ -1,3 +1,9 @@
+/**
+ * main.ts
+ * @author oldj
+ * @homepage https://oldj.net
+ */
+
 import { configAll, configGet } from '@main/actions'
 import '@main/core/agent'
 import * as message from '@main/core/message'
@@ -12,7 +18,7 @@ import checkSystemLocale from '@main/ui/checkSystemLocale'
 import * as find from '@main/ui/find'
 import { makeMainMenu } from '@main/ui/menu'
 import '@main/ui/tray'
-import version from '@root/version.json'
+import version from '@/version.json'
 import { app, BrowserWindow, ipcMain, nativeTheme } from 'electron'
 import windowStateKeeper from 'electron-window-state'
 import * as path from 'path'

src/main/preload.ts

@@ -5,7 +5,7 @@
  */
 
 import { Actions } from '@main/types'
-import { IPopupMenuOption } from '@root/common/types'
+import { IPopupMenuOption } from '@common/types'
 import { contextBridge, ipcRenderer } from 'electron'
 import { EventEmitter } from 'events'
 

src/main/types.d.ts

@@ -5,7 +5,7 @@
  */
 
 import Tracer from '@main/libs/tracer'
-import { LocaleName } from '@root/common/i18n'
+import { LocaleName } from '@common/i18n'
 import SwhDb from 'potdb'
 import { BrowserWindow, WebContents } from 'electron'
 import * as actions from './actions'

src/main/ui/checkSystemLocale.ts

@@ -3,7 +3,7 @@
  * @homepage: https://oldj.net
  */
 
-import { languages, LocaleName } from '@root/common/i18n'
+import { languages, LocaleName } from '@common/i18n'
 import { app } from 'electron'
 
 const isLocaleName = (locale: string): locale is LocaleName => {

src/main/ui/find.ts

@@ -6,7 +6,7 @@
 import { broadcast } from '@main/core/agent'
 import getIndex from '@main/libs/getIndex'
 import isDev from '@main/libs/isDev'
-import events from '@root/common/events'
+import events from '@common/events'
 import { BrowserWindow } from 'electron'
 import path from 'path'
 

src/main/ui/menu.ts

@@ -4,16 +4,10 @@
  */
 
 import { findShow } from '@main/actions'
-import events from '@root/common/events'
-import {
-  BrowserWindow,
-  Menu,
-  MenuItem,
-  MenuItemConstructorOptions,
-  shell,
-} from 'electron'
-import { I18N, LocaleName } from '@root/common/i18n'
-import { homepage_url, feedback_url } from '@root/common/constants'
+import events from '@common/events'
+import { BrowserWindow, Menu, MenuItem, MenuItemConstructorOptions, shell } from 'electron'
+import { I18N, LocaleName } from '@common/i18n'
+import { homepage_url, feedback_url } from '@common/constants'
 import { broadcast } from '@main/core/agent'
 
 export const makeMainMenu = (locale: LocaleName = 'en') => {
@@ -123,8 +117,7 @@ export const makeMainMenu = (locale: LocaleName = 'en') => {
         },
         {
           label: lang.toggle_developer_tools, // 'Toggle Developer Tools',
-          accelerator:
-            process.platform === 'darwin' ? 'Alt+Command+I' : 'Ctrl+Shift+I',
+          accelerator: process.platform === 'darwin' ? 'Alt+Command+I' : 'Ctrl+Shift+I',
           click(item: MenuItem, focusedWindow: BrowserWindow | undefined) {
             if (focusedWindow) focusedWindow.webContents.toggleDevTools()
           },
@@ -282,8 +275,7 @@ export const makeMainMenu = (locale: LocaleName = 'en') => {
       // },
     ]
   } else if (os === 'win32' || os === 'linux') {
-    let submenu = (template[0] &&
-      template[0].submenu) as MenuItemConstructorOptions[]
+    let submenu = (template[0] && template[0].submenu) as MenuItemConstructorOptions[]
 
     if (submenu) {
       submenu.unshift({
@@ -308,8 +300,7 @@ export const makeMainMenu = (locale: LocaleName = 'en') => {
     }
 
     // VIEW
-    submenu = (template[2] &&
-      template[2].submenu) as MenuItemConstructorOptions[]
+    submenu = (template[2] && template[2].submenu) as MenuItemConstructorOptions[]
     submenu.splice(0, 4)
   }
 

src/main/ui/tray/index.ts

@@ -7,17 +7,10 @@
 import { configGet, configSet, updateTrayTitle } from '@main/actions'
 import { broadcast } from '@main/core/agent'
 import { makeWindow } from '@main/ui/tray/window'
-import events from '@root/common/events'
-import { I18N } from '@root/common/i18n'
-import version from '@root/version.json'
-import {
-  app,
-  BrowserWindow,
-  Menu,
-  MenuItemConstructorOptions,
-  screen,
-  Tray,
-} from 'electron'
+import events from '@common/events'
+import { I18N } from '@common/i18n'
+import version from '@/version.json'
+import { app, BrowserWindow, Menu, MenuItemConstructorOptions, screen, Tray } from 'electron'
 import * as path from 'path'
 
 let tray: Tray
@@ -152,8 +145,7 @@ const getPosition = () => {
   }
 
   if (x < 0) x = 0
-  if (x + window_bounds.width > screen_bounds.width)
-    x = screen_bounds.width - window_bounds.width
+  if (x + window_bounds.width > screen_bounds.width) x = screen_bounds.width - window_bounds.width
 
   x = Math.round(x)
   y = Math.round(y)
@@ -208,8 +200,7 @@ const window = () => {
 }
 
 const show = () => {
-  let { x, y } =
-    process.platform === 'linux' ? getLinuxPosition() : getPosition()
+  let { x, y } = process.platform === 'linux' ? getLinuxPosition() : getPosition()
   win.setPosition(x, y, true)
   win.show()
   // win.focus()

src/renderer/common/PageWrapper.tsx

@@ -0,0 +1,20 @@
+/**
+ * PageWrapper.tsx
+ * @author: oldj
+ * @homepage: https://oldj.net
+ */
+
+import Loading from '@renderer/components/Loading'
+import React, { Suspense } from 'react'
+
+interface IProps {
+  children?: React.ReactNode
+}
+
+function PageWrapper(props: IProps) {
+  const { children } = props
+
+  return <Suspense fallback={<Loading />}>{children}</Suspense>
+}
+
+export default PageWrapper

src/renderer/components/About/AboutContent.tsx

@@ -6,13 +6,13 @@
 
 import { Box, HStack, Image, VStack } from '@chakra-ui/react'
 import { default as Link } from '@renderer/components/BrowserLink'
-import logo from '@root/assets/[email protected]'
-import acknowledgements from '@root/common/acknowledgements'
-import { homepage_url, source_url } from '@root/common/constants'
-import useI18n from '@root/renderer/models/useI18n'
-import version from '@root/version.json'
+import logo from '@/assets/[email protected]'
+import acknowledgements from '@common/acknowledgements'
+import { homepage_url, source_url } from '@common/constants'
+import useI18n from '@renderer/models/useI18n'
+import version from '@/version.json'
 import React from 'react'
-import styles from './AboutContent.less'
+import styles from './AboutContent.module.scss'
 
 const AboutContent = () => {
   const { lang } = useI18n()

src/renderer/components/About/index.tsx

@@ -7,9 +7,9 @@
 import { Button, Modal, ModalBody, ModalContent, ModalFooter, ModalOverlay } from '@chakra-ui/react'
 import AboutContent from '@renderer/components/About/AboutContent'
 import useOnBroadcast from '@renderer/core/useOnBroadcast'
-import events from '@root/common/events'
+import events from '@common/events'
 import React, { useState } from 'react'
-import styles from './index.less'
+import styles from './index.module.scss'
 import useI18n from '@renderer/models/useI18n'
 
 const About = () => {

src/renderer/components/BrowserLink.tsx

@@ -5,7 +5,7 @@
  */
 
 import { actions, agent } from '@renderer/core/agent'
-import events from '@root/common/events'
+import events from '@common/events'
 import React from 'react'
 
 interface Props {

src/renderer/components/EditHostsInfo.tsx

@@ -29,16 +29,16 @@ import ItemIcon from '@renderer/components/ItemIcon'
 import Transfer from '@renderer/components/Transfer'
 import { actions, agent } from '@renderer/core/agent'
 import useOnBroadcast from '@renderer/core/useOnBroadcast'
-import { FolderModeType, HostsType, IHostsListObject } from '@root/common/data'
-import events from '@root/common/events'
-import * as hostsFn from '@root/common/hostsFn'
+import { FolderModeType, HostsType, IHostsListObject } from '@common/data'
+import events from '@common/events'
+import * as hostsFn from '@common/hostsFn'
 import lodash from 'lodash'
 import React, { useRef, useState } from 'react'
 import { BiEdit, BiTrash } from 'react-icons/bi'
 import { v4 as uuidv4 } from 'uuid'
 import useHostsData from '../models/useHostsData'
 import useI18n from '../models/useI18n'
-import styles from './EditHostsInfo.less'
+import styles from './EditHostsInfo.module.scss'
 
 const EditHostsInfo = () => {
   const { lang } = useI18n()

src/renderer/components/Editor/HostsEditor.less → src/renderer/components/Editor/HostsEditor.module.scss

@@ -1,7 +1,7 @@
 @import "../../styles/common";
 
 .root {
-  .code;
+  @include code;
   width: 100%;
   height: 100%;
 }
@@ -34,7 +34,7 @@
 
   :global {
     .CodeMirror {
-      font-family: @font-editor;
+      font-family: $font-editor;
       background: var(--swh-editor-bg-color);
       color: var(--swh-editor-text-color);
     }

src/renderer/components/Editor/HostsEditor.tsx

@@ -7,10 +7,10 @@
 import StatusBar from '@renderer/components/StatusBar'
 import { actions, agent } from '@renderer/core/agent'
 import useOnBroadcast from '@renderer/core/useOnBroadcast'
-import { IHostsListObject } from '@root/common/data'
-import events from '@root/common/events'
-import { IFindShowSourceParam } from '@root/common/types'
-import wait from '@root/common/utils/wait'
+import { IHostsListObject } from '@common/data'
+import events from '@common/events'
+import { IFindShowSourceParam } from '@common/types'
+import wait from '@common/utils/wait'
 import { useDebounceFn } from 'ahooks'
 import clsx from 'clsx'
 import CodeMirror from 'codemirror'
@@ -18,8 +18,8 @@ import 'codemirror/addon/comment/comment'
 import 'codemirror/addon/selection/mark-selection'
 import React, { useEffect, useRef, useState } from 'react'
 import modeHosts from './cm_hl'
-import './codemirror.less'
-import styles from './HostsEditor.less'
+import './codemirror.module.scss'
+import styles from './HostsEditor.module.scss'
 import useHostsData from '@renderer/models/useHostsData'
 
 modeHosts()

src/renderer/components/History.tsx

@@ -27,8 +27,8 @@ import {
 import HostsViewer from '@renderer/components/HostsViewer'
 import { actions } from '@renderer/core/agent'
 import useOnBroadcast from '@renderer/core/useOnBroadcast'
-import { IHostsHistoryObject } from '@root/common/data'
-import events from '@root/common/events'
+import { IHostsHistoryObject } from '@common/data'
+import events from '@common/events'
 import clsx from 'clsx'
 import dayjs from 'dayjs'
 import prettyBytes from 'pretty-bytes'
@@ -36,7 +36,7 @@ import React, { useState } from 'react'
 import { BiDetail, BiHelpCircle, BiHistory, BiTrash } from 'react-icons/bi'
 import useConfigs from '../models/useConfigs'
 import useI18n from '../models/useI18n'
-import styles from './History.less'
+import styles from './History.module.scss'
 
 interface IHistoryProps {
   list: IHostsHistoryObject[]

src/renderer/components/HostsViewer.less → src/renderer/components/HostsViewer.module.scss

@@ -1,7 +1,7 @@
 @import "../styles/common";
 
 .root {
-  .code;
+  @include code;
   height: 100%;
 }
 

src/renderer/components/HostsViewer.tsx

@@ -6,7 +6,7 @@
 
 import StatusBar from '@renderer/components/StatusBar'
 import React from 'react'
-import styles from './HostsViewer.less'
+import styles from './HostsViewer.module.scss'
 
 interface Props {
   content: string
@@ -27,11 +27,7 @@ const HostsViewer = (props: Props) => {
           <Line line={line} key={idx} />
         ))}
       </div>
-      <StatusBar
-        line_count={lines.length}
-        bytes={content.length}
-        read_only={true}
-      />
+      <StatusBar line_count={lines.length} bytes={content.length} read_only={true} />
     </div>
   )
 }

src/renderer/components/Lang.tsx

@@ -4,7 +4,7 @@
  * @homepage: https://oldj.net
  */
 
-import { LocaleName } from '@root/common/i18n'
+import { LocaleName } from '@common/i18n'
 import React from 'react'
 import useI18n from '@renderer/models/useI18n'
 

src/renderer/components/LeftPanel/SystemHostsItem.tsx

@@ -7,7 +7,7 @@
 import ItemIcon from '@renderer/components/ItemIcon'
 import clsx from 'clsx'
 import React from 'react'
-import styles from './SystemHostsItem.less'
+import styles from './SystemHostsItem.module.scss'
 import useI18n from '@renderer/models/useI18n'
 import useHostsData from '@renderer/models/useHostsData'
 

src/renderer/components/LeftPanel/Trashcan.tsx

@@ -6,12 +6,12 @@
 
 import { Center } from '@chakra-ui/react'
 import TrashcanItem from '@renderer/components/LeftPanel/TrashcanItem'
-import list_styles from '@renderer/components/List/index.less'
+import list_styles from '@renderer/components/List/index.module.scss'
 import { Tree } from '@renderer/components/Tree'
-import { ITrashcanListObject } from '@root/common/data'
+import { ITrashcanListObject } from '@common/data'
 import React, { useEffect, useState } from 'react'
 import { BiChevronRight } from 'react-icons/bi'
-import styles from './Trashcan.less'
+import styles from './Trashcan.module.scss'
 import useI18n from '@renderer/models/useI18n'
 import useHostsData from '@renderer/models/useHostsData'
 

src/renderer/components/LeftPanel/TrashcanItem.tsx

@@ -5,14 +5,14 @@
  */
 
 import ItemIcon from '@renderer/components/ItemIcon'
-import list_item_styles from '@renderer/components/List/ListItem.less'
+import list_item_styles from '@renderer/components/List/ListItem.module.scss'
 import { actions } from '@renderer/core/agent'
 import { PopupMenu } from '@renderer/core/PopupMenu'
-import { ITrashcanListObject } from '@root/common/data'
-import useI18n from '@root/renderer/models/useI18n'
+import { ITrashcanListObject } from '@common/data'
+import useI18n from '@renderer/models/useI18n'
 import clsx from 'clsx'
 import React from 'react'
-import styles from './TrashcanItem.less'
+import styles from './TrashcanItem.module.scss'
 import useHostsData from '@renderer/models/useHostsData'
 
 interface Props {

src/renderer/components/LeftPanel/index.less → src/renderer/components/LeftPanel/index.module.scss

@@ -9,6 +9,6 @@
 
 :global(.platform-win32) {
   .list {
-    .swh-scroll-y();
+    @include swh-scroll-y();
   }
 }

src/renderer/components/LeftPanel/index.tsx

@@ -8,10 +8,10 @@ import Trashcan from '@renderer/components/LeftPanel/Trashcan'
 import List from '@renderer/components/List'
 import { agent } from '@renderer/core/agent'
 import { PopupMenu } from '@renderer/core/PopupMenu'
-import events from '@root/common/events'
-import useI18n from '@root/renderer/models/useI18n'
+import events from '@common/events'
+import useI18n from '@renderer/models/useI18n'
 import React from 'react'
-import styles from './index.less'
+import styles from './index.module.scss'
 import useHostsData from '@renderer/models/useHostsData'
 
 interface Props {

src/renderer/components/List/ListItem.tsx

@@ -8,16 +8,16 @@ import ItemIcon from '@renderer/components/ItemIcon'
 import SwitchButton from '@renderer/components/SwitchButton'
 import { actions, agent } from '@renderer/core/agent'
 import { PopupMenu } from '@renderer/core/PopupMenu'
-import { IHostsListObject } from '@root/common/data'
-import { updateOneItem } from '@root/common/hostsFn'
+import { IHostsListObject } from '@common/data'
+import { updateOneItem } from '@common/hostsFn'
 import clsx from 'clsx'
 import React, { useEffect, useRef, useState } from 'react'
 import { BiEdit } from 'react-icons/bi'
 import { Center, ToastId, useToast } from '@chakra-ui/react'
 import scrollIntoView from 'smooth-scroll-into-view-if-needed'
-import styles from './ListItem.less'
-import events from '@root/common/events'
-import { IMenuItemOption } from '@root/common/types'
+import styles from './ListItem.module.scss'
+import events from '@common/events'
+import { IMenuItemOption } from '@common/types'
 import useI18n from '@renderer/models/useI18n'
 import useHostsData from '@renderer/models/useHostsData'
 

src/renderer/components/List/index.tsx

@@ -10,18 +10,18 @@ import ItemIcon from '@renderer/components/ItemIcon'
 import { Tree } from '@renderer/components/Tree'
 import { actions, agent } from '@renderer/core/agent'
 import useOnBroadcast from '@renderer/core/useOnBroadcast'
-import { IHostsListObject } from '@root/common/data'
-import events from '@root/common/events'
-import { findItemById, getNextSelectedItem, setOnStateOfItem } from '@root/common/hostsFn'
-import { IFindShowSourceParam } from '@root/common/types'
-import useI18n from '@root/renderer/models/useI18n'
+import { IHostsListObject } from '@common/data'
+import events from '@common/events'
+import { findItemById, getNextSelectedItem, setOnStateOfItem } from '@common/hostsFn'
+import { IFindShowSourceParam } from '@common/types'
+import useI18n from '@renderer/models/useI18n'
 import clsx from 'clsx'
 import React, { useEffect, useState } from 'react'
 import { BiChevronRight } from 'react-icons/bi'
-import styles from './index.less'
+import styles from './index.module.scss'
 import ListItem from './ListItem'
 import useConfigs from '@renderer/models/useConfigs'
-import useHostsData from '@root/renderer/models/useHostsData'
+import useHostsData from '@renderer/models/useHostsData'
 
 interface Props {
   is_tray?: boolean

src/renderer/components/Loading.tsx

@@ -5,7 +5,7 @@
  */
 
 import React from 'react'
-import styles from './Loading.less'
+import styles from './Loading.module.scss'
 import useI18n from '@renderer/models/useI18n'
 
 const Loading = () => {

src/renderer/components/MainPanel/index.tsx

@@ -6,9 +6,9 @@
 
 import HostsEditor from '@renderer/components/Editor/HostsEditor'
 import useOnBroadcast from '@renderer/core/useOnBroadcast'
-import events from '@root/common/events'
+import events from '@common/events'
 import React from 'react'
-import styles from './index.less'
+import styles from './index.module.scss'
 import { useToast } from '@chakra-ui/react'
 
 const MainPanel = () => {

src/renderer/components/Pref/Advanced.tsx

@@ -16,10 +16,10 @@ import {
   VStack,
 } from '@chakra-ui/react'
 import { actions } from '@renderer/core/agent'
-import { ConfigsType } from '@root/common/default_configs'
-import useI18n from '@root/renderer/models/useI18n'
+import { ConfigsType } from '@common/default_configs'
+import useI18n from '@renderer/models/useI18n'
 import React, { useEffect, useState } from 'react'
-import styles from './styles.less'
+import styles from './styles.module.scss'
 
 interface IProps {
   data: ConfigsType

src/renderer/components/Pref/Commands.tsx

@@ -14,8 +14,8 @@ import {
   VStack,
 } from '@chakra-ui/react'
 import CommandsHistory from '@renderer/components/Pref/CommandsHistory'
-import { ConfigsType } from '@root/common/default_configs'
-import useI18n from '@root/renderer/models/useI18n'
+import { ConfigsType } from '@common/default_configs'
+import useI18n from '@renderer/models/useI18n'
 import React, { useState } from 'react'
 
 interface IProps {

src/renderer/components/Pref/CommandsHistory.tsx

@@ -18,8 +18,8 @@ import {
   VStack,
 } from '@chakra-ui/react'
 import { actions } from '@renderer/core/agent'
-import { ICommandRunResult } from '@root/common/data'
-import useI18n from '@root/renderer/models/useI18n'
+import { ICommandRunResult } from '@common/data'
+import useI18n from '@renderer/models/useI18n'
 import dayjs from 'dayjs'
 import React, { useEffect, useState } from 'react'
 import { BiTrash } from 'react-icons/bi'

src/renderer/components/Pref/General.tsx

@@ -18,10 +18,10 @@ import {
   VStack,
 } from '@chakra-ui/react'
 import { agent } from '@renderer/core/agent'
-import { http_api_port } from '@root/common/constants'
-import { ConfigsType, ThemeType } from '@root/common/default_configs'
-import { LocaleName } from '@root/common/i18n'
-import useI18n from '@root/renderer/models/useI18n'
+import { http_api_port } from '@common/constants'
+import { ConfigsType, ThemeType } from '@common/default_configs'
+import { LocaleName } from '@common/i18n'
+import useI18n from '@renderer/models/useI18n'
 import React from 'react'
 
 interface IProps {

src/renderer/components/Pref/Proxy.tsx

@@ -15,8 +15,8 @@ import {
   Select,
   VStack,
 } from '@chakra-ui/react'
-import { ConfigsType, ProtocolType } from '@root/common/default_configs'
-import useI18n from '@root/renderer/models/useI18n'
+import { ConfigsType, ProtocolType } from '@common/default_configs'
+import useI18n from '@renderer/models/useI18n'
 import React, { useState } from 'react'
 
 interface IProps {

src/renderer/components/Pref/index.tsx

@@ -24,16 +24,16 @@ import {
 import Proxy from '@renderer/components/Pref/Proxy'
 import { agent } from '@renderer/core/agent'
 import useOnBroadcast from '@renderer/core/useOnBroadcast'
-import { ConfigsType } from '@root/common/default_configs'
-import events from '@root/common/events'
-import useConfigs from '@root/renderer/models/useConfigs'
-import useI18n from '@root/renderer/models/useI18n'
+import { ConfigsType } from '@common/default_configs'
+import events from '@common/events'
+import useConfigs from '@renderer/models/useConfigs'
+import useI18n from '@renderer/models/useI18n'
 import React, { useEffect, useState } from 'react'
 import { BiSliderAlt } from 'react-icons/bi'
 import Advanced from './Advanced'
 import Commands from './Commands'
 import General from './General'
-import styles from './styles.less'
+import styles from './styles.module.scss'
 
 const PreferencePanel = () => {
   const [is_open, setIsOpen] = useState(false)

src/renderer/components/SetWriteMode.tsx

@@ -18,10 +18,10 @@ import {
 } from '@chakra-ui/react'
 import { agent } from '@renderer/core/agent'
 import useOnBroadcast from '@renderer/core/useOnBroadcast'
-import events from '@root/common/events'
+import events from '@common/events'
 import React, { useState } from 'react'
-import styles from './SetWriteMode.less'
-import { WriteModeType } from '@root/common/default_configs'
+import styles from './SetWriteMode.module.scss'
+import { WriteModeType } from '@common/default_configs'
 import useI18n from '@renderer/models/useI18n'
 import useConfigs from '../models/useConfigs'
 

src/renderer/components/StatusBar.tsx

@@ -7,7 +7,7 @@
 import { Box, Flex, HStack, Spacer } from '@chakra-ui/react'
 import React from 'react'
 import prettyBytes from 'pretty-bytes'
-import styles from './StatusBar.less'
+import styles from './StatusBar.module.scss'
 import useI18n from '../models/useI18n'
 
 interface Props {