Netlify Vercel Server Serverless(aws lambda)

• 💚 Nuxt 3 - SSR, ESR, File-based routing, components auto importing, modules, etc.

• 🌞 @nuxt3/apollo-module - composable query, multiple apollo clients, ssr or client mode For example:

  import { useCountryQuery, usePersonQuery } from '@/generated/operations' // generated by @nuxt3/graphql-codegen-module
  
  const { result: client, loading: queryLoading } = await useCountryQuery({
    clientId: 'trevorblades',
    prefetch: false, // clientMode, need validate result in template
  })
  
  const { result: server, loading: jumpLoading, error } = await usePersonQuery({
    personInput: {
      name: 'Phil Xu',
    },
  }, {
    prefetch: true, // ssrMode, default: true
  })
  
  // use clients directly $apollo.default  $apollo.trevorblades
  // const { $apollo } = useNuxtApp()
  

• 💻 TypeGraphql + Apollo Server

• 💼 @nuxt3/graphql-codegen-module - generate types and apollo composable query code on every build

• 🌏 i18n customized intlify i18n - set preferred language according to browser, and save user's preferred language to cookie.

• 🧩 Use svg by file name For example:

  // svg file in @/assets/svgs/apollo.svg
  <SvgIcon name="apollo" />
  

• ⚡️ Vite - Instant HMR

• 🎨 UnoCSS - The instant on-demand atomic CSS engine.

• 😃 Use icons from any icon sets in Pure CSS, powered by UnoCSS

• 🛠 VueUse - collection of useful composition APIs

• 🔥 The <script setup> syntax

• 🍍 State Management via Pinia

• 📥 APIs auto importing - for Composition API, VueUse and custom composables.

• 🏎 Zero-config cloud functions and deploy

• 🦾 TypeScript, of course

We recommend using VS Code with Volar to get the best experience (You might want to disable Vetur if you have it).

If you prefer to do it manually with the cleaner git history

npx degit newbeea/nuxt3-apollo-starter my-nuxt3-apollo-app

cd my-nuxt3-apollo-app
yarn # npm pnpm may not work properly in production mode
yarn run dev

Website: http://localhost:3000 Graphql Playground: http://localhost:3000/api/playground

setup URL environment when build for example: add in package.json

"build": "cross-env URL=https://xxx.yourdomain.com nuxi build"

build

yarn run build

start

yarn run start

set cdnURL in nuxt.config.ts

setup URL environment when build for example: add in package.json

"build:sls": "cross-env NITRO_PRESET=lambda URL=https://xxx.yourdomain.com nuxi build"

yarn run build:sls

upload .output/server/public/* to cdn (cdnURL)

config customDomain in serverless.yml

custom:
  customDomain:
    http:
      domainName: xxx.yourdomain.com
      endpointType: regional
      certificateName: yourdomain.com
      createRoute53Record: true
plugins:
  - serverless-domain-manager

then

yarn run domain

yarn run deploy

then visit xxx.yourdomain.com

antfu/vitesse-nuxt3