fvilers/angular-file-dropzone

NG Build brings me a module error

androidseb25 opened this issue · 17 comments

Hey i get after the update to 2.1.0 an Error

ERROR in Error: Unexpected value 'AngularFileDropzoneModule in /node_modules/angular-file-dropzone/src/app/modules/angular-file-dropzone/angular-file-dropzone.module.d.ts' imported by the module 'AppModule in APPMODULE-PATH'. Please add a @NgModule annotation.

How can i fixed that, please help me :(

Hi! I'm sorry to read that. Could you provide me more information? What version of Angular do you use? Could you add a small repro on Plunker?

Angular Version is 5.0.0

This error occurs only when i start a ng build --prod --aot
When i testing the function with ng serve nothing happend it's only a compiler error

Thats my app-module.ts

`import {BrowserModule} from '@angular/platform-browser';
import {NgModule, NO_ERRORS_SCHEMA} from '@angular/core';

import {AppComponent} from './app.component';
import {AppRoutingModule} from './app-routing.module';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {
MatButtonModule,
MatCardModule,
MatCheckboxModule,
MatChipsModule,
MatDatepickerModule,
MatDialogModule,
MatExpansionModule,
MatGridListModule,
MatInputModule,
MatListModule,
MatMenuModule,
MatNativeDateModule,
MatPaginatorModule,
MatSelectModule,
MatSidenavModule,
MatSlideToggleModule,
MatSnackBarModule,
MatSortModule,
MatTableModule,
MatTabsModule,
MatToolbarModule,
MatTooltipModule
} from '@angular/material';
import {CdkTableModule} from '@angular/cdk/table';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {AuthGuard} from './guards/auth.guard';
import {ScrollToModule} from '@nicky-lenaers/ngx-scroll-to';
import {ResponseService} from './shared/services/response.service';
import {EbisBoardComponent} from './ebis/ebis-board/ebis-board.component';
import {EbisSearchComponent} from './ebis/ebis-search/ebis-search.component';
import {EbisSearchDetailComponent} from './ebis/ebis-search/ebis-search-detail/ebis-search-detail.component';
import {EbisDocComponent} from './ebis/ebis-doc/ebis-doc.component';
import {EbisService} from './shared/services/ebis.service';
import {ArraySortPipe, HighlightSearch, SafeHtmlPipe, SafeURLPipe, SearchFilterPipe} from './pipe/pipes.pipe';
import {CookieService} from 'ngx-cookie-service';
import {LoginDialogComponent} from './logindialog/logindialog.component';
import {HttpClientModule} from '@angular/common/http';
import {AngularFileDropzoneModule} from 'angular-file-dropzone';

@NgModule({
declarations: [
AppComponent,
EbisBoardComponent,
EbisSearchComponent,
EbisSearchDetailComponent,
EbisDocComponent,
SafeHtmlPipe,
SafeURLPipe,
HighlightSearch,
ArraySortPipe,
SearchFilterPipe,
LoginDialogComponent
],
imports: [
BrowserModule,
HttpClientModule,
AppRoutingModule,
ReactiveFormsModule,
FormsModule,
MatDialogModule,
MatButtonModule,
MatTableModule,
MatDatepickerModule,
MatNativeDateModule,
MatSortModule,
MatCardModule,
MatInputModule,
MatSlideToggleModule,
MatCheckboxModule,
MatGridListModule,
MatSelectModule,
MatChipsModule,
MatMenuModule,
MatPaginatorModule,
MatSidenavModule,
MatToolbarModule,
MatSnackBarModule,
MatTooltipModule,
MatExpansionModule,
MatTabsModule,
MatListModule,
CdkTableModule,
BrowserAnimationsModule,
ScrollToModule.forRoot(),
AngularFileDropzoneModule
],
providers: [
AuthGuard,
ResponseService,
EbisService,
CookieService
],
entryComponents: [
LoginDialogComponent
],
schemas: [NO_ERRORS_SCHEMA],
bootstrap: [AppComponent]
})
export class AppModule { }
`

First of all, the flag --aot is redundant when using --prod, so you don't need to specify it.

Secondly, a demo app is deployed on https://fvilers.github.io/angular-file-dropzone/. It's built with the --prod flag (so the --aot flag too) and it doesn't seems to have any build issue.

Which version of Node.js do you run?

That's strange :/

NodeJS version is 8.9.0

Could you clone this repository and run the same commands? You should have an output like this one:

c:\Projects\angular-file-dropzone>node -v
v8.9.1

c:\Projects\angular-file-dropzone>npm -v
5.5.1

c:\Projects\angular-file-dropzone>npm run gh-build

> angular-file-dropzone@2.1.0 gh-build c:\Projects\angular-file-dropzone
> ng build --prod --output-path docs --base-href angular-file-dropzone

Date: 2017-11-08T09:03:01.846Z
Hash: 3b1b460532448bb9fcd5
Time: 61567ms
chunk {0} polyfills.ad37cd45a71cb38eee76.bundle.js (polyfills) 60.9 kB [initial] [rendered]
chunk {1} main.411e96f484bef4b427c5.bundle.js (main) 303 kB [initial] [rendered]
chunk {2} styles.437ad558a94691b2d38d.bundle.css (styles) 43.3 kB [initial] [rendered]
chunk {3} inline.f688343a15165e183d92.bundle.js (inline) 1.45 kB [entry] [rendered]

I run it and it's build without any errors :/

So I'm pretty sure the issue is on your side. Could you manually remove angular-file-dropzone from your package.json, package-lock.json, and node_modules directory. Then try to reinstall it.

So i reinstalled it and it doesn't work.
I tried it in a other project and i get the same error :(

Maybe the problem is the cdk Versions?
You have cdk 2.0.0-beta.12 and i the 5.0.0-rc0

Hmm, that's strange. I don't think cdk is related as this project doesn't use it. Could you post your package.json?

Sure here is the package.json
Only remove the *.txt extansion GitHub don't accept *json Files
package.json.txt

It's definitely not cdk or material that cause the issue. I built this project with the needed packages but with the same version than yours, and it builds successfully. I don't know how to help you better, I suppose there's one library in your project that cause the issue.

image

I started from a new project and I can reproduce your issue. I'll dig into it, stay tuned.

ok thanks :D

I've published a 2.1.1 version that should solve your issue.

Thank You very much you are my hero :D

You're welcome, could you confirm that the compilation with AOT works on your side?

Yep it compiles :D