Nuxt project structure

Nuxt project structure

Explorer

  • .huskynew
  • pre-commitnew
  • commit-msgnew
  • .data…new, not committed
  • .nuxt…, not committed
  • .output…new, not committed
  • .vscodenew
  • extensions.jsonnew
  • settings.jsonnew
  • app
  • app.vue
  • app.config.tsnew
  • error.vuenew
  • contentnew
  • coverage…new, not committed
  • i18nnew
  • node_modules…, not committed
  • public
  • favicon.ico
  • robots.txt
  • servernew
  • sharednew
  • test
  • .editorconfignew
  • .envnew, not committed
  • .env.examplenew
  • .gitignore
  • .nvmrcnew
  • commitlint.config.tsnew
  • compose.yamlnew
  • content.config.tsnew
  • drizzle.config.tsnew
  • eslint.config.mjs
  • nuxt.config.ts
  • package-lock.json
  • package.json
  • README.md
  • tsconfig.json
  • vitest.config.ts
  1. # Create the project with the minimal template, git and the ESLint and test-utils modules

    npm create nuxt@latest my-app -- --template=minimal --packageManager=npm --gitInit --modules=eslint,test-utils
  2. # Start the dev server on localhost:3000

    cd my-app && npm run dev
  3. # Add UI, i18n, auth and database packages

    npx nuxt module add ui && npx nuxt module add i18n && npx nuxt module add auth-utils && npm install drizzle-orm pg zod && npm install -D drizzle-kit
  4. # Add Playwright for end-to-end tests

    npm install -D @playwright/test @axe-core/playwright && npx playwright install
  5. # Add commit hooks

    npm install -D husky lint-staged @commitlint/cli @commitlint/config-conventional && npx husky init