Webpack, Storybook for React - файл-загрузчик выводит JavaScript строку вместо имени файла - PullRequest
0 голосов
/ 28 февраля 2020

Я пытаюсь получить выведенное имя файла из загрузчика файлов, но экспорт по умолчанию представляет собой простую строку с префиксом module.exports. (РЕДАКТИРОВАТЬ // Ошибка возникает при использовании Storybook для React.) Что я делаю не так?

Вот фрагмент из моего webpack.config.js:

{
  test: /\.md$/,
  use: [
    {
      loader: 'file-loader',
      options: {
        esModule: false,
      },
    },
  ],
},

Вот код TypeScript / React куда я импортирую файл:

async componentDidMount() {
  const { baseFileName } = this.props;
  const markdownUri = await import(`../../md/${baseFileName}.md`);
  const res = await fetch(markdownUri.default);
  const markdown = await res.text();
  this.setState({ markdown });
}

Когда я пытаюсь отобразить импортированный файл следующим образом ...

<ReactMarkdown source={markdown} />

... вместо этого он выводится на веб-страницу отображаемой уценки:

<code><!DOCTYPE html><html lang="en"> <head> <meta charset="utf-8"> <title>Error</title> </head> <body> <pre>Cannot GET /module.exports%20=%20__webpack_public_path__%20+%20%2259817c84b11d2eb92f3d8b48d86b2789.md%22;

Т.е. вся строка module.exports передается в вызов fetch, который затем завершается неудачей.

Буду признателен за любую помощь.

РЕДАКТИРОВАТЬ // Кажется, это проблема сборника рассказов c Я не упоминал об этом. Код работает на простом сервере разработки Webpack. Я должен сделать больше исследований.

...