Good observation by @Otrebor regarding the version of @types/quill.

I managed to install Quill with Angular 15 using:

• npm i ngx-quill@21
• npm i @types/quill@1

as version 22 required Angular 16, and @types/quill@2 leads to the error message regarding "Delta".

Follow these simple steps to install quilljs in Angular application

Install the below packages

npm install quill npm install ngx-quill npm install @types/quill

Add the below css files in angular.json file.

"styles": ["./node_modules/quill/dist/quill.core.css",
    "./node_modules/quill/dist/quill.bubble.css",
    "./node_modules/quill/dist/quill.snow.css",
    "src/styles.css",
]

Add the below module in app.module.ts file under

`QuillModule.forRoot({
      customOptions: [{
        import: 'formats/font',
        whitelist: ['mirza', 'roboto', 'aref', 'serif', 'sansserif', 'monospace']
      }]
})`

Add the below code in app.component.html.

<quill-editor [styles]="{height: '200px'}"></quill-editor>

I have created Stackblitz demo here.

Follow these steps it should work:

1- Installation:

 npm install ngx-quill
 npm install @angular/core
 npm install @angular/common
 npm install @angular/forms
 npm install @angular/platform-browser
 npm install quill
 npm install rxjs — peer dependencies of rxjs-quill

• include theme stylings: bubble.css, snow.css of quilljs in your index.html, or add them in your css/scss files with @import statements, or add them external stylings in your build process.

Update the angular.json file with the following code:

  “styles”: [
          “./node_modules/@angular/material/prebuilt-themes/indigo-pink.css”,
          “src/styles.css”,
          “./node_modules/quill/dist/quill.core.css”,
          “./node_modules/quill/dist/quill.snow.css”
        ],
        “scripts”: [“./node_modules/quill/dist/quill.js”]

import it in your app.module.ts

   import { QuillModule } from 'ngx-quill'

and in the imports add it like bellow

 @NgModule({
  declarations:[],
  imports:[
    CommonModule,
    QuillModule.forRoot(),
  ]
 })

in your component.ts file you can modify the editor style like bellow code:

   editorStyle = {
     height: '200px'
   };

and in your component.html file you could call it like bellow code:

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

You can also check: https://lifecoders.wordpress.com/angular/quill-rich-text-editor-setup-in-angular-7-8/

and here: https://www.npmjs.com/package/ng-quill