Я пытаюсь получить выведенное имя файла из загрузчика файлов, но экспорт по умолчанию представляет собой простую строку с префиксом 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. Я должен сделать больше исследований.