A utility for turning raw BBCode into React elements.
npm install bbcode-to-reactA utility for turning raw BBCode into React elements.
Install bbcode-to-react and __peer dependencies__ via NPM
``sh`
npm install --save bbcode-to-react react
Import bbcode-to-react, example:
`js
import React from 'react';
import parser from 'bbcode-to-react';
import { renderToString } from 'react-dom/server';
const Example = (props) => {
return (
{parser.toReact('[b]strong[/b]')}
// render:
strong
`
`js
import React from 'react';
import parser, { Tag } from 'bbcode-to-react';
class YoutubeTag extends Tag {
toReact() {
// using this.getContent(true) to get it's inner raw text.
const attributes = {
src: this.getContent(true),
width: this.params.width || 420,
height: this.params.height || 315,
};
return (
{...attributes}
frameBorder="0"
allowFullScreen
/>
);
}
}
class BoldTag extends Tag {
toReact() {
// using this.getComponents() to get children components.
return (
{this.getComponents()}
);
}
}
parser.registerTag('youtube', YoutubeTag); // add new tag
parser.registerTag('b', BoldTag); // replace exists tag
const Example = (props) => {
return (
{parser.toReact('[youtube width="400"]https://www.youtube.com/embed/AB6RjNeDII0[/youtube]')}
`
Install dependencies:
`sh`
npm install
Run examples at http://localhost:8080/ with webpack dev server:
`sh`
npm start
Run tests & coverage report:
`sh`
npm test
Watch tests:
`sh`
npm run test-watch
* bbcodejs: bbcode-to-react uses the parser from bbcodejs, so much of the credit is due there.bbcode-to-react` uses the webpack config and publish scripts from reactstrap.
* reactstrap: