CODEWITHSUNDEEP
angularangular9ckeditor5
Jalaleddin Hosseini
Jalaleddin Hosseini

Reputation: 2272

error: Could not find a declaration file for module '@ckeditor/ckeditor5-build-classic' angular 9

I want to use ckeditor in angular 9, I followed instructions in https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/frameworks/angular.html but it shows an error where I import '@ckeditor/ckeditor5-build-classic':

Could not find a declaration file for module '@ckeditor/ckeditor5-build-classic'. 

'a:/repositories/BasimStore/source/Web/Frontend/node_modules/@ckeditor/ckeditor5-build-classic/build/ckeditor.js' implicitly has an 'any' type.
  Try `npm install @types/ckeditor__ckeditor5-build-classic` if it exists or add a new declaration (.d.ts) file containing `declare module '@ckeditor/ckeditor5-build-classic';`

enter image description here

I have both "@ckeditor/ckeditor5-angular": "^1.2.3" and "@ckeditor/ckeditor5-build-classic": "^20.0.0" in package.json but still it shows the error. I could't find index.d.ts in ckeditor5-build-classic folder. How should I fix this error?

Upvotes: 34

Views: 37415

Answers (7)

Mohammad Dayyan
Mohammad Dayyan

Reputation: 22458

According of https://ckeditor.com/docs/ckeditor5/latest/installation/integrations/angular.html#using-a-custom-ckeditor-5-build

First:

npm install --save @ckeditor/ckeditor5-angular

Second: Install one of the CKEditor 5 predefined builds or create a custom one.
e.g:

npm install --save @ckeditor/ckeditor5-build-classic

Install all the required peer dependencies:

npm install --save @ckeditor/ckeditor5-core @ckeditor/ckeditor5-engine @ckeditor/ckeditor5-utils @ckeditor/ckeditor5-watchdog

at last add the following to tsconfig.json

"compilerOptions": {
    "allowJs": true,
    "target": "es2015"
    // other options
}

Upvotes: 1

surya narayana
surya narayana

Reputation: 1

Step1) First Identify the error and Read The error carefully

Step 2) they give new one to install ckeditior try it for Ex: like these npm

install --save @ckeditor/ckeditor5-build-classic

Step3) Even though its not work

Step4) Type ClassicEditor below import statements they give option where to import then you choose your ClassicEditor should be imported @ckeditor/ckeditor5-build-classic

Upvotes: -3

Zohidbek Abduqodir
Zohidbek Abduqodir

Reputation: 326

I had the same problem, too.

error picture

After running this command:

npm i --save-dev @types/ckeditor__ckeditor5-build-classic

The errors disappeared immediately.

Upvotes: 6

Latos
Latos

Reputation: 41

If anyone is still interested there is community support for TS. All you need to do is to update your package.json with entries like:

    "@types/ckeditor__ckeditor5-core": "^27.0.13",
    "@types/ckeditor__ckeditor5-basic-styles": "^27.0.1",
    "@types/ckeditor__ckeditor5-editor-classic": "^27.0.0",
    "@types/ckeditor__ckeditor5-essentials": "^27.0.4",
    "@types/ckeditor__ckeditor5-paragraph": "^27.0.0"

Upvotes: 1

Vikas Kandari
Vikas Kandari

Reputation: 1851

Add typings.d.ts file in your project root or any folder

add following code into the typing file

declare module '@ckeditor/ckeditor5-build-classic' {
    const ClassicEditorBuild: any;

    export = ClassicEditorBuild;
}

that's it angular will automatically detect typings and compile it as dependency this will solve the issue its also sugggested in official CKEDITOR page: https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/frameworks/angular.html

enter image description here

Directory Structure

enter image description here

Upvotes: 54

Alex Cooper
Alex Cooper

Reputation: 597

Typescript can't find a declaration file and is complaining about the implicit/inferred type of "any".

You can disable the rule as noted by @khaled (the "nuclear" option - the rule is disabled globally).

A better workaround is to explicitly define the type of ClassicEditorBuild as "any" in a typings.d.ts file as described here: https://github.com/ckeditor/ckeditor5-angular/issues/70#issuecomment-513827165

That worked for me when upgrading to CKEditor5 with Angular 11.0.5 and Typescript 4.0.2

Upvotes: 0

khaled baati
khaled baati

Reputation: 69

I have the same issue with angular 8 "@ckeditor/ckeditor5-angular": "^1.2.3", "@ckeditor/ckeditor5-build-classic": "^19.0.2",

Edit: I found this solution: edit your TypeScript Config file (tsconfig.json) and add a new key value pair as

"noImplicitAny": false

Upvotes: 6

Related Questions