0

我正在创建一个呈现 markdown（使用 markdown-it）的 Nuxt.js 应用程序（使用 npx 和 create-nuxt 创建）。我为 markdown-it 创建了一个插件。该插件位于“helpers”目录中。

nuxt.config.js

...
modules: [
...,
  '@nuxtjs/markdownit',
 ]
],
...
markdownit: {
  preset: 'commonmark',
  injected: true,
  use: [
    '../helpers/MarkdownNGH',
    'markdown-it-div'
  ]
},

我的插件是'../helpers/MarkdownNGH'。我还添加了另一个插件 markdown-it-div 进行测试。该插件与 npm 一起安装。

助手/MarkdownNGH

module.exports = function plugin (md) {
 md.rendered.rules.link_open = (tokens, idx, options, env, self) => {
  // Logic for replacing the links is not important for this question
 }
}

现在，当我运行npm run dev服务器端渲染时，它应该正常工作，我的插件编辑降价渲染。

问题出现在浏览器端。在浏览器中加载页面会导致控制台中出现以下错误消息：

client.js?06a0:77
TypeError: Cannot assign to read only property 'exports' of object '#<Object>'
    at Module.eval (MarkdownNGH.js?7e65:3)
    at eval (MarkdownNGH.js:67)
    at Module../helpers/MarkdownNGH.js (app.js:322)
    at __webpack_require__ (runtime.js:791)
    at fn (runtime.js:151)
    at eval (markdown-it.js?e563:6)
    at _callee2$ (index.js?f26e:51)
    at tryCatch (runtime.js?96cf:45)
    at Generator.invoke [as _invoke] (runtime.js?96cf:271)
    at Generator.prototype.<computed> [as next] (runtime.js?96cf:97)

在我生成的 app.js 中有以下代码，所以它在编译中。

/***/ "./helpers/MarkdownNGH.js":
/*!********************************!*\
  !*** ./helpers/MarkdownNGH.js ***!
  \********************************/
/*! no exports provided */
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
eval(...) // The error points to this line

我复制了 markdown-it-div 的开发方式（https://github.com/kickscondor/markdown-it-div/blob/master/index.js），它在服务器端渲染和浏览器中都可以正常工作. 我对 webpack 和有关它的东西非常陌生，所以这可能只是某种配置问题等。

编辑：我试过这个：https : //stackoverflow.com/a/56283408/216846 所以将 .babelrc 更改为

{
  "env": {
    "test": {
      "presets": [
        [
          "@babel/preset-env",
          {
            "targets": {
              "node": "current"
            }
          }
        ]
      ],
      "sourceType": "unambiguous"
    },
    "dev": {
      "sourceType": "unambiguous"
    }
  }
}

但这没有帮助。不知道我这样做是否正确。

4

1 回答 1

0

这是@nuxtjs/markdownit 中的一个错误（或缺少的功能）。有一个 PR：https ://github.com/nuxt-community/modules/pull/323

当 PR 被合并（或者你用它构建 markdownit）时，将插件代码更改为

export default function plugin (md) {
 md.rendered.rules.link_open = (tokens, idx, options, env, self) => {
  // Logic for replacing the links is not important for this question
 }
}
于 2020-01-14T08:30:11.740 回答