Skip to content
This repository has been archived by the owner on Mar 11, 2020. It is now read-only.

Issue with Angular 5.x #31

Closed
m-ghaoui opened this issue Nov 6, 2017 · 16 comments
Closed

Issue with Angular 5.x #31

m-ghaoui opened this issue Nov 6, 2017 · 16 comments

Comments

@m-ghaoui
Copy link

m-ghaoui commented Nov 6, 2017

After upgrading my project to Angular 5, I now get this error when running ng serve:

ERROR in ./node_modules/ngx-quill-editor/quillEditor.component.ts
Module build failed: Error: C:\projects\event-system\event-system-admin\node_modules\ngx-quill-editor\quillEditor.component.ts is not part of the compilation output. Please check the other error messages for details.
    at AngularCompilerPlugin.getCompiledFile (C:\projects\event-system\event-system-admin\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:629:23)
    at plugin.done.then (C:\projects\event-system\event-system-admin\node_modules\@ngtools\webpack\src\loader.js:467:39)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
 @ ./src/app/speaker/person-details/person-details.component.ts 18:0-103
 @ ./src/app/speaker/speaker.module.ts
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts
ERROR in ./node_modules/ngx-quill-editor/quillEditor.module.ts
Module build failed: Error: C:\projects\event-system\event-system-admin\node_modules\ngx-quill-editor\quillEditor.module.ts is not part of the compilation output. Please check the other error messages for details.
    at AngularCompilerPlugin.getCompiledFile (C:\projects\event-system\event-system-admin\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:629:23)
    at plugin.done.then (C:\projects\event-system\event-system-admin\node_modules\@ngtools\webpack\src\loader.js:467:39)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
 @ ./src/app/speaker/speaker.module.ts 18:0-94
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts

There's a workaround for this, but it would be good if this issue is fixed.

@m-ghaoui
Copy link
Author

m-ghaoui commented Nov 6, 2017

The workaround is similar to the one mentioned here:

angular/angular#20091 (comment)

I managed to temporarily fix this issue by adding this to the tsconfig.json file:

  "include": [
    "src/**/*",
    "node_modules/ngx-quill-editor/quillEditor.component.ts",
    "node_modules/ngx-quill-editor/quillEditor.module.ts"
  ]

@micheleissa
Copy link

I'm trying what you mentioned and still getting the same error!

@m-ghaoui
Copy link
Author

m-ghaoui commented Nov 6, 2017

Hm. What does the error message say? Does it mention which file is 'is not part of the compilation output'?

@alan345
Copy link

alan345 commented Nov 6, 2017

Update
I have added

  "include": [
    "src/**/*",
    "node_modules/ngx-quill-editor/quillEditor.component.ts",
    "node_modules/ngx-quill-editor/quillEditor.module.ts",
    "node_modules/ngx-quill-editor/index.ts"
  ]

and it seems to work
Update

==========================

Hi! I have almost same error. I have added to tsconfig.json file:

  "include": [
    "src/**/*",
    "node_modules/ngx-quill-editor/quillEditor.component.ts",
    "node_modules/ngx-quill-editor/quillEditor.module.ts"
  ]

In package.json, it is:
"ngx-quill-editor": "^2.2.2",

and error is:

ERROR in ./node_modules/ngx-quill-editor/index.ts
Module build failed: Error: /Users/alan/app/arte/node_modules/ngx-quill-editor/index.ts is not part of the compilation output. Please check the other error messages for details.
    at AngularCompilerPlugin.getCompiledFile (/Users/alan/app/arte/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:629:23)
    at plugin.done.then (/Users/alan/app/arte/node_modules/@ngtools/webpack/src/loader.js:467:39)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
 @ ./src/app/quote/quote.module.ts 34:0-53
 @ ./src/app/user/user.module.ts
 @ ./src/app/app.module.ts
 @ ./src/app/index.ts
 @ ./src/main.ts
 @ multi ./src/main.ts

Thanks!

@micheleissa
Copy link

micheleissa commented Nov 6, 2017

