Add eslint & prettier

Author: skryukov

.prettierignore

@@ -0,0 +1,5 @@
+# Ignore artifacts:
+build
+coverage
+
+app/frontend/routes

.prettierrc

@@ -0,0 +1,11 @@
+{
+  "printWidth": 80,
+  "semi": false,
+  "tabWidth": 2,
+  "trailingComma": "all",
+  "plugins": [
+    "prettier-plugin-svelte",
+    "prettier-plugin-tailwindcss"
+  ],
+  "overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
+}

app/frontend/entrypoints/inertia.ts

@@ -1,5 +1,5 @@
-import { createInertiaApp, type ResolvedComponent } from '@inertiajs/svelte'
-import { mount } from 'svelte'
+import { type ResolvedComponent, createInertiaApp } from "@inertiajs/svelte"
+import { mount } from "svelte"
 
 createInertiaApp({
   // Set default page title
@@ -13,7 +13,7 @@ createInertiaApp({
   // progress: false,
 
   resolve: (name) => {
-    const pages = import.meta.glob<ResolvedComponent>('../pages/**/*.svelte', {
+    const pages = import.meta.glob<ResolvedComponent>("../pages/**/*.svelte", {
       eager: true,
     })
     const page = pages[`../pages/${name}.svelte`]
@@ -35,8 +35,8 @@ createInertiaApp({
       mount(App, { target: el, props })
     } else {
       console.error(
-        'Missing root element.\n\n' +
-          'If you see this error, it probably means you load Inertia.js on non-Inertia pages.\n' +
+        "Missing root element.\n\n" +
+          "If you see this error, it probably means you load Inertia.js on non-Inertia pages.\n" +
           'Consider moving <%= vite_typescript_tag "inertia" %> to the Inertia-specific layout instead.',
       )
     }

eslint.config.js

@@ -0,0 +1,76 @@
+// eslint.config.js
+import js from '@eslint/js';
+import svelte from 'eslint-plugin-svelte';
+import globals from 'globals';
+import ts from 'typescript-eslint';
+import svelteConfig from './svelte.config.js';
+import eslintConfigPrettier from "eslint-config-prettier/flat";
+import importPlugin from "eslint-plugin-import"
+
+export default ts.config(
+  js.configs.recommended,
+  ...ts.configs.recommended,
+  ...svelte.configs.recommended,
+  {
+    languageOptions: {
+      globals: {
+        ...globals.browser,
+        ...globals.node
+      }
+    }
+  },
+  {
+    files: ['**/*.svelte', '**/*.svelte.ts', '**/*.svelte.js'],
+    // See more details at: https://typescript-eslint.io/packages/parser/
+    languageOptions: {
+      parserOptions: {
+        projectService: true,
+        extraFileExtensions: ['.svelte'], // Add support for additional file extensions, such as .svelte
+        parser: ts.parser,
+        // Specify a parser for each language, if needed:
+        // parser: {
+        //   ts: ts.parser,
+        //   js: espree,    // Use espree for .js files (add: import espree from 'espree')
+        //   typescript: ts.parser
+        // },
+
+        // We recommend importing and specifying svelte.config.js.
+        // By doing so, some rules in eslint-plugin-svelte will automatically read the configuration and adjust their behavior accordingly.
+        // While certain Svelte settings may be statically loaded from svelte.config.js even if you don’t specify it,
+        // explicitly specifying it ensures better compatibility and functionality.
+        svelteConfig
+      }
+    }
+  },
+  {
+    ...importPlugin.flatConfigs.recommended,
+    ...importPlugin.flatConfigs.typescript,
+    rules: {
+      "import/order": [
+        "error",
+        {
+          pathGroups: [
+            {
+              pattern: "@/**",
+              group: "external",
+              position: "after",
+            },
+          ],
+          "newlines-between": "always",
+          "named": true,
+          alphabetize: { order: "asc" },
+        },
+      ],
+      "import/first": "error",
+      "import/extensions": ["error", "never", { "svg": "always", "png": "always", "jpg": "always", "webp": "always", "svelte": "always", "css": "always" }],
+      "@typescript-eslint/consistent-type-imports": "error",
+    },
+  },
+  eslintConfigPrettier,
+  {
+    rules: {
+      // Override or add rule settings here, such as:
+      // 'svelte/rule-name': 'error'
+    }
+  }
+);