config

Author: connorabbas

eslint.config.js

@@ -1,31 +1,57 @@
-import prettier from 'eslint-config-prettier';
 import vue from 'eslint-plugin-vue';
-
 import {
     defineConfigWithVueTs,
     vueTsConfigs,
 } from '@vue/eslint-config-typescript';
+import eslint from '@eslint/js';
+import globals from 'globals';
 
-export default defineConfigWithVueTs(
-    vue.configs['flat/recommended'],
-    vueTsConfigs.recommended,
+export default [
+    // Global ignores
     {
         ignores: [
-            'vendor',
             'node_modules',
+            'vendor',
+            'dist',
             'public',
             'bootstrap/ssr',
         ],
     },
+    // JavaScript files
     {
-        rules: {
-            'vue/require-default-prop': 'off',
-            'vue/attribute-hyphenation': 'off',
-            'vue/v-on-event-hyphenation': 'off',
-            'vue/multi-word-component-names': 'off',
-            'vue/block-lang': 'off',
-            '@typescript-eslint/no-explicit-any': 'off',
+        files: ['**/*.js'],
+        ...eslint.configs.recommended,
+        languageOptions: {
+            ecmaVersion: 'latest',
+            sourceType: 'module',
+            globals: {
+                ...globals.browser,
+                ...globals.node,
+                process: 'readonly',
+                module: 'readonly',
+                require: 'readonly',
+                window: 'readonly',
+            },
         },
     },
-    prettier
-);
+    // Vue and TypeScript files
+    ...defineConfigWithVueTs(
+        vue.configs['flat/recommended'],
+        vueTsConfigs.recommended,
+        {
+            rules: {
+                'vue/require-default-prop': 'off',
+                'vue/attribute-hyphenation': 'off',
+                'vue/v-on-event-hyphenation': 'off',
+                'vue/multi-word-component-names': 'off',
+                'vue/block-lang': 'off',
+                'vue/no-v-html': 'off',
+                'vue/html-indent': ['error', 4],
+                '@typescript-eslint/no-explicit-any': 'off',
+                indent: ['error', 4],
+                semi: ['error', 'always'],
+                'linebreak-style': ['error', 'unix'],
+            },
+        }
+    ),
+];

jsconfig.json

@@ -4,7 +4,7 @@
     "scripts": {
         "dev": "vite",
         "build": "vite build",
-        "lint": "eslint ."
+        "lint": "eslint . --fix"
     },
     "devDependencies": {
         "@eslint/js": "^9.18.0",
@@ -28,7 +28,6 @@
         "@vueuse/core": "^13.0.0",
         "globals": "^16.0.0",
         "laravel-vite-plugin": "^1.2.0",
-        "lodash": "^4.17.21",
         "lodash-es": "^4.17.21",
         "lucide-vue-next": "^0.485.0",
         "primevue": "^4.3.3",

package.json

@@ -15,10 +15,9 @@ import PageTitleSection from '@/components/PageTitleSection.vue';
 import customThemePreset from '@/theme/noir-preset';
 import { useColorMode } from '@vueuse/core';
 
+/* global Ziggy */
 const appName = import.meta.env.VITE_APP_NAME || 'Laravel';
-
-// Set Light/Dark Color Mode
-const colorMode = useColorMode({ emitAuto: true });
+const colorMode = useColorMode({ emitAuto: true }); // Set Light/Dark Color Mode
 
 createInertiaApp({
     title: (title) => `${title} - ${appName}`,

resources/js/app.js

@@ -4,7 +4,6 @@
         "allowImportingTsExtensions": true,
         "module": "ESNext",
         "moduleResolution": "bundler",
-        "jsx": "preserve",
         "strict": true,
         "isolatedModules": true,
         "target": "ESNext",
@@ -25,5 +24,9 @@
         "resources/js/**/*.ts",
         "resources/js/**/*.d.ts",
         "resources/js/**/*.vue"
+    ],
+    "exclude": [
+        "node_modules",
+        "public"
     ]
 }