Next.js Minimal starter fails immediately with Error: No documents were returned

Developing with Prismic
,
1

Hello

Keen to use Nextjs + Prismic but not having a good start

I'm following the most basic steps and not getting the hello world page for the 'Minimal starter'

I'm doing the following:

go to: prismic.io

select: Create a new repository

select: Next.js

Repository name: some-test-182

How do you want to start? Minimal starter/Free

select: Create repository

Define as the main language: English UK

On Mac: create new folder /nextjs_and_prismic_test

Launch VS Code

Open folder: /nextjs_and_prismic_test

select: New Terminal window

enter: npx @slicemachine/init@latest --repository some-test-182 --starter nextjs-starter-prismic-minimal-ts

Run Slice Machine (npm run slicemachine)? > Y/n

Y

select: New terminal window

enter: cd some-test-182

enter: npm run dev

go to: localhost:3000

1 of 1 unhandled error
Next.js is up to date

Unhandled Runtime Error
Error: No documents were returned

Source
src/app/page.tsx (18:15) @ async Module.generateMetadata

  16 | const client = createClient();
  17 | console.log(client);
> 18 | const home = await client.getByUID("page", "home");
     |             ^
  19 |
  20 | return {
  21 |   title: prismic.asText(home.data.title),

What gives? The documentation suggests I should see a hellow world page

Here is src/app/page.tsx. createCleint is correctly imported and the console log for client shows an object, it's not null or undefined

import { Metadata } from "next";

import { SliceZone } from "@prismicio/react";
import * as prismic from "@prismicio/client";

import { createClient } from "@/prismicio";
import { components } from "@/slices";

// This component renders your homepage.
//
// Use Next's generateMetadata function to render page metadata.
//
// Use the SliceZone to render the content of the page.

export async function generateMetadata(): Promise<Metadata> {
  const client = createClient();
  console.log(client);
  const home = await client.getByUID("page", "home");

  return {
    title: prismic.asText(home.data.title),
    description: home.data.meta_description,
    openGraph: {
      title: home.data.meta_title ?? undefined,
      images: [{ url: home.data.meta_image.url ?? "" }],
    },
  };
}

export default async function Index() {
  // The client queries content from the Prismic API
  const client = createClient();
  const home = await client.getByUID("page", "home");

  return <SliceZone slices={home.data.slices} components={components} />;
}
2

Okay, the answer was you need to create a page in your repository, which is kind of obvious, sure, but at the same time, when you follow a 'hey get started download a minimal starter project' you kind of expect it to work out of the box if there's no further explanation as to the starter project's use - which as far as i could tell, there isn't

4

@hardcoded I'm glad that you got things working, and thanks for the feedback on this. I'll pass it along to the team.

1 Like