Base vite configuration files

estlint.config.mjs

import globals from 'globals'
import eslint from '@eslint/js'
import eslintPluginVue from 'eslint-plugin-vue'
import typescriptEslint from 'typescript-eslint'
import stylistic from '@stylistic/eslint-plugin'

export default typescriptEslint.config(
  { 
    ignores: [
      '*.d.ts', 
      '**/coverage', 
      '**/dist', 
      '**/src/volt/**',
      '**/src/components/ui/**'
    ]
  },
  {
    plugins: {
      '@stylistic': stylistic,
    },
    extends: [
      stylistic.configs.recommended,
      eslint.configs.recommended,
      ...typescriptEslint.configs.recommended,
      ...eslintPluginVue.configs['flat/recommended'],
    ],
    files: ['**/*.{ts,vue}'],
    languageOptions: {
      ecmaVersion: 'latest',
      sourceType: 'module',
      globals: globals.browser,
      parserOptions: {
        parser: typescriptEslint.parser,
        projectService: true,
        extraFileExtensions: ['.vue']
      }
    },
    rules: {
      'vue/max-attributes-per-line': ['error', {
        'singleline': {
          "max": 20
        },
        'multiline': {
          "max": 1
        }
      }],
      "vue/multi-word-component-names": ['warn'],
      "vue/no-v-html": ['warn'],

      "@typescript-eslint/no-unused-vars": ["error", { "argsIgnorePattern": "^_" }],
      '@typescript-eslint/unified-signatures': 'error',
      '@typescript-eslint/related-getter-setter-pairs': 'warn',
      '@typescript-eslint/no-unnecessary-type-arguments': 'warn',
      '@typescript-eslint/no-unnecessary-template-expression': 'warn',
      '@typescript-eslint/no-unnecessary-condition': 'warn',
      '@typescript-eslint/no-unnecessary-boolean-literal-compare': 'warn',
      '@typescript-eslint/no-non-null-assertion': 'warn',
      '@typescript-eslint/no-non-null-asserted-nullish-coalescing': 'warn',
      '@typescript-eslint/no-misused-spread': 'warn',
      '@typescript-eslint/no-extraneous-class': 'warn',

      '@stylistic/no-trailing-spaces': ['warn'],
      '@stylistic/comma-dangle': ['warn', 'never'],
      '@stylistic/brace-style': ['error', '1tbs'],
      '@stylistic/no-confusing-arrow': ['warn'],
      '@stylistic/switch-colon-spacing': [
        'error', { 'after': true, 'before': false }
      ]
    }
  }
)

package.json

{
  "dependencies": {
    "@tailwindcss/vite": "^4.1.5",
    "@unhead/vue": "^2.0.8",
    "@vueuse/core": "^13.1.0",
    "@vueuse/integrations": "^13.1.0",
    "@vueuse/math": "^13.1.0",
    "axios": "^1.9.0",
    "chart.js": "^4.4.9",
    "clsx": "^2.1.1",
    "dayjs": "^1.11.13",
    "firebase": "^11.6.1",
    "globals": "^16.0.0",
    "pinia": "^3.0.2",
    "reka-ui": "^2.2.1",
    "tailwind-merge": "^3.2.0",
    "tailwindcss": "^4.1.5",
    "tw-animate-css": "^1.2.9",
    "universal-cookie": "^8.0.1",
    "unplugin-auto-import": "^19.1.2",
    "unplugin-vue-components": "^28.5.0",
    "vue": "^3.5.13",
    "vue-i18n": "^11.1.3",
    "vue-router": "^4.5.1",
    "vue-sonner": "^1.3.2",
    "zod": "^3.24.4"
  },
  "devDependencies": {
    "@eslint/js": "^9.26.0",
    "@iconify/vue": "^5.0.0",
    "@stylistic/eslint-plugin": "^4.2.0",
    "@testing-library/jest-dom": "^6.6.3",
    "@testing-library/vue": "^8.1.0",
    "@types/node": "^22.15.3",
    "@typescript-eslint/eslint-plugin": "^8.32.0",
    "@typescript-eslint/parser": "^8.32.0",
    "@vitejs/plugin-vue": "^5.2.3",
    "@vue/tsconfig": "^0.7.0",
    "eslint": "^9.26.0",
    "eslint-plugin-vue": "^10.1.0",
    "happy-dom": "^17.4.6",
    "sass": "^1.87.0",
    "typescript": "~5.8.3",
    "typescript-eslint": "^8.32.0",
    "vite": "^6.3.5",
    "vite-plugin-eslint": "^1.8.1",
    "vitest": "^3.1.3",
    "vue-tsc": "^2.2.8"
  }
}

