angular / in-memory-web-api

The code for this project has moved to the angular/angular repo. This repo is now archived.
MIT License
1.18k stars 232 forks source link

webpack error #143

Closed tavoli closed 6 years ago

tavoli commented 6 years ago

I have a webpack error:

stack:

AppComponentHost.html:1 ERROR Error: [object Object] at viewWrappedDebugError (core.es5.js:8415) at callWithDebugContext (core.es5.js:13485) at Object.debugCreateRootView [as createRootView] (core.es5.js:12792) at ComponentFactory.webpackJsonp.../../../core/@angular/core.es5.js.ComponentFactory.create (core.es5.js:9864) at ComponentFactoryBoundToModule.webpackJsonp.../../../core/@angular/core.es5.js.ComponentFactoryBoundToModule.create (core.es5.js:3333) at ApplicationRef.webpackJsonp.../../../core/@angular/core.es5.js.ApplicationRef.bootstrap (core.es5.js:4768) at core.es5.js:4546 at Array.forEach () at PlatformRef.webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef_._moduleDoBootstrap (core.es5.js:4546) at core.es5.js:4508 View_AppComponent_Host_0 @ AppComponentHost.html:1 proxyClass @ compiler.es5.js:14971 webpackJsonp.../../../core/@angular/core.es5.js.DebugContext.logError @ core.es5.js:13415 webpackJsonp.../../../core/@angular/core.es5.js.ErrorHandler.handleError @ core.es5.js:1080 (anonymous) @ core.es5.js:4409 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:392 webpackJsonp.../../../../zone.js/dist/zone.js.Zone.run @ zone.js:142 webpackJsonp.../../../core/@angular/core.es5.js.NgZone.runOutsideAngular @ core.es5.js:3844 (anonymous) @ core.es5.js:4409 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:392 onInvoke @ core.es5.js:3890 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:391 webpackJsonp.../../../../zone.js/dist/zone.js.Zone.run @ zone.js:142 (anonymous) @ zone.js:844 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:425 onInvokeTask @ core.es5.js:3881 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:424 webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask @ zone.js:192 drainMicroTaskQueue @ zone.js:602 Promise resolved (async) scheduleMicroTask @ zone.js:585 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:414 webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:236 webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleMicroTask @ zone.js:256 scheduleResolveOrReject @ zone.js:842 ZoneAwarePromise.then @ zone.js:932 webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef_.bootstrapModuleWithZone @ core.es5.js:4537 webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef.bootstrapModule @ core.es5.js:4522 ../../../../../src/main.ts @ main.ts:11 webpack_require @ bootstrap 073bd478be39646a2f17:54 0 @ main.bundle.js:889 webpack_require @ bootstrap 073bd478be39646a2f17:54 webpackJsonpCallback @ bootstrap 073bd478be39646a2f17:25 (anonymous) @ main.bundle.js:1 AppComponentHost.html:1 ERROR CONTEXT DebugContext {view: {…}, nodeIndex: 1, nodeDef: {…}, elDef: {…}, elView: {…}} View_AppComponent_Host_0 @ AppComponentHost.html:1 proxyClass @ compiler.es5.js:14971 webpackJsonp.../../../core/@angular/core.es5.js.DebugContext.logError @ core.es5.js:13415 webpackJsonp.../../../core/@angular/core.es5.js.ErrorHandler.handleError @ core.es5.js:1085 (anonymous) @ core.es5.js:4409 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:392 webpackJsonp.../../../../zone.js/dist/zone.js.Zone.run @ zone.js:142 webpackJsonp.../../../core/@angular/core.es5.js.NgZone.runOutsideAngular @ core.es5.js:3844 (anonymous) @ core.es5.js:4409 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:392 onInvoke @ core.es5.js:3890 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:391 webpackJsonp.../../../../zone.js/dist/zone.js.Zone.run @ zone.js:142 (anonymous) @ zone.js:844 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:425 onInvokeTask @ core.es5.js:3881 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:424 webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask @ zone.js:192 drainMicroTaskQueue @ zone.js:602 Promise resolved (async) scheduleMicroTask @ zone.js:585 webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:414 webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:236 webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleMicroTask @ zone.js:256 scheduleResolveOrReject @ zone.js:842 ZoneAwarePromise.then @ zone.js:932 webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef_.bootstrapModuleWithZone @ core.es5.js:4537 webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef.bootstrapModule @ core.es5.js:4522 ../../../../../src/main.ts @ main.ts:11 webpack_require @ bootstrap 073bd478be39646a2f17:54 0 @ main.bundle.js:889 webpack_require @ bootstrap 073bd478be39646a2f17:54 webpackJsonpCallback @ bootstrap 073bd478be39646a2f17:25 (anonymous) @ main.bundle.js:1 zone.js:661 Unhandled Promise rejection: [object Object] ; Zone: ; Task: Promise.then ; Value: Error: [object Object] at viewWrappedDebugError (core.es5.js:8415) at callWithDebugContext (core.es5.js:13485) at Object.debugCreateRootView [as createRootView] (core.es5.js:12792) at ComponentFactory.webpackJsonp.../../../core/@angular/core.es5.js.ComponentFactory.create (core.es5.js:9864) at ComponentFactoryBoundToModule.webpackJsonp.../../../core/@angular/core.es5.js.ComponentFactoryBoundToModule.create (core.es5.js:3333) at ApplicationRef.webpackJsonp.../../../core/@angular/core.es5.js.ApplicationRef.bootstrap (core.es5.js:4768) at core.es5.js:4546 at Array.forEach () at PlatformRef.webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef.moduleDoBootstrap (core.es5.js:4546) at core.es5.js:4508 Error: [object Object] at viewWrappedDebugError (http://localhost:4200/vendor.bundle.js:91126:15) at callWithDebugContext (http://localhost:4200/vendor.bundle.js:96196:15) at Object.debugCreateRootView [as createRootView] (http://localhost:4200/vendor.bundle.js:95503:12) at ComponentFactory.webpackJsonp.../../../core/@angular/core.es5.js.ComponentFactory.create (http://localhost:4200/vendor.bundle.js:92575:46) at ComponentFactoryBoundToModule.webpackJsonp.../../../core/@angular/core.es5.js.ComponentFactoryBoundToModule.create (http://localhost:4200/vendor.bundle.js:86044:29) at ApplicationRef.webpackJsonp.../../../core/@angular/core.es5.js.ApplicationRef.bootstrap (http://localhost:4200/vendor.bundle.js:87479:57) at http://localhost:4200/vendor.bundle.js:87257:81 at Array.forEach () at PlatformRef.webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef_._moduleDoBootstrap (http://localhost:4200/vendor.bundle.js:87257:44) at http://localhost:4200/vendor.bundle.js:87219:27

package.json

{ "name": "smart-net", "version": "0.0.0", "license": "MIT", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "docker_build": "npm run build && docker build . -t smartnet", "docker_start": "npm run docker_build && docker run -itp 8080:80 smartnet", "test": "echo \"Error: no test... minimal project\" && exit 1", "lint": "echo \"Error: no lint... minimal project\" && exit 1", "e2e": "echo \"Error: no e2e... minimal project\" && exit 1" }, "private": true, "dependencies": { "@angular/animations": "^4.3.6", "@angular/common": "^4.3.6", "@angular/compiler": "^4.3.6", "@angular/core": "^4.3.6", "@angular/forms": "^4.3.6", "@angular/http": "^4.3.6", "@angular/platform-browser": "^4.3.6", "@angular/platform-browser-dynamic": "^4.3.6", "@angular/router": "^4.3.6", "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.3", "@ngx-translate/core": "^7.2.1", "@ngx-translate/http-loader": "^1.0.2", "@swimlane/ngx-charts": "^6.0.2", "angular-in-memory-web-api": "^0.4.5", "angular2-loaders-css": "^1.0.9", "angular2-moment": "^1.7.0", "angular2-text-mask": "^8.0.3", "angular2-toaster": "^4.0.1", "core-js": "^2.5.1", "d3": "^4.10.2", "moment": "^2.18.1", "ng2-pop-over": "^0.9.37", "ngx-chips": "^1.5.3", "ngx-order-pipe": "^1.0.2", "ngx-pagination": "^3.0.1", "ngx-timeline": "^1.0.0", "ngx-tooltip": "0.0.9", "rxjs": "^5.4.3", "zone.js": "^0.8.17" }, "devDependencies": { "@angular/cli": "^1.3.2", "@angular/compiler-cli": "^4.3.6", "@angular/language-service": "^4.3.6", "@types/googlemaps": "^3.26.20", "@types/jquery": "^3.2.12", "@types/moment": "^2.13.0", "typescript": "~2.3.3" } }

