Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Content not statically generated when using `queryContent`

See original GitHub issue

Environment

Operating System: Windows_NT
Node Version: v17.0.0
Nuxt Version: 3.0.0-rc.3
Package Manager: pnpm@7.1.7
Builder: vite
User Config: css, modules, ssr, target, typescript
Runtime Modules: @nuxt/content@2.0.0
Build Modules: -

Reproduction

My repo

Run

pnpm i --shamefully-hoist
pnpm generate
pnpm preview

Describe the bug

I am building my personnal website and I want to prerender my pages with nuxt generate. Inside of my homepage, I am using queryContent to get the data that I want to display (projects, skills and milestones).

const { data } = await useAsyncData('projects', () =>
  queryContent('/projects').findOne()
);

I also have a dynamic project page that should display the content of markdown files that are in /content/projects/

<script setup lang="ts">
const route = useRoute();

const { data } = await useAsyncData(route.params.project[0], () =>
  queryContent(`/projects/${route.params.project}`).findOne()
);
</script>

<template>
  <NuxtLayout name="page">
    <ContentRenderer :value="data" tag="section">
      <MarkdownRenderer :value="data" />
    </ContentRenderer>
    <BaseFooter />
  </NuxtLayout>
</template>

Everything works fine in the dev environment but when i’m doing nuxt generate then nuxt preview, everything that is related to Nuxt Content is not displayed. Also, none of my pages seems to be prerendered.

What am I doing wrong ?

Additional context

My `nuxt.config.ts`:

// eslint-disable-next-line import/no-extraneous-dependencies
import { defineNuxtConfig } from 'nuxt';

// https://v3.nuxtjs.org/api/configuration/nuxt.config
export default defineNuxtConfig({
  css: ['~/styles/reset.scss', '~/styles/globals.scss'],
  modules: ['@nuxt/content'],
  ssr: false,
  target: 'static',
  typescript: {
    strict: true,
  },
});

My `package.json`:

{
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "lint:ts": "eslint **/*.ts **/*.vue",
    "lint:style": "stylelint \"**/*.{vue,scss}\"",
    "lint:prettier": "prettier --check .",
    "lint": "pnpm lint:ts && pnpm lint:style && pnpm lint:prettier",
    "lintfix": "prettier --write .",
    "prepare": "husky install"
  },
  "dependencies": {
    "locomotive-scroll": "^4.1.4"
  },
  "devDependencies": {
    "@nuxt/content": "^2.0.0",
    "@nuxtjs/eslint-config-typescript": "^10.0.0",
    "@typescript-eslint/eslint-plugin": "^5.25.0",
    "@typescript-eslint/parser": "^5.25.0",
    "eslint": "^7.32.0 || ^8.2.0",
    "eslint-config-airbnb-base": "^15.0.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint-plugin-import": "^2.25.2",
    "eslint-plugin-prettier": "^4.0.0",
    "eslint-plugin-vue": "^9.0.1",
    "husky": "^8.0.1",
    "nuxt": "3.0.0-rc.3",
    "postcss": "^8.4.14",
    "postcss-html": "^1.4.1",
    "prettier": "^2.6.2",
    "sass": "^1.51.0",
    "stylelint": "^14.8.2",
    "stylelint-config-prettier": "^9.0.3",
    "stylelint-config-standard-scss": "^3.0.0",
    "stylelint-config-standard-vue": "^1.0.0",
    "stylelint-prettier": "^2.0.0",
    "typescript": "^4.6.4"
  }
}