类型错误：（0，next_sanity__WEBPACK_IMPORTED_MODULE_0__.createImageUrlBuilder）不是函数

Question

我正在尝试使用 sanity.io 制作 nextjs typescript 项目，但我无法解决这个问题。它表明 createImageUrlBuilder 不是一个函数。

在此输入图像描述

这是我的理智模块

Answer 1

createImageUrlBuilder不再被包裹next-sanity，您需要自己安装依赖项（https://github.com/sanity-io/next-sanity#createimageurlbuilder-is-removed）

$ npm install @sanity/image-url
// or
$ yarn add @sanity/image-url

另请注意，createImageUrlBuilder现在是默认导入。

-import { createImageUrlBuilder } from 'next-sanity'
+import createImageUrlBuilder from '@sanity/image-url'

Answer 2

您需要在 createImageUrlBuilder 而不是 config 中传递理智客户端。

import createClient from '@sanity/client';
import createImageUrlBuilder from '@sanity/image-url';


const config = sanityClient({
   projectId: process.env.NEXT_PUBLIC_SANITY_PROJECT_ID, 
   
   ...
  });

export const  sanityClient = createClient(config);

export const urlFor = (source) => createImageUrlBuilder(client).image(source); // <-----------