// nuxt.config.ts
import { defineNuxtConfig } from "nuxt/config";
import VueInspector from 'vite-plugin-vue-inspector'

const isProd = process.env.NODE_ENV === 'production'

export default defineNuxtConfig({
  compatibilityDate: '2024-12-01',
  devtools: { enabled: !isProd },
  debug: !isProd,
  sourcemap: !isProd,

  modules: ['@nuxt/ui', '@nuxtjs/i18n', '@pinia/nuxt'],

  // ... other configurations
})

// nuxt.config.ts
export default defineNuxtConfig({
  ui: {
    theme: {
      colors: [
        'primary',
        'secondary',
        'tertiary',
        'info',
        'success',
        'warning',
        'error',
        'neutral'
      ]
    }
  }
})

// nuxt.config.ts
export default defineNuxtConfig({
  i18n: {
    locales: [
      { code: 'en', name: 'English', file: 'en.json' },
      { code: 'id', name: 'Bahasa Indonesia', file: 'id.json' },
      { code: 'ja', iso: 'ja-JP', name: '日本語', file: 'ja.json' }
    ],
    defaultLocale: 'id',
    strategy: 'no_prefix',      // No URL prefix for locales
    detectBrowserLanguage: false, // Disable auto-detection
    restructureDir: '.',
    langDir: 'locales',
    lazy: true                  // Lazy load translations
  }
})

locales/
├── en.json     # English translations
├── id.json     # Indonesian translations
└── ja.json     # Japanese translations

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@pinia/nuxt'],
  // Pinia is auto-configured by the module
})

// features/01_core/store/auth.ts
export const useAuthStore = defineStore('auth', () => {
  // store implementation
}, {
  persist: true  // Enable persistence
})

// nuxt.config.ts
export default defineNuxtConfig({
  colorMode: {
    preference: 'light',      // Default preference
    fallback: 'light',        // Fallback if no preference
    classSuffix: '',          // Class suffix for body
    storageKey: 'nuxt-color-mode'  // LocalStorage key
  }
})

// nuxt.config.ts
export default defineNuxtConfig({
  icon: {
    provider: 'iconify',
    serverBundle: 'auto'
  }
})

<UIcon name="i-heroicons-home" />
<UIcon name="i-lucide-settings" />

// nuxt.config.ts
export default defineNuxtConfig({
  css: [
    '~/assets/css/main.css',
    'handsontable/styles/handsontable.css',
    'handsontable/styles/ht-theme-main.css',
    'handsontable/styles/ht-theme-horizon.css',
    'handsontable/styles/ht-theme-classic.css'
  ]
})

/* assets/css/main.css */
@import "tailwindcss";

/* Custom styles */
:root {
  --color-primary: #035478;
}

// nuxt.config.ts
export default defineNuxtConfig({
  devServer: {
    port: 4001,
    host: '0.0.0.0'  // Allow external access
  }
})

// nuxt.config.ts
import VueInspector from 'vite-plugin-vue-inspector'

export default defineNuxtConfig({
  vite: {
    plugins: [
      VueInspector({
        enabled: !isProd,
        toggleButtonVisibility: 'always',
        launchEditor: 'code',  // VS Code
      }),
    ],
  }
})

// nuxt.config.ts
export default defineNuxtConfig({
  runtimeConfig: {
    // Private keys (server-only)
    apiSecret: process.env.API_SECRET,

    // Public keys (exposed to client)
    public: {
      apiBase: process.env.NUXT_PUBLIC_API_BASE_URL || 'http://localhost:3002'
    }
  }
})

# .env

# API Configuration
NUXT_PUBLIC_API_BASE_URL=http://localhost:3002

# Private (server-only)
API_SECRET=your-secret-key

# Node Environment
NODE_ENV=development

// In composables or components
const config = useRuntimeConfig()

// Access public config
const apiBase = config.public.apiBase

// Access private config (server-only)
const secret = config.apiSecret  // Only available in server

// nuxt.config.ts
export default defineNuxtConfig({
  app: {
    head: {
      title: 'Mstore Dashboard',
      meta: [
        { name: 'viewport', content: 'width=device-width, initial-scale=1' },
        { name: 'description', content: 'Backoffice dashboard untuk Mushola Store' }
      ]
    }
  }
})

// nuxt.config.ts
export default defineNuxtConfig({
  nitro: {
    routeRules: {
      '/api/**': {
        proxy: 'http://localhost:3002/api/**',
      },
    },
  }
})

// tsconfig.json
{
  "extends": "./.nuxt/tsconfig.json",
  "compilerOptions": {
    "strict": true,
    "noImplicitAny": true,
    "strictNullChecks": true
  }
}

// nuxt.config.ts
const isProd = process.env.NODE_ENV === 'production'

export default defineNuxtConfig({
  devtools: { enabled: !isProd },
  debug: !isProd,
  sourcemap: !isProd,
})

# Build for production
NODE_ENV=production pnpm build

# Preview production build
NODE_ENV=production pnpm preview