javascript - 如何在 Node 中读取本地 Markdown 文件？

Question

我正在使用一个名为 react-markdown 的库。如果您了解 React，它的实现会非常简单。

import React from 'react';
import ReactDOM from 'react-dom';
import ReactMarkdown from 'react-markdown';

var content = '# This is a header\n\nAnd this is a paragraph';

ReactDOM.render(
  <ReactMarkdown source={content} />,
  document.getElementById('root')
);

该库的演示仅讨论将 Markdown 字符串创建为变量，而不是本地文件。对我来说显而易见的事情是在 Node.js 中使用 fs。所以我写了以下内容:

import React from 'react';
import ReactDOM from 'react-dom';
import ReactMarkdown from 'react-markdown';
import * as fs from 'fs';
import content from './content/generic.md';

fs.readFile(content, (err, data) => {
  if (err) throw err;
  console.log(data);
});

在我可以为 ReactMarkdown 元素提供内容之前，Webpack 提示说 readFile 不是一个函数!

具体来说，它突出显示 fs.readFile 行并说:

TypeError: __WEBPACK_IMPORTED_MODULE_5_fs___default.a.readFile is not a function

如果我使用 import {readFile } from 'fs' 会发生同样的错误，当我使用 fs.stat 或 fs.open 时也会发生同样的错误。 fs 不是 Node 的默认库吗？它应该包含在 webpack 的 package.json 中吗？即使我运行 npm install --save fs 我仍然无法访问这些功能。 (附:我正在使用 create-react-app)

另外，如果我用fs做不到，还有别的方法吗？

Answer 1

fs 模块没有默认导出，因此使用默认导入语法导入它是行不通的。 fs 模块仅导出命名的导出，因此将它们全部导入名称 fs 中，如下所示:

import * as fs from 'fs'

这会将所有命名导出作为一个名为 fs 的对象的属性导入。这将允许您执行 fs.readFile。更好的是，您可以使用命名导出导入来导入只是您需要的函数:

import { readFile } from 'fs'

其次，给readFile传一个path到Markdown文件，不要直接用import语法导入:

fs.readFile('./content/generic.md', 'utf8', (err, data) => {
    ...
});

除非您有正确的加载程序来导入文件，否则不要使用require 或import 导入它。 Node 会将其视为 JavaScript 文件，并尝试将 Markdown 解释为 JavaScript。将 Markdown 文件的路径直接传递给 readFile。还要确保将编码指定为 utf8 以获取文件的字符串内容。