标记不是函数

Question

我正在尝试使用 React 和标记的节点包构建降价预览器。当我尝试解析 DOM 上的任何降价时，一切正常。当我这样做时，我收到一条错误消息：Uncaught TypeError: marked is not a function.

我在文件的顶部标记了这样的声明：

import { useState } from "react";
import "./App.css";
const marked = require("marked");

我也试过这样声明标记：

import { useState } from "react";
import "./App.css";
const { marked } = require("marked");

但这似乎没有什么不同。

这是我的代码配置：

            <div className="preview-label">Preview</div>
            <div
              id="preview"
              className="preview-area"
              dangerouslySetInnerHTML={{
                __html: marked(mrkdwn),
              }}
            ></div>
          </div>

我也试过：

            <div className="preview-label">Preview</div>
            <div
              id="preview"
              className="preview-area"
              dangerouslySetInnerHTML={{
                __html: marked.parse(mrkdwn),
              }}
            ></div>
          </div>

            <div className="preview-label">Preview</div>
            <div
              id="preview"
              className="preview-area"
              dangerouslySetInnerHTML={{
                __html: marked.parser(mrkdwn),
              }}
            ></div>
          </div>

和

            <div className="preview-label">Preview</div>
            <div
              id="preview"
              className="preview-area"
              dangerouslySetInnerHTML={{
                __html: marked.Parser(mrkdwn),
              }}
            ></div>
          </div>

但是，我在这些尝试中也收到了类似的错误消息，只是在这些情况下消息说 .Parser、.parse、.parser 等不是函数。

如果您需要查看更多代码，请告诉我。

我在谷歌搜索中都找不到解决方案。可能我漏掉了什么。

如有任何帮助，我们将不胜感激。

提前致谢。

Answer 1

我发现我应该像这样导入标记：

import { marked } from 'marked'

标记不是函数

Marked is not a function

react-hooks

javascript-marked