Как мне прочитать локальный файл Markdown в Node?

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 как переменную, а не локально расположенный файл. Очевидная вещь для меня было использовать 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 не является библиотекой по умолчанию для узла? Должен ли он быть включен в package.json для веб-пакета? Даже если я бегу npm install --save fs Я до сих пор не могу получить доступ к этим функциям. (PS Я использую приложение create-реакции-приложение)

Более того, если я не могу сделать это с fsесть другой метод?

Answer 1

fs Модуль не имеет экспорта по умолчанию, поэтому импорт с использованием синтаксиса импорта по умолчанию не будет работать. fs модуль экспортирует только именованные экспорты, поэтому импортируйте их все под именем fs вот так:

import * as fs from 'fs'

Это импортирует все именованные экспорты как свойства одного объекта с именем fs, Это позволит вам сделать fs.readFile, А еще лучше, вы можете использовать именованный экспорт для импорта только нужной вам функции:

import { readFile } from 'fs'

Во-вторых, пройти readFile путь к файлу Markdown, не импортируйте его напрямую с синтаксисом импорта:

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

Если у вас нет правильного загрузчика для импорта файла, не импортируйте его с require или же import, Узел будет обрабатывать его как файл JavaScript и пытаться интерпретировать Markdown как JavaScript. Передайте путь к файлу Markdown непосредственно в readFile, Также не забудьте указать кодировку как utf8 чтобы получить строковое содержимое файла.