Search code examples
keystonejs

Adding document field with keystone-next error: field doesn't define any adapters

When I use the field type document for one of my lists like so:

import { list } from '@keystone-next/keystone/schema';
import {
  text,
  timestamp,
  select,
} from '@keystone-next/fields';
import { document } from '@keystone-next/fields-document';



export const Post = list({
  fields: {
    title: text(),
    status: select({
      options: [
        { label: 'Published', value: 'published' },
        { label: 'Draft', value: 'draft' },
      ],
      ui: {
        displayMode: 'segmented-control',
      },
    }),
    content: document(),
    publishDate: timestamp(),
  },
});

However, the project fails to compile. Here's the error message:

 Error: The type given for the 'Post.content' field doesn't define any adapters.
at  /Users/johndoe/Projects/MyBlog/backend/node_modules/@keystonejs/keystone/lib/ListTypes/list.js:199:15
    at Array.forEach (<anonymous>)
    at List.initFields (/Users/johndoe/Projects/MyBlog/backend/node_modules/@keystonejs/keystone/lib/ListTypes/list.js:185:43)
    at Keystone.createList (/Users/johndoe/Projects/MyBlog/backend/node_modules/@keystonejs/keystone/lib/Keystone/index.js:296:10)
    at /Users/johndoe/Projects/MyBlog/backend/node_modules/@keystone-next/keystone/dist/initConfig-34e7aba3.cjs.dev.js:663:16
    at Array.forEach (<anonymous>)
    at createKeystone (/Users/johndoe/Projects/MyBlog/backend/node_modules/@keystone-next/keystone/dist/initConfig-34e7aba3.cjs.dev.js:654:25)
    at Object.createSystem (/Users/johndoe/Projects/MyBlog/backend/node_modules/@keystone-next/keystone/dist/initConfig-34e7aba3.cjs.dev.js:695:20)
    at initKeystone (/Users/johndoe/Projects/MyBlog/backend/node_modules/@keystone-next/keystone/scripts/dist/keystone.cjs.dev.js:374:20)
    at Server.<anonymous> (/Users/johndoe/Projects/MyBlog/backend/node_modules/@keystone-next/keystone/scripts/dist/keystone.cjs.dev.js:405:5)
    at Object.onceWrapper (node:events:484:28)
    at Server.emit (node:events:378:20)
    at emitListeningNT (node:net:1344:10)
    at processTicksAndRejections (node:internal/process/task_queues:80:21)
npm ERR! code 1

If I replace content: document() with content: text(), the project compiles successfully.

Here're are the relevant dependencies from package.json:

 "@keystone-next/admin-ui": "^8.0.1",
    "@keystone-next/auth": "^14.0.0",
    "@keystone-next/cloudinary": "^2.0.9",
    "@keystone-next/fields": "^4.1.1",
    "@keystone-next/fields-document": "^5.0.0",
    "@keystone-next/keystone": "^9.3.0",
    "@keystone-next/types": "^12.0.0",
    "@keystonejs/server-side-graphql-client": "^1.1.2",
    "@types/nodemailer": "^6.4.0",
    "dotenv": "^8.2.0",
    "next": "^10.0.5",
    "nodemailer": "^6.4.17",
    "react": "^16.14.0",
    "react-dom": "^16.14.0",
Solution

  • You may be using old version of react here, Keystone-next use react 17.02 currently. Try upgrade all dependencies, try yarn upgrade-interactive --latest to upgrade all your dependencies to latest.

    Also. you have to provide some basic options to be able to use Document field properly, at least document({formatting: true}) config is desired otherwise it will be just text field with no formatting.

    here is the example formatting without the need of relationship or other complex setup.

    content: document({        
        formatting: true,
        layouts: [
          [1, 1],
          [1, 1, 1],
          [2, 1],
          [1, 2],
          [1, 2, 1],
        ],
        links: true,
        dividers: true,
      }),

    this will produce document field with following toolbar enter image description here

    for more complex example including working custom document field block see - https://github.com/keystonejs-contrib/keystonejs-document-demo