this service: `import { Injectable } from "@angular/core"; import { InMemoryDbService } from 'angular-in-memory-web-api';

@Injectable() export class InMemHeroService implements InMemoryDbService { createDb() { let heroes = [ {id: 1, name: 'Windstorm'}, {id: 2, name: 'Bombasto'}, {id: 3, name: 'Magneta'}, {id: 4, name: 'Tornado'} ]; return {heroes}; } }`

App module `import { BrowserModule } from '@angular/platform-browser'; import { BrowserAnimationsModule } from "@angular/platform-browser/animations"; import { NgModule } from '@angular/core'; import { FormsModule } from "@angular/forms"; import { NgxPaginationModule } from "ngx-pagination"; import { HTTP_INTERCEPTORS, HttpClient, HttpClientModule } from "@angular/common/http"; import { TranslateLoader, TranslateModule } from '@ngx-translate/core'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; import { MomentModule } from 'angular2-moment'; import { HttpClientInMemoryWebApiModule } from "angular-in-memory-web-api";

import { AppComponent } from './app.component'; import { AppRoutingModule } from "./app-routing.module"; import { ApiService, AuthInterceptor } from "./shared/service"; import { apiServiceFactory, httpLoaderFactory } from "./shared/factory"; import { NotFoundComponent } from './not-found/not-found.component'; import { ModalService } from "./shared/service"; import { InMemHeroService } from "./shared/service/inMemoryDataService";

@NgModule({ declarations: [ AppComponent, NotFoundComponent, ], imports: [ BrowserModule, BrowserAnimationsModule, NgxPaginationModule, FormsModule, HttpClientModule, HttpClientInMemoryWebApiModule.forRoot(InMemHeroService), AppRoutingModule, TranslateModule.forRoot({ loader: { provide: TranslateLoader, useFactory: httpLoaderFactory, deps: [HttpClient] } }), MomentModule, NgbModule, ], providers: [ { provide: ApiService, useFactory: apiServiceFactory, deps: [HttpClient] }, { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true, }, ModalService ], bootstrap: [AppComponent] }) export class AppModule { } `

tavoli commented 6 years ago

it was the translate service I'm using, it does not work with this package since it needs HttpClient and it seems to me that this package changes the provider.

inv-senchuthomas commented 6 years ago

@gustalimame can you explain detail how you are fixed this issue. I am facing the same issue when I used the ngx-translate in my angular5 app

Davilink commented 6 years ago

@gustalimame Use the passThruUnknowUrl

image

Otherwise, you can check example : https://github.com/angular/in-memory-web-api/tree/master/src/app

Walcure commented 6 years ago

I approve @Davilink solution and wanted to share it also. Found it yesterday