danielroe.dev / nuxt-full-static
[READ-ONLY] Mirror of https://github.com/danielroe/nuxt-full-static. Full static implementation for Nuxt 3
0
Fork 0

Configure Feed

Select the types of activity you want to include in your feed.

50 14 3

Clone this repository

https://git.vm.fail/danielroe.dev/nuxt-full-static https://git.vm.fail/did:plc:ngebng6vgcjf34qc2pajozqa
ssh://git@knot1.tangled.sh:2222/danielroe.dev/nuxt-full-static ssh://git@knot1.tangled.sh:2222/did:plc:ngebng6vgcjf34qc2pajozqa

For self-hosted knots, clone URLs may differ based on your setup.


Download tar.gz Download .zip
README.md

Nuxt Full Static (experimental)#

npm version npm downloads Github Actions Codecov

Full static implementation for Nuxt 3

Important#

Note Nuxt 3 RC 10 now includes built-in full static support that is enabled by default. You can safely remove this module if you are running RC 10 or higher.

Features#

⚠️ nuxt-full-static is a proof of concept. ⚠️

👉 Roadmap and progress for nuxt 3 payload extraction support: nuxt/framework#6411

  • Generates static payloads at build time if routes are prerendered
  • Also works in hybrid mode, rendering payloads on the server

Usage#

import { defineNuxtConfig } from 'nuxt'

export default defineNuxtConfig({
  modules: ['nuxt-full-static'],
})

Automatically, all your useAsyncData and useFetch calls will be prefilled with static payloads. As long as you haven't set initialCache or server to false, you should not see these functions running on client-side at all. You can even stub them out by prefixing them with process.server &&:

const { data } = useAsyncData(() => process.server && $fetch('https://my.api.com/data'))

However, you also retain the ability to opt-out, by manually calling refresh. This will result in running the data fetching function again.

💻 Development#

  • Clone this repository
  • Enable Corepack using corepack enable (use npm i -g corepack for Node.js < 16.10)
  • Install dependencies using pnpm install
  • Stub module with pnpm dev:prepare
  • Run pnpm dev to start playground in development mode

License#

Made with ❤️

Published under the MIT License.