[Fixed] Quill editor not displaying as expected in Angular 8 app


I am trying to add the Quill text editor to my Angular 8 project, but it is not rendering correctly on the browser.

There are no errors appearing in the console, and this is what is displayed in the browser:


I followed the installation steps as outlined here.

Also, the following is mentioned in my angular.json:

"styles": [
"scripts": ["./node_modules/quill/dist/quill.js"]

Here are the imports in my NgModule:

imports: [

And here is my HTML:

<div id="quill">
    <p>Content *</p>
    <quill-editor [styles]="editorStyle" placeholder="Enter Text" [modules]="config" formControlName="yourCtrlname"

Can someone please tell me why the editor isn’t rendering correctly>


I’m using quill in my angular project and I’m not sure why you have those hard-coded paths in your angular json – also there is a package that wraps quill in an angular module, I think that’s what you’re expecting to be defined by QuillModule, but I think you’re just referencing the quill-source, not specific to angular. I think if you remove those imports from angular.json and just run :

npm install --save quill
npm install --save ngx-quill

And then make sure you in your module your quillModule is importing from the ngx-quill

import { QuillModule } from 'ngx-quill';

I don’t recall encountering any difficulties getting it up and running, but it looks like you have the quill library, but not the angular module – which seems to be the syntax you’re using/expecting, so think you just need to install dependencies properly.

Leave a Reply

(*) Required, Your email will not be published