tailwind.config.ts

// /** @type {import('tailwindcss').Config} */
// import PrimeUI from "tailwindcss-primeui";

export default {
    content: [
        './components/**/*.{js,vue,ts}',
        './layouts/**/*.vue',
        './pages/**/*.vue',
        './plugins/**/*.{js,ts}',
        './app.vue',
        './error.vue',
        './nuxt.config.{js,ts}'
    ],
    theme: {
        extend: {
            fontFamily: {},
            colors: {},
            screens: {},  
        },
    },
    // plugins: [PrimeUI],
    darkMode: 'class',
}

tsconfig.app.json

{
  "extends": "@vue/tsconfig/tsconfig.dom.json",
  "compilerOptions": {
    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
    "baseUrl": ".",
    "paths": {
      "@/*": [
        "./src/*"
      ]
    },
    "composite": true,
    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "erasableSyntaxOnly": true,
    "noFallthroughCasesInSwitch": true,
    "noUncheckedSideEffectImports": true
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue"
  ]
}

tsconfig.json

{
  "compilerOptions": {
    "baseUrl": "./",
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "esModuleInterop": true,
    "resolveJsonModule": true,
    "paths": {
      "@/*": [
        "src/*"
      ],
      "src": [
        "src/*"
      ]
    }
  },
  "references": [
    { "path": "./tsconfig.app.json" },
    { "path": "./tsconfig.node.json" }
  ]
}

tsconfig.node.json

{
  "compilerOptions": {
    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
    "target": "ES2022",
    "lib": [
      "ESNext"
    ],
    "module": "ESNext",
    "skipLibCheck": true,
    "composite": true,
    "forceConsistentCasingInFileNames": true,
    /* Bundler mode */
    "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "verbatimModuleSyntax": true,
    "moduleDetection": "force",
    "noEmit": true,
    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "erasableSyntaxOnly": true,
    "noFallthroughCasesInSwitch": true,
    "noUncheckedSideEffectImports": true
  },
  "include": [
    "vite.config.ts"
  ]
}

vite.config.ts

/// <reference types="vitest" />

import { defineConfig, loadEnv } from 'vite'
import { resolve } from 'path'

import tailwind from '@tailwindcss/vite'
import unheadVite from '@unhead/addons/vite'
import eslint from 'vite-plugin-eslint'
import vue from '@vitejs/plugin-vue'
import unpluginViteComponents from 'unplugin-vue-components/vite'
import autoImport from 'unplugin-auto-import/vite'

// https://vite.dev/config/
export default defineConfig(({ mode }) => {
  const root = process.cwd()
  const env = loadEnv(mode, root)
  process.env = { ...process.env, ...env }

  return {
    root,
    resolve: {
      alias: [
        {
          find: '@',
          replacement: resolve(__dirname, 'src')
        }
      ]
    },
    plugins: [
      vue(),
      eslint(),
      unheadVite(),
      tailwind(),
      unpluginViteComponents({
        deep: true,
        dts: 'src/types/components.d.ts',
        dirs: [
          'src/components'
        ],
        extensions: [
          'vue'
        ]
      }),
      autoImport({
        dts: 'src/types/auto-imports.d.ts',
        vueTemplate: true,
        imports: [
          'vue',
          'pinia',
          '@vueuse/core'
        ],
        dirs: [
          'src/plugins',
          'src/stores'
        ]
      })
    ],
    test: {
      globals: true,
      environment: 'happy-dom',
      setupFiles: 'tests/setupVuetify.ts',
      css: true,
      pool: 'vmThreads',
      // deps.optimizer.web.include
      // server.deps.inline
      server: {
        deps: {
          inline: ['vuetify']
        }
      }
    }
  }
})