安装代码输入插件后无法在 Sanity CMS 中添加代码块

如何解决安装代码输入插件后无法在 Sanity CMS 中添加代码块

我正在学习使用 Sanity CMS 和 React 构建博客。我是 Sanity 的新手。

我应该能够在我的博客文章中插入代码片段。所以，我已经安装了 code-input 插件。

根据此处的 link，安装插件后，我必须在我的架构类型中使用以下代码。

我不知道在哪里插入代码。

请帮忙。

我的文件夹结构如下：

sanityblog/blockContent.js

/**
 * This is the schema definition for the rich text fields used for
 * for this blog studio. When you import it in schemas.js it can be
 * reused in other parts of the studio with:
 *  {
 *    name: 'someName',*    title: 'Some title',*    type: 'blockContent'
 *  }
 */
export default {
  title: "Block Content",name: "blockContent",type: "array",of: [
    {
      title: "Block",type: "block",// Styles let you set what your user can mark up blocks with. These
      // correspond with HTML tags,but you can set any title or value
      // you want and decide how you want to deal with it where you want to
      // use your content.
      styles: [
        { title: "Normal",value: "normal" },{ title: "H1",value: "h1" },{ title: "H2",value: "h2" },{ title: "H3",value: "h3" },{ title: "H4",value: "h4" },{ title: "Quote",value: "blockquote" },],lists: [{ title: "Bullet",value: "bullet" }],// Marks let you mark up inline text in the block editor.
      marks: {
        // Decorators usually describe a single property – e.g. a typographic
        // preference or highlighting by editors.
        decorators: [
          { title: "Strong",value: "strong" },{ title: "Emphasis",value: "em" },// Annotations can be any object structure – e.g. a link or a footnote.
        annotations: [
          {
            title: "URL",name: "link",type: "object",fields: [
              {
                title: "URL",name: "href",type: "url",},// You can add additional types here. Note that you can't use
    // primitive types such as 'string' and 'number' in the same array
    // as a block type.
    {
      type: "image",options: { hotspot: true },};

sanityblog/schema.js

// First,we must import the schema creator
import createSchema from "part:@sanity/base/schema-creator";

// Then import schema types from any plugins that might expose them
import schemaTypes from "all:part:@sanity/base/schema-type";

// We import object and document schemas
import blockContent from "./blockContent";
import category from "./category";
import post from "./post";
import author from "./author";

// Then we give our schema to the builder and provide the result to Sanity
export default createSchema({
  // We name our schema
  name: "default",// Then proceed to concatenate our document type
  // to the ones provided by any plugins that are installed
  types: schemaTypes.concat([
    // The following are document types which will appear
    // in the studio.
    post,author,category,// When added to this list,object types can be used as
    // { type: 'typename' } in other document schemas
    blockContent,]),});

解决方法

如果您正确安装了插件，它现在可以作为架构类型用于您的任何其他架构。因此，要回答您的问题，您可以将该代码放在您的 Sanity 工作室中任何您想要代码块的位置。我强烈建议您阅读 content modelling 文档 ?

特别是对于您的问题，假设您将 sanityBlog/blockContent.js 字段用于帖子内容，您可以将其添加到那里。下面是它的样子：

export default {
  title: "Block Content",name: "blockContent",type: "array",of: [
    {
      title: "Block",type: "block",// ...annotations,styles,lists and marks you already have
    },{
      type: "image",options: { hotspot: true },},// Add the code block here ?
    // it'll show up as one of the blocks available in your
    // Portable Text Editor
    {
      type: "code",title: "Code block",}
  ],};

有关可移植文本/富内容字段 (type: "block") 的详细信息，请参阅 block type documentation。如果您想退后一步，请参阅general block content documentation。

希望对你有帮助?