Nuxt Server Assets

This is a demonstration of how to use Nuxt with server/assets/ to use static assets from server routes.

• Nuxt Server Directory
• Nitro Server Assets
• Unstorage

Checkout these files to see how it works:

• server/assets/: The server assets directory
• server/routes/pdf.ts: The server route that generates the PDF by reading the font from server/assets/fonts/
• server/routes/random.jpg.ts: The server route that return a random image from server/assets/images/ (note, this is for example purpose and we don’t recommend doing this as it increase the server bundle size)

When building your application, the server/assets/ files will be copied to the .output/server/chunks/raw directory to be read on any serverless platform.

Credits

I created this demo after seeing this tweet by Rich Harris.

• Rich-Harris/fowl-play
• Rich-Harris/sveltekit-pdf-demo

Setup

Make sure to install the dependencies:

# npm
npm install

# pnpm
pnpm install

# yarn
yarn install

# bun
bun install

Development Server

Start the development server on http://localhost:3000:

# npm
npm run dev

# pnpm
pnpm run dev

# yarn
yarn dev

# bun
bun run dev

Production

Build the application for production:

# npm
npm run build

# pnpm
pnpm run build

# yarn
yarn build

# bun
bun run build

Locally preview production build:

# npm
npm run preview

# pnpm
pnpm run preview

# yarn
yarn preview

# bun
bun run preview

Check out the deployment documentation for more information.