用于“react-markdown”npm 库的 .md 文件导入的 Webpack 加载器?

Cod*_*boi 4 javascript markdown reactjs webpack

当我导入一个.md文件时,它给了我错误,说它无法读取这个特定的文件.md file syntax,我知道需要某种加载器来解析导入,但是当我在网上查看时,有一个名为的加载器'markdown-loader'仅用于markednpm 包。

我正在使用react-markdownpackage 来读取 md 文件

/* eslint-disable react/prefer-stateless-function */
import React, { Component } from 'react';
import ReactMarkdown from 'react-markdown';
import AppMarkdown from './posts/sample.md';

// import PropTypes from 'prop-types';

class CardDetails extends Component {
  constructor() {
    super();
    this.state = { markdown: '' };
  }

  componentDidMount() {
    // Get the contents from the Markdown file and put them in the React state, so we can reference it in render() below.
     fetch(AppMarkdown)
      .then(res => res.text())
      .then(text => this.setState({ markdown: text }));
  }

  render() {
    const { markdown } = this.state;
    return <ReactMarkdown source={markdown} />;
  }
}

CardDetails.propTypes = {};
export default CardDetails;
Run Code Online (Sandbox Code Playgroud)

控制台上出现错误

这是我的 Markdown 内容sample.md

# React & Markdown App

- Benefits of using React... but...
- Write layout in Markdown!
Run Code Online (Sandbox Code Playgroud)

我找不到包,我到处找,你知道装载机吗?谢谢

dem*_*ych 9

尝试使用原始加载程序:

module.exports = {
  module: {
    rules: [
      {
        test: /\.md$/,
        use: 'raw-loader'
      }
    ]
  }
}
Run Code Online (Sandbox Code Playgroud)