Skip to content

OliverLeitner/markdowntohtml-component-stencil

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

88 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Built With Stencil

MarkdownToHTML Component

This stencil markdowntohtml component will render a markdown text to HTML. It is based on marked.

Installation

Stencil components can be integrated with many javascript frameworks (angular, react, ...) or with javascript native.. More information on this here

Usage

Simply include the component into html code like any other HTML tag. Use the 'content' attribute to pass the markdown text to be rendered into HTML. Example :

<markdowntohtml-component content="# Markdown Component

This stencil markdown component will render a markdown text to HTML. It is based on [marked](https://marked.js.org/#/README.md)."></markdown-component>

Using this component

Script tag

  • Publish to NPM
  • Put a script tag similar to this <script src='https://unpkg.com/markdowntohtml-component@0.0.1/dist/markdowntohtmlcomponent.js'></script> in the head of your index.html

Node Modules

  • Run npm install markdown-component --save
  • Put a script tag similar to this <script src='node_modules/markdowntohtml-component/dist/markdowntohtmlcomponent.js'></script> in the head of your index.html

In a stencil-starter app

  • Run npm install markdowntohtml-component --save
  • Add an import to the npm packages import markdowntohtml-component;

Use in template

You can then use the element anywhere in your template, JSX, html etc Simply include the component into html code like any other HTML tag. Use the 'content' attribute to pass the markdown text to be rendered into HTML.

Example :

<markdown-component content="# Markdown Component

This stencil markdown component will render a markdown text to HTML. It is based on [marked](https://marked.js.org/#/README.md)."></markdown-component>

Languages

  • TypeScript 81.4%
  • HTML 13.7%
  • CSS 4.9%