如何呈現foo.md降價文件的反應？

我有幾個.MD文件（含長文本），我想使它們通過反應。我試圖使用標記它，但加載器返回一個錯誤。這裏是webpack.config.js文件：如何呈現foo.md降價文件的反應？

var path = require('path'); 
var webpack = require('webpack'); 
var subscript = require('markdown-it'); 
var superscript = require('markdown-it'); 

module.exports = { 
    entry: ['./src/first.jsx'], 
    devtool: 'cheap-module-eval-source-map', 
    output: { path: __dirname+"/app", filename: 'bundle.js' }, 
    module: { 
     loaders: [ 
      { test: /\.jsx?$/, 
       loader: 'babel-loader', 
       query: { presets: ['es2015', 'react'] }, 
       include: path.join(__dirname, 'src') 
      }, 
      { test: /\.md/, 
       loader: 'markdown-it' 
      } 
     ] 
    }, 
    'markdown-it': { 
     preset: 'default', 
     typographer: true, 
     use: [subscript, superscript] 
    } 
};

該文件有問題嗎？我還可以添加我的* .md文件來做出反應？

閱讀http://www.shoutinginfrench.com/today-i-made-react-load-markdown/後，我試圖用降價裝載機。接下來，我將這個添加到webpack.config文件中：

{ test: /\.md$/, 
    loader: "html!markdown" 
}

哪一個沒有問題。然後我試圖降價文件如下加入到反應元件：

import React from 'react'; 
import { Link } from 'react-router' 
import markdownFile from './test-file.md'; 
export const Test = React.createClass({ 
    rawMarkup(){ 
     return { __html: markdownFile }; 
    }, 
    render() { 
     return (
      <div className="something"> 
       <div className="row"> 
        <div className="col-10"> 
         <div dangerouslySetInnerHtml={this.rawMarkup()} /> 
        </div> 
       </div> 
      </div> 
     ); 
    } 
});

但我發現了以下錯誤：

ERROR in ./src/components/tst.jsx 
Module not found: Error: Cannot resolve module 'html' in /Users/..../src/components 
@ ./src/components/tst.jsx 14:15-39

如何解決呢？

來源

2016-02-19 Birish

哪裏錯誤？ – Kreozot

爲什麼你不使用markdown-ir-sub和markdown-it-sup？ – Kreozot

裝載機是正確的方式。你能給我們提供更多有關你得到的錯誤的信息嗎？堆棧跟蹤？ –

如果有人仍然在尋找一種方式來做到這一點，我剛剛出版了一的WebPack裝載機與此交易..

React Markdown

來源

2016-06-18 03:29:34 javiercf

添加{ test: /\.md$/, loader: "html!markdown" },{ test: /\.json$/, loader: "json" }您webpack.config.js。

npm install react-markdown --save-dev

來源

2016-07-31 02:17:01

您需要改爲安裝'markdown-loader'包。還要確保你有'html-loader'這個工作 – patmood

如何呈現foo.md降價文件的反應？

回答

相關問題