The file it says the problem with is just a node_modules npm pckg that consists of a very simple component .ts file along with some assets ( images and css )
Worth mentioning is that once I downgrade the version something else ( e.g. ~4.3.4 ) it worked.
I believe it is something related to Angular CLI 5.0.0 not your code!
I'm gonna add to the comments on the original issue on Angular CLI

@lamarh
Copy link

lamarh commented Nov 13, 2017

Apparently you cannot delvier non-compiled libraries with migration to Angular 5.x & CLI 1.5.0. See angular/angular-cli#8284

The ngx-quill-editor library will need to pre-compile its delivery.

@m-ghaoui
Copy link
Author

Any ETA on the fix?

@stas-kh
Copy link

stas-kh commented Dec 20, 2017

It would be great to have this problem fixed

@DanushkaAmith
Copy link

The same thing happen to me. It is working when I build the project with AOT but when I try to compile it same error popup like @alan345 Is there any solution?

@nnennajohn
Copy link

While you wait on this, for anyone else that runs into this problem, just grab the files and add to your own build directly like in the screenshot.

I know it is not ideal... But deadlines have to be met. :) And as you can see from my screenshot, there are quite a few plugins i use that are yet to be updated and give the same exact error.

Hope this helps someone.

screenshot 2018-01-04 14 55 08

@DanushkaAmith
Copy link

Hi Guys,
I found solution use this one git repo

@m-ghaoui
Copy link
Author

@DanushkaAmith Thanks for the tip! Sorry for the beginner question, but what is the best way to link to that repo using npm? I haven't quite understood how you can "make build install" an npm package directly off a git repo.

@SalathielGenese
Copy link

@m-ghaoui

A github repo is located at https://github.com/{ ORGNAME }/{ REPONAME } where ORGNAME can actually be USERNAME.

npm allow you to npm install ORGNAME/REPONAME to get a package directly from github repo.

@m-ghaoui
Copy link
Author

I've decided to migrate to https://github.com/Ledzz/angular2-tinymce

@HimansiShahCueserve
Copy link

Update
I have added

  "include": [
    "src/**/*",
    "node_modules/ngx-quill-editor/quillEditor.component.ts",
    "node_modules/ngx-quill-editor/quillEditor.module.ts",
    "node_modules/ngx-quill-editor/index.ts"
  ]

and it seems to work
Update

==========================

Hi! I have almost same error. I have added to tsconfig.json file:

  "include": [
    "src/**/*",
    "node_modules/ngx-quill-editor/quillEditor.component.ts",
    "node_modules/ngx-quill-editor/quillEditor.module.ts"
  ]

In package.json, it is:
"ngx-quill-editor": "^2.2.2",

and error is:

ERROR in ./node_modules/ngx-quill-editor/index.ts
Module build failed: Error: /Users/alan/app/arte/node_modules/ngx-quill-editor/index.ts is not part of the compilation output. Please check the other error messages for details.
    at AngularCompilerPlugin.getCompiledFile (/Users/alan/app/arte/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:629:23)
    at plugin.done.then (/Users/alan/app/arte/node_modules/@ngtools/webpack/src/loader.js:467:39)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
 @ ./src/app/quote/quote.module.ts 34:0-53
 @ ./src/app/user/user.module.ts
 @ ./src/app/app.module.ts
 @ ./src/app/index.ts
 @ ./src/main.ts
 @ multi ./src/main.ts

Thanks!

I works for me was facing issue for index.ts. All set using this. Thanks alot

@variableex
Copy link

install those package ```
"
"ngx-quill": "^8.0.0",
"quill": "^1.3.7",


in app.module.ts
import { QuillModule, QuillEditorComponent } from 'ngx-quill';
`QuillModule.forRoot({
      modules: {
        syntax: true
      }
    }),`

add providers as well 
in app.module.ts


providers: [QuillEditorComponent],

in HTML file 
`<quill-editor  [styles]="quillEditorStyle">`

in component.ts

quillEditorStyle = {
    height: '300px'
  };

![Screenshot 2020-02-11 at 10 16 15 PM](https://user-images.githubusercontent.com/41159056/74258354-301f4480-4d1c-11ea-93d0-b94c1ae2895d.png)


this work for me

hope you guyes like this

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

10 participants