1.0.1 • Published 4 years ago
@faisal50x/markdown-view v1.0.1
markdown-view
React-native component which renders markdown into a webview!
Features
- Renders Markdown into a react-native WebView component.
- Automatically opens links in the system browser.
- Customization with pure CSS.
Installation
npm install --save @faisal50x/markdown-view
Use as React component
Really simple markdown example with ES6/JSX:
import Markdown from "@faisal50x/markdown-view";
class Example extends Component {
render() {
var markdown = "# Welcome to React Native!\n\nMore content...";
return <Markdown body={markdown} />;
}
}
Available props / converter options
title
String, optional, plain text which will be used for the title, normally not shown, so you can skip this.body
String, required, markdown body which will be shown as webview content.pureCSS
String, optional, pure CSS which will be used to style the webview content.automaticallyAdjustContentInsets
Bool, optional, see ScrollView#automaticallyAdjustContentInsetsstyle
mixed, optional (default{ flex: 1 }
), see View#styleoptions
Object, optional (default{simplifiedAutoLink: true, strikethrough: true, tables: true}
), see Showdown#options
Run the example
git clone https://github.com/Faisal50x/markdown-view.git
cd markdown-view/example
npm install
Run the react-native project like any react-native project.
Credits
Fork From react-native-showdown
Project is based on the markdown parser Showdown.
Alternatives
- react-native-markdown which tries to render markdown as native components (instead of using a WebView).