Hello @fool,
so basically what I know nuxt generate is prerendered all the site and make it static. nuxt build build the site with node server. Details explanation in the nuxt 3 documentation:
For the error here the screenshot about it:
so I assume it has some problem with the async. Just in case I am sharing my code here.
// pages/blog/[...slug].vue
<script setup>
const {path} = useRoute()
const {data} = await useAsyncData(`content-${path}`, async () => {
let article = queryContent().where({_path: path}).findOne()
let surround = queryContent().only(['_path', 'title', 'description']).sort({date: 1}).findSurround(path)
return {
article: await article,
surround: await surround,
};
})
const [prev, next] = data.value.surround;
// console.log({ data, prev, next });
useHead({
title: data.value.article.title,
meta: [
{ name: "description", content: data.value.article.description },
{
hid: "og:image",
property: "og:image",
content: `https://site.com/${data.value.article.img}`,
},
],
});
</script>
<template>
<main id="main" class="article-main">
<header v-if="data.article" class="article-header">
<div class="img-cont h-72 mb-12">
<nuxt-img
format="webp"
:src="`/${data.article.img}`"
:alt="data.article.title"
class=" rounded-2xl" />
</div>
<h1 class="heading">{{ data.article.title }}</h1>
<p class="supporting">{{ data.article.description }}</p>
<ul class="article-tags flex gap-2">
<li class="tag" v-for="(tag, n) in data.article.tags" :key="n">{{ tag }}</li>
</ul>
</header>
<hr />
<section class="article-section">
<aside class="aside">
<!-- Toc Component -->
<Toc :links="data.article.body.toc.links" />
</aside>
<article class="article">
<!-- render document coming from query -->
<ContentRenderer :value="data.article">
<!-- render rich text from document -->
<!-- <MarkdownRenderer :value="data.article" /> -->
<!-- display if document content is empty -->
<template #empty>
<p>No content found.</p>
</template>
</ContentRenderer>
</article>
</section>
<!-- PrevNext Component -->
<PrevNext :prev="prev" :next="next" />
</main>
</template>
<style scoped>
/* .... */
</style>
for the nuxt generate build logs here’s the link
https://app.netlify.com/sites/djorro-blog/deploys/63bc9175cfdac4000877c891
Just in case if the link doesn’t work I’ll copy paste the log build here.
5:13:09 AM: Build ready to start
5:13:11 AM: build-image version: 898fba980b1849e728e4e37db044e92a34d57a83 (focal)
5:13:11 AM: build-image tag: v4.16.2
5:13:11 AM: buildbot version: 4eb4e2f19f4a95a34ab99250cdca027b50873c7a
5:13:11 AM: Fetching cached dependencies
5:13:11 AM: Starting to download cache of 119.5MB
5:13:13 AM: Finished downloading cache in 1.457005827s
5:13:13 AM: Starting to extract cache
5:13:14 AM: Finished extracting cache in 1.086771595s
5:13:14 AM: Finished fetching cache in 2.591387904s
5:13:14 AM: Starting to prepare the repo for build
5:13:14 AM: Preparing Git Reference refs/heads/main
5:13:14 AM: Parsing package.json dependencies
5:13:16 AM: Starting build script
5:13:16 AM: Installing dependencies
5:13:16 AM: Python version set to 2.7
5:13:16 AM: Started restoring cached node version
5:13:17 AM: Finished restoring cached node version
5:13:17 AM: v16.19.0 is already installed.
5:13:17 AM: Now using node v16.19.0 (npm v8.19.3)
5:13:17 AM: Enabling node corepack
5:13:17 AM: Started restoring cached build plugins
5:13:17 AM: Finished restoring cached build plugins
5:13:17 AM: Attempting ruby version 2.7.2, read from environment
5:13:18 AM: Using ruby version 2.7.2
5:13:18 AM: Using PHP version 8.0
5:13:19 AM: No npm workspaces detected
5:13:19 AM: Started restoring cached node modules
5:13:19 AM: Finished restoring cached node modules
5:13:19 AM: Bypassing sha validation. Running pre & post install scripts
5:13:19 AM: Installing NPM modules using NPM version 8.19.3
5:13:20 AM: up to date, audited 975 packages in 1s
5:13:20 AM: 225 packages are looking for funding
5:13:20 AM: run `npm fund` for details
5:13:20 AM: found 0 vulnerabilities
5:13:20 AM: NPM modules installed
5:13:21 AM: Started restoring cached go cache
5:13:21 AM: Finished restoring cached go cache
5:13:21 AM: go version go1.19.4 linux/amd64
5:13:21 AM: Detected 1 framework(s)
5:13:21 AM: "nuxt" at version "3.0.0"
5:13:21 AM: Installing missing commands
5:13:21 AM: Verify run directory
5:13:21 AM: Section completed: initializing
5:13:23 AM:
5:13:23 AM: Netlify Build
5:13:23 AM: ────────────────────────────────────────────────────────────────
5:13:23 AM:
5:13:23 AM: ❯ Version
5:13:23 AM: @netlify/build 29.4.0
5:13:23 AM:
5:13:23 AM: ❯ Flags
5:13:23 AM: baseRelDir: true
5:13:23 AM: buildId: 63bc9175cfdac4000877c88f
5:13:23 AM: deployId: 63bc9175cfdac4000877c891
5:13:23 AM:
5:13:23 AM: ❯ Current directory
5:13:23 AM: /opt/build/repo
5:13:23 AM:
5:13:23 AM: ❯ Config file
5:13:23 AM: No config file was defined: using default values.
5:13:23 AM:
5:13:23 AM: ❯ Context
5:13:23 AM: production
5:13:23 AM:
5:13:23 AM: 1. Build command from Netlify app
5:13:23 AM: ────────────────────────────────────────────────────────────────
5:13:23 AM:
5:13:23 AM: $ nuxt generate
5:13:23 AM: [log] Nuxi 3.0.0
5:13:23 AM: [log] Nuxt 3.0.0 with Nitro 1.0.0
5:13:23 AM: [info] [nuxt:tailwindcss] Using Tailwind CSS from ~/assets/css/main.css
5:13:24 AM: [warn] Components directory not found: `/opt/build/repo/storyblok`
5:13:29 AM: [info] Client built in 4029ms
5:13:29 AM: [info] Building server...
5:13:33 AM: [success] Server built in 3508ms
5:13:33 AM: [success] [nitro] Generated public dist
5:13:33 AM: [info] [nitro] Initializing prerenderer
5:13:35 AM: [info] [nitro] Prerendering 5 initial routes with crawler
5:13:36 AM: [log] [nitro] ├─ /blog (1093ms)
5:13:36 AM: [log] [nitro] ├─ / (12ms)
5:13:36 AM: [log] [nitro] ├─ /api/_content/cache.1673302403870.json (13ms)
5:13:36 AM: [log] [nitro] ├─ /200.html (4ms)
5:13:36 AM: [log] [nitro] ├─ /404.html (1ms)
5:13:36 AM: [log] [nitro] ├─ /blog/tags/nuxt (26ms)
5:13:36 AM: [log] [nitro] ├─ /blog/tags/content (17ms)
5:13:36 AM: [log] [nitro] ├─ /blog/tags/learning (13ms)
5:13:36 AM: [log] [nitro] ├─ /blog/tags/koeocheng (15ms)
5:13:36 AM: [log] [nitro] ├─ /blog/tags/ketiga (15ms)
5:13:36 AM: [log] [nitro] ├─ /blog/tags/gaming (16ms)
5:13:37 AM: [log] [nitro] ├─ /blog/first-post (186ms)
5:13:37 AM: [log] [nitro] ├─ /blog/second-blog (115ms)
5:13:37 AM: [log] [nitro] ├─ /blog/third (35ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/uP0lTQ8Gq7.1673302403870.json (6ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/1T6Fni6qTO.1673302403870.json (2ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/6HjxacwABz.1673302403870.json (3ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/NALuLmDZBb.1673302403870.json (2ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/7fmSKXVQFW.1673302403870.json (3ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/zPbMHvWwqc.1673302403870.json (2ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/rlyGiLBrSZ.1673302403870.json (3ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/r1tPpravWU.1673302403870.json (2ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/HLu7BLtur8.1673302403870.json (2ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/BpsyttnrEc.1673302403870.json (3ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/8EPOvRQNQ7.1673302403870.json (1ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/QdddmNONHW.1673302403870.json (3ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/FHkni33GAo.1673302403870.json (2ms)
5:13:37 AM: [log] [nitro] ├─ /api/_content/query/dDseaFzOAk.1673302403870.json (3ms)
5:13:37 AM: [success] You can now deploy `dist` to any static hosting!
5:13:37 AM:
5:13:37 AM: (build.command completed in 14.2s)
5:13:37 AM:
5:13:37 AM: 2. Edge Functions bundling
5:13:37 AM: ────────────────────────────────────────────────────────────────
5:13:37 AM:
5:13:37 AM:
5:13:37 AM: (Edge Functions bundling completed in 238ms)
5:13:37 AM:
5:13:37 AM: 3. Deploy site
5:13:37 AM: ────────────────────────────────────────────────────────────────
5:13:37 AM:
5:13:37 AM: Starting to deploy site from 'dist'
5:13:37 AM: Creating deploy tree
5:13:38 AM: Starting post processing
5:13:37 AM: 15 new files to upload
5:13:37 AM: 0 new functions to upload
5:13:38 AM: Section completed: deploying
5:13:38 AM: Site deploy was successfully initiated
5:13:38 AM:
5:13:38 AM: (Deploy site completed in 458ms)
5:13:38 AM:
5:13:38 AM: Netlify Build Complete
5:13:38 AM: ────────────────────────────────────────────────────────────────
5:13:38 AM:
5:13:38 AM: (Netlify Build completed in 14.9s)
5:13:38 AM: Caching artifacts
5:13:38 AM: Started saving node modules
5:13:38 AM: Finished saving node modules
5:13:38 AM: Started saving build plugins
5:13:38 AM: Finished saving build plugins
5:13:38 AM: Started saving pip cache
5:13:38 AM: Finished saving pip cache
5:13:38 AM: Started saving emacs cask dependencies
5:13:38 AM: Finished saving emacs cask dependencies
5:13:38 AM: Started saving maven dependencies
5:13:38 AM: Finished saving maven dependencies
5:13:38 AM: Started saving boot dependencies
5:13:38 AM: Finished saving boot dependencies
5:13:38 AM: Started saving rust rustup cache
5:13:39 AM: Post processing - HTML
5:13:38 AM: Finished saving rust rustup cache
5:13:38 AM: Started saving go dependencies
5:13:38 AM: Finished saving go dependencies
5:13:38 AM: Build script success
5:13:38 AM: Section completed: building
5:13:39 AM: Uploading Cache of size 119.7MB
5:13:40 AM: Section completed: cleanup
5:13:40 AM: Finished processing build request in 28.82773185s
5:13:43 AM: Post processing - header rules
5:13:44 AM: Post processing - redirect rules
5:13:44 AM: Post processing done
5:13:44 AM: Section completed: postprocessing
5:13:45 AM: Site is live ✨
note: All the build logs don’t have any error but the deployed site has some issue. I tried nuxt generate on local and run npx serve ./dist It works perfectly fine without any issue but not in the netlify.
I appreciate all of you guys for helping me thank you!
,
