https://github.com/rossonlinesolutions/react-markdown

A markdown render component for react.
https://github.com/rossonlinesolutions/react-markdown

gfm markdown react react-component-library react-markdown yarn

Last synced: about 21 hours ago
JSON representation

A markdown render component for react.

• Host: GitHub
• URL: https://github.com/rossonlinesolutions/react-markdown
• Owner: rossonlinesolutions
• License: mit
• Created: 2024-07-13T11:03:07.000Z (3 months ago)
• Default Branch: main
• Last Pushed: 2024-08-23T18:53:30.000Z (about 1 month ago)
• Last Synced: 2024-09-18T20:35:23.830Z (9 days ago)
• Topics: gfm, markdown, react, react-component-library, react-markdown, yarn
• Language: CSS
• Homepage: https://ross-agentur.de
• Size: 1010 KB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# @rossonlinesolutions/react-markdown

> A markdown render component for react.

## Build and Run

To build this package, just run:

```sh

# Installs all dependencies

yarn install

# Builds the library

yarn build

```

### Run the demo application

To run the demo application, follow the instructions in the [example README](./example/README.md).

## Install

### npm

To install this package via npm, create a `.npmrc` file at the root of your npm project

and add the following line to it:

```

@rossonlinesolutions:registry=https://npm.pkg.github.com/

```

Then install this package by running:

```sh

npm install --save @rossonlinesolutions/react-markdown

```

### yarn

To install this package via yarn, create a `.yarnrc` file at the root of your yarn project

and add the following line to it:

```

"@rossonlinesolutions:registry" "https://npm.pkg.github.com/"

```

Then install this package by running:

```sh

yarn add @rossonlinesolutions/react-markdown

```

## Usage

```tsx

import React from 'react';

// import the Markdown view component

import MarkdownView from '@rossonlinesolutions/react-markdown';

// import the component stylesheet

import '@rossonlinesolutions/react-markdown/dist/index.css';

// An example Markdown string

const markdown_str = `# Hello

## Hello2

- [X] check

- [ ] no check

**bolt** *italic* \`inline code\`

\`\`\`js

function main() {

  console.log('Hello! This here is a very long string that is here to test the scrolling capabilities of the Markdown component. So just a test!!!')

}

\`\`\`

RAW
`;


// The component function

function App() {

  // Set the markdown string into the src property

  return (
);

}


export default App;

```

## License

MIT © [Ross Online Solutions](https://github.com/rossonlinesolutions)