feat: add import sorting rule in eslint

Author: notwindstone

eslint.config.js

@@ -41,17 +41,17 @@ export default defineConfigWithVueTs(
     "rules": {
 
       /* Disabled rules */
-      "vue/multi-word-component-names"  : ["off"], // why do I need to use multiple words for a 'Layout' component, for example?
-      "vue/no-multiple-template-root"   : ["off"], // no need for this rule since Vue 3.x
-      "unicorn/no-null"                 : ["off"], // the second argument of 'JSON#stringify' doesn't accept 'undefined' to save formatting
-      "unicorn/prefer-global-this"      : ["off"], // no need for this rule since this app is fully CSR, and Web Workers are not going to be used
-      "unicorn/prefer-top-level-await"  : ["off"], // top level await is broken somehow
+      "vue/multi-word-component-names"  : ["off"], // Why do I need to use multiple words for a 'Layout' component, for example?
+      "vue/no-multiple-template-root"   : ["off"], // No need for this rule since Vue 3.x
+      "unicorn/no-null"                 : ["off"], // The second argument of 'JSON#stringify' doesn't accept 'undefined' to save formatting
+      "unicorn/prefer-global-this"      : ["off"], // No need for this rule since this app is fully CSR, and Web Workers are not going to be used
+      "unicorn/prefer-top-level-await"  : ["off"], // Top level await is broken somehow
       "unicorn/prefer-query-selector"   : ["off"], // 'getElementById' is a lot easier to use
-      "unicorn/prefer-at"               : ["off"], // requires a different lib version
-      "@stylistic/no-multi-spaces"      : ["off"], // conflicts with 'eslint@stylistic/key-spacing'
+      "unicorn/prefer-at"               : ["off"], // Requires a different lib version
+      "@stylistic/no-multi-spaces"      : ["off"], // Conflicts with 'eslint@stylistic/key-spacing'
       "@stylistic/line-comment-position": ["off"], // I don't see any problems using both above and beside comments
-      "@stylistic/linebreak-style"      : ["off"], // conflicts with git
-      "@stylistic/eol-last"             : ["off"], // conflicts with git
+      "@stylistic/linebreak-style"      : ["off"], // Conflicts with git
+      "@stylistic/eol-last"             : ["off"], // Conflicts with git
 
       /* Important */
       "@stylistic/semi"              : ["error", "always"],
@@ -65,6 +65,13 @@ export default defineConfigWithVueTs(
 
       /* ESLint */
       "capitalized-comments": ["warn", "always"],
+      "sort-imports"        : ["warn", {
+        "allowSeparatedGroups" : false,
+        "ignoreCase"           : false,
+        "ignoreDeclarationSort": false,
+        "ignoreMemberSort"     : false,
+        "memberSyntaxSortOrder": ["multiple", "single", "all", "none"],
+      }],
 
       // Element IDs simplify styling for plugins
       "@vue-require-id/require-id": ["warn", {

src/App.vue

@@ -5,7 +5,7 @@ import ErrorBoundary from "@/components/handlers/ErrorBoundary.vue";
 import GlobalError from "@/components/statuses/GlobalError.vue";
 import ExtensionsError from "@/components/statuses/ExtensionsError.vue";
 import NonBundledClasses from "@/components/misc/NonBundledClasses.vue";
-import { provide, shallowReactive, nextTick, defineAsyncComponent } from "vue";
+import { defineAsyncComponent, nextTick, provide, shallowReactive } from "vue";
 import {
   ApplicationNamespace, ContextMenuItems,
   GlobalStatesChangerContextKey,

src/main.ts

@@ -1,19 +1,17 @@
+import App from "@/App.vue";
 import { ApplicationRootID } from "@/constants/application";
 import { createApp } from "vue";
-import { initializeLauncher } from "@/lib/main/initialize-launcher.ts";
 import { declareWindow } from "@/lib/main/declare-window.ts";
+import { initializeLauncher } from "@/lib/main/initialize-launcher.ts";
 import { log } from "@/lib/handlers/log.ts";
 import { prepareLogFile } from "@/lib/main/prepare-log-file.ts";
-import App from "@/App.vue";
 // Import UnoCSS essentials
 import "virtual:uno.css";
 // Reset all CSS styles in a Tailwind style
 import "@unocss/reset/tailwind.css";
 import "@/globals.css";
 // Import styles that are necessary for Material You ripple effect
 import "m3ripple-vue/style.css";
-// import "core-js/actual";
-// asdf.
 
 await prepareLogFile().catch((error: unknown) => {
   log.error("Failed to prepare a log file:", JSON.stringify(error));