如何获得带有 html 和 head 标签的完整grapejs HTML？答案

【问题标题】：How can I get the full grapejs HTML with html and head tags?如何获得带有 html 和 head 标签的完整grapejs HTML？
【发布时间】：2022-11-10 10:19:09
【问题描述】：

我在documentation 中找不到如何获得满的使用grapejs工作的html。我有一个配置对象：

export const configObject = {
  container: "#gjs",
  fromElement: false,
  height: "50rem",
  width: "auto",
  commands: { defaults: editorAssets.commands },
  canvasCss:
    ".gjs-selected {outline: 3px solid #556ee6 !important;} .gjs-toolbar {background-color: #556ee6 !important;} .gjs-badge__name {background-color: #556ee6 !important;}",
  storageManager: false,
  deviceManager: { devices: editorAssets.devices },
  layerManager: { appendTo: ".layers-container" },
  traitManager: { appendTo: ".settings-container" },
  blockManager: { appendTo: ".blocks-container", blocks: editorAssets.blocks },
  styleManager: {
    appendTo: ".styles-container",
    sectors: editorAssets.sectors,
  },
  panels: { defaults: editorAssets.panels },
  plugins: [parserPostCSS, grapesjscomponentcodeeditor],
  pluginsOpts: {
    [grapesjscomponentcodeeditor]: {
      appendTo: ".panel__right",
      preserveWidth: true,
      cleanCssBtn: false,
    },
  },
}

然后在编辑器上：

const editor = grapesjs.init({
  ...configObject,
  components: templateId ? currentTemplate.template : "",
})

setGetTemplateCode(() => () => {
  return `${editor.getHtml({
    cleanId: false,
  })}<style>${editor.getCss()}</style><script>${editor.getJs()}</script>`
})

这个.getHtml 函数返回一个不完整的 HTML 字符串，元标记不在 head 标记内，没有 HTML 标记，没有 DOCTYPE 等。我怎样才能得到一个真正完整的标准 HTML，它可以工作并且可以在电子邮件？

【问题讨论】：

标签： javascript html reactjs grapejs

【解决方案1】：

只需使用：

editor.Canvas.getDocument()

【讨论】：