This repository was archived by the owner on Mar 20, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 48
This repository was archived by the owner on Mar 20, 2024. It is now read-only.
Adding Preboot to Angular SSR causes webpack error #112
Copy link
Copy link
Open
Description
When I add preboot to SSR, I get the following error:
bootstrap:84 Uncaught TypeError: Cannot read property 'call' of undefined
at __webpack_require__ (bootstrap:84)
at Module../src/app/app.module.ts (app.module.ts:1)
at __webpack_require__ (bootstrap:84)
at Module../src/main.ts (main.ts:1)
at __webpack_require__ (bootstrap:84)
at Object.0 (main.ts:14)
at __webpack_require__ (bootstrap:84)
at checkDeferredModules (bootstrap:45)
at Array.webpackJsonpCallback [as push] (bootstrap:32)
at main.js:1
__webpack_require__ @ bootstrap:84
./src/app/app.module.ts @ app.module.ts:1
__webpack_require__ @ bootstrap:84
./src/main.ts @ main.ts:1
__webpack_require__ @ bootstrap:84
0 @ main.ts:14
__webpack_require__ @ bootstrap:84
checkDeferredModules @ bootstrap:45
webpackJsonpCallback @ bootstrap:32
(anonymous) @ main.js:1
Here's my app.module:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ErrorHandler, APP_INITIALIZER, PLATFORM_ID } from '@angular/core';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { HttpErrorInterceptor } from './shared/middleware/error.interceptor';
import { AngularFireModule } from '@angular/fire';
import { AngularFirestoreModule } from '@angular/fire/firestore';
import { AngularFireStorageModule } from '@angular/fire/storage';
import { AngularFireFunctionsModule } from '@angular/fire/functions';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HomeComponent } from './pages/home/home.component';
import { SharedModule } from './shared/shared.module';
import { environment } from '../environments/environment';
import { ToastrModule } from 'ngx-toastr';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { GlobalErrorHandler } from '@services/error-handler.service';
import { RouteReuseStrategy } from '@angular/router';
import { CustomReuseStrategy } from './route.strategy';
import { TimeagoModule } from 'ngx-timeago';
import { Ng5SliderModule } from 'ng5-slider';
import { isPlatformBrowser, ɵgetDOM } from '@angular/common';
import { PrebootModule } from 'preboot';
@NgModule({
declarations: [
AppComponent,
HomeComponent
],
imports: [
BrowserModule.withServerTransition({ appId: 'my-app' }),
PrebootModule.withConfig({ appRoot: 'app-root' }),
AppRoutingModule,
HttpClientModule,
AngularFireModule.initializeApp(environment.firebaseConfig),
BrowserAnimationsModule,
AngularFirestoreModule,
AngularFireStorageModule,
AngularFireFunctionsModule,
ToastrModule.forRoot({
timeOut: 3000,
positionClass: 'toast-bottom-right',
preventDuplicates: true,
}),
TimeagoModule.forRoot(),
Ng5SliderModule,
SharedModule,
],
providers: [
{
provide: RouteReuseStrategy,
useClass: CustomReuseStrategy
},
{
provide: HTTP_INTERCEPTORS,
useClass: HttpErrorInterceptor,
multi: true
},
{ provide: ErrorHandler, useClass: GlobalErrorHandler },
],
bootstrap: [AppComponent]
})
export class AppModule { }
package.json:
{
"name": "my-web-app",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"dev:ssr": "ng run my-web-app:serve-ssr",
"serve:ssr": "node dist/my-web-app/server/main.js",
"build:ssr": "ng build --prod && ng run my-web-app:server:production",
"prerender": "ng run my-web-app:prerender"
},
"private": true,
"dependencies": {
"@angular/animations": "^9.1.7",
"@angular/common": "~9.1.7",
"@angular/compiler": "~9.1.7",
"@angular/core": "~9.1.7",
"@angular/fire": "^6.0.0",
"@angular/forms": "~9.1.7",
"@angular/platform-browser": "~9.1.7",
"@angular/platform-browser-dynamic": "~9.1.7",
"@angular/platform-server": "~9.1.7",
"@angular/router": "~9.1.7",
"@grpc/proto-loader": "^0.5.4",
"@nguniversal/express-engine": "^9.1.1",
"@types/googlemaps": "^3.39.3",
"bulma": "^0.8.1",
"express": "^4.15.2",
"firebase": "^7.14.2",
"fsevents": "^2.1.2",
"lodash.throttle": "^4.1.1",
"ng5-slider": "^1.2.4",
"ngx-chips": "^2.1.0",
"ngx-google-places-autocomplete": "^2.0.4",
"ngx-mask": "^9.0.2",
"ngx-timeago": "^1.0.4",
"ngx-toastr": "^12.0.0",
"preboot": "^7.0.0",
"rxjs": "~6.5.4",
"rxjs-compat": "^6.5.5",
"tslib": "^1.10.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/architect": "^0.900.0-0 || ^0.900.0",
"@angular-devkit/build-angular": "~0.901.6",
"@angular/cli": "~9.1.6",
"@angular/compiler-cli": "~9.1.7",
"@angular/language-service": "~9.1.7",
"@nguniversal/builders": "^9.1.1",
"@types/express": "^4.17.0",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"@types/node": "^12.11.1",
"bufferutil": "^4.0.1",
"codelyzer": "^5.1.2",
"domino": "^2.1.4",
"firebase-tools": "^7.12.1",
"fuzzy": "^0.1.3",
"inquirer": "^6.2.2",
"inquirer-autocomplete-prompt": "^1.0.1",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.3.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~2.1.0",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.4.2",
"protractor": "~5.4.3",
"ts-node": "~8.3.0",
"tslint": "~5.18.0",
"typescript": "~3.7.5",
"utf-8-validate": "^5.0.2",
"ws": "^7.2.3",
"xhr2": "^0.2.0"
}
}
Metadata
Metadata
Assignees
Labels
No labels