Typescript와 대응하는 Markdown

Question

Typescript를 사용하여 Markdown을 구문 분석 할 수있는 방법이 있습니까?

내가 좋아하는 일을하려고 :

import * as ReactMarkdown from 'react-markdown' 
// OR 
import ReactMarkdown = require('react-markdown') 

그러나 타이프 라이터가 FINT 모듈의 반응-인하 '를 할 수가 정의되어 있지 않은 것 같이

Error: TS2307: Cannot find module 'react-markdown'.

을 내가 모듈을 정의 할 수있는 방법과 React 구성 요소로 사용 하시겠습니까? 계정이없는 경우

Answer 1

. 그들은 타이핑과 내 환경에 필요한 모든 것을 가지고 있습니다.

또한

import { HtmlRenderer, Parser } from 'commonmark' 

export class MyComponent extends React.Component<{}, {}> { 
    private post: string 

    constructor() { 
    super() 
    let parser = new Parser() 
    let renderer = new HtmlRenderer() 
    this.post = renderer.render(parser.parse("**works** like a charm!")) 
    } 

    render() { 
    return (
     <div dangerouslySetInnerHTML={ {__html: this.post} } /> 
    ) 
    } 
} 

는 commonmark의 typings를 추가하는 것을 잊지 마세요 : 여기 내 구현은 도움이하려고했던 사람들에게

$ typings install --global --save dt~commonmark 

감사합니다!

Answer 2

하는 반응-인하와 JSON 로더를 설치

npm install --save react-markdown 
npm install --save json-loader 

이 웹팩 설정에 로더를 추가

{ 
    module: { 
    loaders: [{ 
     test: /\.json$/, 
     loader: 'json' 
    }] 
    } 
} 

가져 오기 반응 - 인하. 그것은 다음 중 하나를 같이한다 : 내가 대신 commonmark 패키지를 사용하여 내 문제를 해결

var ReactMarkdown = require('react-markdown'); 

// es6 
import ReactMarkdown from 'react-markdown';