JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<div id="app"></div>

Babel + JSX

class App extends React.Component {
  replaceLinks(str = 'Подробнее по ссылке: https://yandex.ru') {
    const reg = /[-a-zA-Z0-9@:%_\+.~#?&\/=]{2,256}\.[a-z]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&\/=]*)?/g;
    return str.replace(reg, m => `<a href="${m}">${m}</a>`);
  }

  render() {
    return (
      <div>
        <div dangerouslySetInnerHTML={{ __html: this.replaceLinks() }}></div>
        <div dangerouslySetInnerHTML={{ __html: this.replaceLinks('Ссылка: https://google.com, ещё ссылка: https://qna.habr.com, и ещё: https://reactjs.org.') }}></div>
        <div dangerouslySetInnerHTML={{ __html: this.replaceLinks('ссылок нет') }}></div>
      </div>
    );
  }
}

ReactDOM.render(<App />, document.getElementById('app'));