Module '"@prismicio/client"' has no exported member 'Content'

Developing with Prismic
1

As title states, I'm getting this error:

image
image1464×238 37 KB

This is my prismic.ts:

import * as prismic from '@prismicio/client';
import * as prismicNext from '@prismicio/next';

import sm from './sm.json';

export const endpoint = sm.apiEndpoint;
export const repositoryName = prismic.getRepositoryName(endpoint);

// Update the Link Resolver to match your project's route structure
export function linkResolver(doc: Record<string, any>) {
  switch (doc.type) {
    case 'homepage':
      return '/';
    case 'Product':
      return `/products/${doc.uid}`;
    default:
      return null;
  }
}

// This factory function allows smooth preview setup
export function createClient({
  previewData,
  req,
  ...config
}: prismicNext.CreateClientConfig = {}) {
  const client = prismic.createClient(endpoint, {
    ...config,
  });

  prismicNext.enableAutoPreviews({
    client,
    previewData,
    req,
  });

  return client;
}

And my versions:

(regular deps)
    ....
    "@prismicio/client": "6.7.1",
    "@prismicio/helpers": "2.3.3",
    "@prismicio/next": "0.1.7",
    "@prismicio/react": "2.5.0",
    ....
...
(devDeps)
    ....
    "@prismicio/slice-simulator-react": "0.2.2",
    "@prismicio/types": "0.2.3",
    ....
2

The types are generated in .slicemachine/prismicio.d.ts - as expected.

I also modified a slice, just in case it would only generate when changes happen:

image
image1388×332 53.7 KB

3

Here are all my dependencies, just in case:

  "dependencies": {
    "@emotion/cache": "11.10.3",
    "@emotion/react": "11.10.4",
    "@emotion/server": "11.10.0",
    "@emotion/styled": "11.10.4",
    "@hookform/resolvers": "2.9.7",
    "@mui/icons-material": "5.10.3",
    "@mui/material": "5.10.3",
    "@mui/styles": "5.10.3",
    "@prismicio/client": "6.7.1",
    "@prismicio/helpers": "2.3.3",
    "@prismicio/next": "0.1.7",
    "@prismicio/react": "2.5.0",
    "@rtiss/rti-react": "workspace:*",
    "axios": "0.27.2",
    "date-fns": "2.29.2",
    "deepmerge": "4.2.2",
    "firebase": "9.10.0",
    "firebase-admin": "11.0.1",
    "framer-motion": "6.5.1",
    "next": "12.3.1",
    "next-sitemap": "3.1.21",
    "nextjs-progressbar": "0.0.14",
    "nookies": "2.5.2",
    "react": "^18.2.0",
    "react-bnb-gallery": "1.4.4",
    "react-credit-cards": "0.8.3",
    "react-dom": "^18.2.0",
    "react-hook-form": "7.38.0",
    "react-hot-toast": "2.3.0",
    "styled-components": "5.3.5",
    "zod": "3.19.1",
    "zustand": "4.1.2"
  },
  "devDependencies": {
    "@babel/core": "7.18.13",
    "@prismicio/slice-simulator-react": "0.2.2",
    "@prismicio/types": "0.2.3",
    "@types/react": "^17.0.50",
    "@types/react-dom": "^17.0.17",
    "@types/simple-react-lightbox": "3.6.1",
    "@typescript-eslint/eslint-plugin": "5.36.1",
    "@typescript-eslint/parser": "5.36.1",
    "csstype": "3.1.0",
    "eslint": "8.23.0",
    "eslint-config-custom": "workspace:*",
    "eslint-config-next": "12.2.5",
    "eslint-plugin-prettier": "4.2.1",
    "fp-ts": "2.12.3",
    "io-ts": "2.2.18",
    "io-ts-types": "0.5.16",
    "monocle-ts": "2.3.13",
    "newtype-ts": "0.3.5",
    "next-transpile-modules": "9.0.0",
    "prettier": "2.7.1",
    "slice-machine-ui": "0.5.1",
    "tsconfig": "workspace:*",
    "typescript": "4.8.2"
  }
}
6

Hey there @webadmin, here's a quick tutorial from Lucie that teaches you how to import content with typescript:

7

Hey - I had done all of this.

The solution - which is not in the video, or in the docs - was to add it to the generated types declaration file inside .slicemachine into the .tsconfig

{
  "extends": "tsconfig/nextjs.json",
  "include": [
    "next-env.d.ts",
    ".slicemachine/prismicio.d.ts", // here
    "**/*.ts",
    "**/*.tsx",
    "**/*.jsx"
  ],
  "exclude": ["node_modules"],
  "compilerOptions": {
// ... your config
  }
}
1 Like
8

That's mentioned just below the enable type generation section.

Glad you got it sorted though.

:clap: