title: Quill editor not rendering in React
body: <p>I am developing one application in Ionic react. I want rich text editor which will save data on firestore. I have initiated editor as below and added this component in homepage. But its not rendering correctly though its working correctly.</p>
  <p>You can also provide/suggest me better solution or other rich text editor. I want rich text editor (exactly like Stackoverflow text editor in question part) and data should get saved in firestore. I have attached screenshot &amp; Code.</p>
  <p><img src="https://i.stack.imgur.com/1G088.png" alt="Dashboard screenshot" /></p>
  <p>QuillEditor.js</p>
  <pre><code>import React from 'react';
  
  import 'quill/dist/quill.core.css';
  import 'quill/dist/quill.snow.css';
  
  import Quill from 'quill/core';
  import Toolbar from 'quill/modules/toolbar';
  import Snow from 'quill/themes/snow'; //snow works, but need to import and register formats, and replace icons...
  
  import Bold from 'quill/formats/bold';
  import Italic from 'quill/formats/italic';
  import Header from 'quill/formats/header';
  import Underline from 'quill/formats/underline';
  import Link from 'quill/formats/link';
  import List, { ListItem } from 'quill/formats/list';
  
  import Icons from 'quill/ui/icons'; 
  
  export default class QuillEditor extends React.Component {
  
    componentDidMount() {
  
      Quill.register({
        'modules/toolbar': Toolbar,
        'themes/snow': Snow,
        'formats/bold': Bold,
        'formats/italic': Italic,
        'formats/header': Header,
        'formats/underline': Underline,
        'formats/link': Link,
        'formats/list': List,
        'formats/list/item': ListItem,
        'ui/icons': Icons
      });
  
      var icons = Quill.import('ui/icons');
      icons['bold'] = '&lt;i class=&quot;fa fa-bold&quot; aria-hidden=&quot;true&quot;&gt;&lt;/i&gt;';
      icons['italic'] = '&lt;i class=&quot;fa fa-italic&quot; aria-hidden=&quot;true&quot;&gt;&lt;/i&gt;';
      icons['underline'] = '&lt;i class=&quot;fa fa-underline&quot; aria-hidden=&quot;true&quot;&gt;&lt;/i&gt;';
      icons['link'] = '&lt;i class=&quot;fa fa-link&quot; aria-hidden=&quot;true&quot;&gt;&lt;/i&gt;';
      icons['clean'] = '&lt;i class=&quot;fa fa-eraser&quot; aria-hidden=&quot;true&quot;&gt;&lt;/i&gt;'; 
  
      var quill = new Quill('#editor', {
        theme: 'snow', //this needs to come after the above, which registers Snow...
        placeholder: &quot;Write something awesome...&quot;
      });
    } //componentDidMount
  
    render() {
      return (
        &lt;div&gt;&lt;meta charset=&quot;utf-8&quot; /&gt;
            &lt;div id=&quot;QuillEditor-container&quot;&gt;
              {/* &lt;!-- Create the editor container --&gt; */}
              &lt;div id=&quot;editor&quot;&gt;
                &lt;p&gt;Hello World!&lt;/p&gt;
                &lt;p&gt;Some initial &lt;strong&gt;bold&lt;/strong&gt; text&lt;/p&gt;
                &lt;p&gt;&lt;/p&gt;
              &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
      )
    }
  }
  </code></pre>