angular / universal

Server-side rendering and Prerendering for Angular
MIT License
4.04k stars 484 forks source link

Angular Universal SSR + Serverless Framework ReferenceError: Event is not defined when Trigger the URL #1665

Closed Arunaliyanaarachchi closed 4 years ago

Arunaliyanaarachchi commented 4 years ago

I'm Trying to add SSR for my angular application and after days i was able to finally Build it right.

Build Command : npm run build:ssr

Out Put :

 Generating ES5 bundles for differential loading...
ES5 bundle generation complete.
 chunk {3} polyfills-es2015.458aac6b11c541194b4a.js (polyfills) 58.5 kB [initial] [rendered]
    chunk {4} polyfills-es5.44c9dea30eed52ba4506.js (polyfills-es5) 150 kB [initial] [rendered]
    chunk {2} main-es2015.3ba2902bcbc10c1675ba.js (main) 3.36 MB [initial] [rendered]
    chunk {2} main-es5.3ba2902bcbc10c1675ba.js (main) 3.58 MB [initial] [rendered]
    chunk {6} 6-es2015.53bbc3626530cc9d62a6.js () 875 kB  [rendered]
    chunk {6} 6-es5.53bbc3626530cc9d62a6.js () 875 kB  [rendered]
    chunk {0} runtime-es2015.a4937581a2ac14eb4b95.js (runtime) 2.31 kB [entry] [rendered]
    chunk {0} runtime-es5.a4937581a2ac14eb4b95.js (runtime) 2.31 kB [entry] [rendered]
    chunk {1} 1-es2015.1db2b7e193a26ab34e26.js () 14.8 kB  [rendered]
    chunk {1} 1-es5.1db2b7e193a26ab34e26.js () 19.3 kB  [rendered]
    chunk {7} 7-es2015.49a93052cb35da6a7127.js () 92 bytes  [rendered]
    chunk {7} 7-es5.49a93052cb35da6a7127.js () 92 bytes  [rendered]
    chunk {8} 8-es2015.f442eec7404ae5a74fa8.js () 2.87 kB  [rendered]
    chunk {8} 8-es5.f442eec7404ae5a74fa8.js () 2.87 kB  [rendered]
    chunk {5} styles.dd45993893183a374073.css (styles) 260 kB [initial] [rendered]
    Date: 2020-05-05T23:11:30.255Z - Hash: 237a75faa10dbd147775 - Time: 74145ms
    Hash: b0b68963644c131250a2
    Time: 42240ms
    Built at: 05/05/2020 7:12:16 PM
                                                 Asset       Size  Chunks                    Chunk Names
                         highlight-js-lib-highlight.js  219 bytes       1  [emitted]         highlight-js-lib-highlight
                        highlightjs-line-numbers-js.js   9.92 KiB       2  [emitted]         highlightjs-line-numbers-js
                                               main.js   19.5 MiB       3  [emitted]  [big]  main
                               vendors~highlight-js.js   1.07 MiB       4  [emitted]  [big]  vendors~highlight-js
    vendors~highlight-js~highlight-js-lib-highlight.js   45.4 KiB       0  [emitted]         vendors~highlight-js~highlight-js-lib-highlight
    Entrypoint main [big] = main.js
    chunk    {0} vendors~highlight-js~highlight-js-lib-highlight.js (vendors~highlight-js~highlight-js-lib-highlight) 45.3 KiB <{3}> ={1}= ={4}= [rendered] split chunk (cache group: vendors) (name: vendors~highlight-js~highlight-js-lib-highlight)
    chunk    {1} highlight-js-lib-highlight.js (highlight-js-lib-highlight) 83 bytes <{3}> ={0}= [rendered]
    chunk    {2} highlightjs-line-numbers-js.js (highlightjs-line-numbers-js) 9.81 KiB <{3}> [rendered]
    chunk    {3} main.js (main) 19.1 MiB >{0}< >{1}< >{2}< >{4}< [entry] [rendered]
    chunk    {4} vendors~highlight-js.js (vendors~highlight-js) 1.06 MiB <{3}> ={0}= [rendered] split chunk (cache group: vendors) (name: vendors~highlight-js)

    > ibrainmart@0.0.0 compile:server /Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart
    > webpack --config webpack.server.config.js --progress --colors

    Hash: 3b040255852c8146c5c5
    Version: webpack 4.39.2
    Time: 22584ms
    Built at: 05/05/2020 7:12:49 PM
        Asset      Size  Chunks             Chunk Names
    server.js  26.4 MiB       0  [emitted]  server
    Entrypoint server = server.js
      [0] ./server.ts 1.99 KiB {0} [built]
      [2] external "events" 42 bytes {0} [built]
      [3] external "fs" 42 bytes {0} [built]
      [4] external "timers" 42 bytes {0} [optional] [built]
      [5] external "crypto" 42 bytes {0} [built]
     [13] external "path" 42 bytes {0} [built]
     [36] external "buffer" 42 bytes {0} [built]
     [57] external "stream" 42 bytes {0} [built]
     [62] external "zlib" 42 bytes {0} [built]
     [83] external "url" 42 bytes {0} [built]
     [90] external "http" 42 bytes {0} [built]
    [286] external "child_process" 42 bytes {0} [built]
    [297] external "https" 42 bytes {0} [built]
    [572] external "os" 42 bytes {0} [built]
    [793] ./dist/server/main.js 19.5 MiB {0} [built]
        + 786 hidden modules

    WARNING in ./node_modules/jsdom/lib/jsdom/utils.js 216:21-40
    Critical dependency: the request of a dependency is an expression
     @ ./node_modules/jsdom/lib/jsdom.js
     @ ./node_modules/mock-browser/lib/MockBrowser.js
     @ ./node_modules/mock-browser/index.js
     @ ./server.ts

then I want to test it using serverless offline : npm run serve:ssr

  > serverless offline start

    Serverless: Starting Offline: ENGG/us-east-1.

    Serverless: Routes for api:
    Serverless: ANY /{proxy*}
    Serverless: ANY /
    Serverless: POST /{apiVersion}/functions/ibrainmart-ENGG-api/invocations

    Serverless: Offline [HTTP] listening on http://localhost:3000
    Serverless: Enter "rp" to replay the last request

    Serverless: ANY /ENGG (λ: api)
    Serverless: Error while loading api

* Now the Problem is when i try to invoke URL : http://localhost:3000 I'm Getting Below error*****

 Serverless: ANY /ENGG (λ: api)
    Serverless: Error while loading api
    ReferenceError: Event is not defined
        at /Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:328709:42
        at Module.KL2N (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:328719:2)
        at __webpack_require__ (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:169209:30)
        at Object.V7fC (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:456942:14)
        at __webpack_require__ (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:169209:30)
        at Object.K011 (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:327243:37)
        at __webpack_require__ (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:169209:30)
        at Object.0 (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:174669:18)
        at __webpack_require__ (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:169209:30)
        at /Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:169300:18
        at Object.<anonymous> (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:169303:10)
        at __webpack_require__ (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:21:30)
        at Module.<anonymous> (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:132:91)
        at __webpack_require__ (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:21:30)
        at /Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:85:18
        at Object.<anonymous> (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/dist/server.js:88:10)
        at Module._compile (internal/modules/cjs/loader.js:777:30)
        at Object.Module._extensions..js (internal/modules/cjs/loader.js:788:10)
        at Module.load (internal/modules/cjs/loader.js:643:32)
        at Function.Module._load (internal/modules/cjs/loader.js:556:12)
        at Module.require (internal/modules/cjs/loader.js:683:19)
        at require (internal/modules/cjs/helpers.js:16:16)
        at Object.<anonymous> (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/lambda.js:2:16)
        at Module._compile (internal/modules/cjs/loader.js:777:30)
        at Object.Module._extensions..js (internal/modules/cjs/loader.js:788:10)
        at Module.load (internal/modules/cjs/loader.js:643:32)
        at Function.Module._load (internal/modules/cjs/loader.js:556:12)
        at Module.require (internal/modules/cjs/loader.js:683:19)
        at require (internal/modules/cjs/helpers.js:16:16)
        at Object.createHandler (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/node_modules/serverless-offline/src/functionHelper.js:215:15)
        at handler (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/node_modules/serverless-offline/src/ApiGateway.js:485:40)
        at module.exports.internals.Manager.execute (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/node_modules/@hapi/hapi/lib/toolkit.js:41:33)
        at Object.internals.handler (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/node_modules/@hapi/hapi/lib/handler.js:46:48)
        at exports.execute (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/node_modules/@hapi/hapi/lib/handler.js:31:36)
        at Request._lifecycle (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/node_modules/@hapi/hapi/lib/request.js:312:68)
        at processTicksAndRejections (internal/process/task_queues.js:85:5)
        at Request._execute (/Users/liyanaarachchi/ibrainmart@gmail.com/Serverless Framwork/WebApplication/ibrainmart/node_modules/@hapi/hapi/lib/request.js:221:9)

****. This is My Server.ts File. ****8

    import 'zone.js/dist/zone-node';

    import * as express from 'express';
    import * as compression from 'compression';
    import * as cors from 'cors';
    import * as bodyParser from 'body-parser';
    import { join } from 'path';
    import 'reflect-metadata';
    import { enableProdMode } from '@angular/core';
    const MockBrowser = require('mock-browser').mocks.MockBrowser;
    import { resolve } from 'path';

    const domino = require('domino');
    const win = domino.createWindow('');

    const mock = new MockBrowser();

    global['navigator'] = mock.getNavigator();
    global['window'] = win;
    global['document'] = win.document;
    global['XMLHttpRequest'] = require('xmlhttprequest').XMLHttpRequest;

    // Express server
    export const app = express();

    app.use(compression());
    app.use(cors());
    app.use(bodyParser.json());
    app.use(bodyParser.urlencoded({ extended: true }));
    const DIST_FOLDER = join(process.cwd(), 'dist/browser');

    // * NOTE :: leave this as require() since this file is built Dynamically from webpack
    const {
      AppServerModuleNgFactory,
      LAZY_MODULE_MAP,
      ngExpressEngine,
      provideModuleMap,
    } = require('./dist/server/main');

    // Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
    app.engine('html', (_, options, callback) => {
      const engine = ngExpressEngine({
        bootstrap: AppServerModuleNgFactory,
        providers: [
          provideModuleMap(LAZY_MODULE_MAP),
        ],
      });

      engine(_, options, callback);
    });

    app.set('view engine', 'html');
    app.set('views', DIST_FOLDER);

    // Example Express Rest API endpoints
    // app.get('/api/**', (req, res) => { });
    // Serve static files from /browser
    app.get(
      '*.*',
      express.static(DIST_FOLDER, {
        maxAge: '1y',
      }),
    );

    // All regular routes use the Universal engine
    app.get('*', (req, res) => {
      res.render('index', { req, res }, (err, html) => {
        if (html) {
          if (req.headers.host.indexOf('amazonaws.com') > 0) {
            html = html.replace('<base href="/', '<base href="/dev/');
          }
          res.send(html);
        } else {
          res.send(err);
        }
      });
    });

***************** And this my lambda function **********************
const awsServerlessExpress = require('aws-serverless-express');
const server = require('./dist/server');
const awsServerlessExpressMiddleware = require('aws-serverless-express/middleware');

const binaryMimeTypes = [
  'application/javascript',
  'application/json',
  'application/octet-stream',
  'application/xml',
  'image/jpeg',
  'image/png',
  'image/gif',
  'text/comma-separated-values',
  'text/css',
  'text/html',
  'text/javascript',
  'text/plain',
  'text/text',
  'text/xml',
  'image/x-icon',
  'image/svg+xml',
  'application/x-font-ttf',
  'font/ttf',
  'font/otf',
];

server.app.use(awsServerlessExpressMiddleware.eventContext());

const serverProxy = awsServerlessExpress.createServer(server.app, null, binaryMimeTypes);
module.exports.handler = async (event, context) => {awsServerlessExpress.proxy(serverProxy, event, context);}

Does anyone know how to resolve this issue ..?

 My Package.json
{
  "name": "ibrainmart",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "compile:server": "webpack --config webpack.server.config.js --progress --colors",
    "serve:ssr": "serverless offline start",
    "build:ssr": "npm run build:client-and-server-bundles && npm run compile:server",
    "deploy": "serverless deploy",
    "terminate": "serverless remove",
    "build:client-and-server-bundles": "ng build --prod && ng run ibrainmart:server:production --bundleDependencies all"
  },
  "private": true,
  "dependencies": {
    "@angular/platform-server": "~8.2.13",
    "@nguniversal/express-engine": "^8.2.6",
    "@nguniversal/module-map-ngfactory-loader": "v8.2.6",
    "aws-serverless-express": "^3.3.6",
    "cors": "^2.8.5",
    "express": "^4.15.2",
    "@aws-amplify/auth": "^3.2.6",
    "@agm/core": "^1.1.0",
    "@angular/animations": "^8.1.3",
    "@angular/cdk": "^8.2.3",
    "@angular/common": "~8.1.3",
    "@angular/compiler": "~8.1.3",
    "@angular/core": "~8.1.3",
    "@angular/forms": "~8.1.3",
    "@angular/material": "^8.1.2",
    "@angular/platform-browser": "~8.1.3",
    "@angular/platform-browser-dynamic": "~8.1.3",
    "@angular/router": "~8.1.3",
    "@aws-amplify/ui": "^1.0.23",
    "@elastic/elasticsearch": "^7.6.1",
    "@fortawesome/angular-fontawesome": "^0.5.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.28",
    "@fortawesome/free-brands-svg-icons": "^5.13.0",
    "@fortawesome/free-solid-svg-icons": "^5.13.0",
    "@ng-bootstrap/ng-bootstrap": "^5.1.1",
    "@ng-select/ng-select": "^3.0.7",
    "@ng-toolkit/universal": "^7.1.2",
    "@ngx-share/button": "^7.1.4",
    "@ngx-share/buttons": "^7.1.4",
    "@ngx-share/core": "^7.1.4",
    "angular-animate": "^1.7.8",
    "angular-bootstrap-datetimepicker": "^4.0.2",
    "angular-font-awesome": "^3.1.2",
    "angular-material": "^1.1.19",
    "angular-messages": "^1.7.8",
    "angular-multiple-select": "^1.1.3",
    "angular-popper": "^2.0.1",
    "angular-sortablejs": "^2.7.0",
    "aws-amplify": "^1.1.36",
    "aws-amplify-angular": "^3.0.11",
    "aws-elasticsearch-client": "^2.0.0",
    "aws-sdk": "^2.648.0",
    "bootstrap": "^4.4.1",
    "bootstrap-table": "^1.15.3",
    "bootstrap4-toggle": "^3.5.0",
    "buffer": "^5.5.0",
    "date-fns": "^2.11.0",
    "dropify": "^0.2.2",
    "e": "0.0.4",
    "elasticsearch": "^16.7.1",
    "elasticsearch-browser": "^16.7.1",
    "font-awesome": "^4.7.0",
    "guid-typescript": "^1.0.9",
    "jquery": "^3.4.1",
    "material-design-icons": "^3.0.1",
    "moment": "^2.24.0",
    "ng-pick-datetime": "^7.0.0",
    "ng-sortgrid": "^1.3.3",
    "ng-zorro-antd": "^8.5.2",
    "ngx-bootstrap": "^5.1.1",
    "ngx-float-button": "^1.0.0",
    "ngx-google-places-autocomplete": "^2.0.4",
    "ngx-highlightjs": "^4.0.2",
    "ngx-image-cropper": "^2.1.2",
    "ngx-image-editor": "^1.4.1",
    "ngx-paypal": "^5.0.0",
    "ngx-quill": "^7.3.12",
    "ngx-select-dropdown": "^1.1.0",
    "ngx-sortablejs": "^3.1.3",
    "open-iconic": "^1.1.1",
    "paypal-checkout": "^4.0.308",
    "popper.js": "^1.15.0",
    "quill": "^1.3.7",
    "rxjs": "~6.4.0",
    "sortablejs": "^1.10.0-rc3",
    "tslib": "^1.9.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/architect": "~0.803.20",
    "@angular-devkit/build-angular": "~0.803.20",
    "@angular-devkit/core": "~8.3.20",
    "@angular-devkit/schematics": "~8.3.20",
    "@angular/cli": "^8.3.23",
    "@angular/compiler-cli": "~8.1.3",
    "@angular/language-service": "~8.1.3",
    "@types/googlemaps": "^3.39.1",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/jquery": "^3.3.31",
    "@types/node": "~8.9.4",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "timelite": "^1.0.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.4.3",
    "serverless": "^1.60.5",
    "serverless-apigw-binary": "^0.4.4",
    "serverless-offline": "^5.12.1",
    "ts-loader": "^5.2.0",
    "webpack-cli": "^3.1.0"
  }
}

My App.module.ts

import { AppRoutingModule } from './app-routing.module'; import Amplify,{ Auth } from '@aws-amplify/auth'; import awsconfig from '../aws-exports';

import { BrowserModule } from '@angular/platform-browser'; import { NgModule, Component } from '@angular/core'; import { AppComponent } from './app.component'; import { IbrainmartHeaderComponent } from './ibrainmart-header/ibrainmart-header.component'; import { CreatenewprojectComponent } from './project/createnewproject/createnewproject.component'; import { ProjectheaderComponent } from './project/createnewproject/projectitems/projectheader/projectheader.component'; import { ImageuploadComponent } from './project/createnewproject/projectitems/imageupload/imageupload.component'; import {FormsModule, ReactiveFormsModule} from '@angular/forms'; // import { AngularFontAwesomeModule } from 'angular-font-awesome'; import { Routes, RouterModule} from '@angular/router';

// Angular Material Imports import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import {MatCheckboxModule} from '@angular/material/checkbox'; import { ProjecttitleComponent } from './project/createnewproject/projectitems/projecttitle/projecttitle.component'; import {MatSelectModule} from '@angular/material/select'; import {MatFormFieldModule} from '@angular/material/form-field'; import {MatInputModule} from '@angular/material/input'; import {MatToolbarModule} from '@angular/material/toolbar'; import { ItemimageuploaderComponent } from './project/createnewproject/projectitems/itemimageuploader/itemimageuploader.component'; import { SaleitemComponent } from './project/createnewproject/projectitems/saleitem/saleitem.component'; import {MatCardModule} from '@angular/material/card'; import { DownloadbleitemComponent } from './project/createnewproject/projectitems/downloadbleitem/downloadbleitem.component'; import { NosellingitemComponent } from './project/createnewproject/projectitems/nosellingitem/nosellingitem.component'; import { IbrainmartFooterComponent } from './ibrainmart-footer/ibrainmart-footer.component'; import { StepsComponent } from './project/createnewproject/projectitems/steps/steps.component'; import { ProjectmanagetoolbarComponent } from './project/createnewproject/projectitems/projectmanagetoolbar/projectmanagetoolbar.component'; import {MatTabsModule} from '@angular/material/tabs'; import {MatExpansionModule} from '@angular/material/expansion'; import { SelectDropDownModule } from 'ngx-select-dropdown' import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; import { NgSelectModule } from '@ng-select/ng-select'; import {MatIconModule} from '@angular/material/icon'; import { OwlDateTimeModule, OwlNativeDateTimeModule } from 'ng-pick-datetime'; import { MatProgressBarModule } from '@angular/material/progress-bar'; import {DragDropModule} from '@angular/cdk/drag-drop'; import {MatSidenavModule} from '@angular/material/sidenav'; import {MatDialogModule} from '@angular/material/dialog'; import {MatButtonModule} from '@angular/material/button'; import {MatSnackBarModule} from '@angular/material/snack-bar'; import {MatButtonToggleModule} from '@angular/material/button-toggle'; import {MatTableModule} from '@angular/material/table';

// Services

import { HomepageComponent } from './homepage/homepage.component'; import { LocationService } from './common/services/globalvariables.service'; import { ProfileComponent } from './profile/profile.component'; import { ProfilemanagerComponent } from './profile/profilemanager/profilemanager.component'; import { AccountsettingsComponent } from './profile/profilemanager/accountsettings/accountsettings.component'; import { ManageaddressComponent } from './profile/profilemanager/manageaddress/manageaddress.component'; import { PaymentmethodsComponent } from './profile/profilemanager/paymentmethods/paymentmethods.component'; import { NotificationsComponent } from './profile/profilemanager/notifications/notifications.component';

// AWS

import { SignupComponent } from './signup/signup.component';

import { HttpClientModule } from '@angular/common/http'; import { AccordionModule } from 'ngx-bootstrap/accordion'; import { AlertModule } from 'ngx-bootstrap/alert'; import { ButtonsModule } from 'ngx-bootstrap/buttons'; import { CarouselModule } from 'ngx-bootstrap/carousel'; import { CollapseModule } from 'ngx-bootstrap/collapse'; import { BsDropdownModule } from 'ngx-bootstrap/dropdown'; import { ModalModule } from 'ngx-bootstrap/modal'; import { PaginationModule } from 'ngx-bootstrap/pagination'; import { PopoverModule } from 'ngx-bootstrap/popover'; import { ProgressbarModule } from 'ngx-bootstrap/progressbar'; import { RatingModule } from 'ngx-bootstrap/rating'; import { SortableModule } from 'ngx-bootstrap/sortable'; import { TabsModule } from 'ngx-bootstrap/tabs'; import { TooltipModule } from 'ngx-bootstrap/tooltip'; import { TypeaheadModule } from 'ngx-bootstrap/typeahead'; import {SortablejsModule} from 'ngx-sortablejs'; import { ShippingComponent } from './project/createnewproject/shipping/shipping.component'; import { TestComponent } from './test/test.component'; import { ProjectvideoComponent } from './project/createnewproject/projectitems/projectheader/projectvideo/projectvideo.component'; import { LoadprojectComponent } from './project/createnewproject/loadproject/loadproject.component'; import { PricevariantComponent } from './project/createnewproject/pricevariant/pricevariant.component'; import { UserprojectlistComponent } from './project/userprojectlist/userprojectlist.component'; import { UserprojectitemComponent } from './project/userprojectlist/userprojectitem/userprojectitem.component'; import { DisplayprojectComponent } from './project/displayproject/displayproject.component'; import { ProjectitemComponent } from './project/displayproject/projectitem/projectitem.component'; import { ProjectitemimagesComponent } from './project/displayproject/projectitemimages/projectitemimages.component'; import { ProjectstepsComponent } from './project/displayproject/projectsteps/projectsteps.component'; import { ProjectratingComponent } from './project/displayproject/projectrating/projectrating.component'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import { CreateProjectResolver} from './project/createnewproject/createnewprojectresolver'; import {UserProjectListResolver} from './project/userprojectlist/userprojectlistresolver' import {DisplayprojectResolver} from './project/displayproject/DisplayprojectResolver'; import { GetprojectratingComponent } from './project/displayproject/getprojectrating/getprojectrating.component'; import {ProfileDataResolver} from './profile/profiledataresolver'; import { ShoppingCartComponent } from './checkout/shopping-cart/shopping-cart.component' import { ShoppingCartResolver } from './checkout/shopping-cart/shopping-cart-resolver'; import { PaymentComponent } from './checkout/payment/payment.component'; import { PaymentDetailsResolver } from './checkout/payment/PaymentDetailsResolver'; import { PaypalComponent } from './checkout/payment/paypal/paypal.component'; import { NgxPayPalModule } from 'ngx-paypal'; import { OrderPreviewComponent } from './checkout/order-preview/order-preview.component'; import { OrdersComponent } from './orders/orders.component'; import { OrderHistoryResolver } from './orders/OrderHistoryResolver'; import { ConfirmComponent } from './checkout/paymentconfimation/confirm/confirm.component'; import { ProjectpreviewComponent } from './homepage/projectpreview/projectpreview.component'; import { HomepageResolver } from './homepage/HomepageResolver'; import { ContactusComponent } from './project/createnewproject/projectitems/contactus/contactus.component';

// Google MAP import { AgmCoreModule } from '@agm/core'; import { ServicepriceComponent } from './project/createnewproject/serviceprice/serviceprice.component'; import { BusinesslocationComponent } from './project/displayproject/businesslocation/businesslocation.component';

// import { ImageCropperModule } from 'ngx-image-cropper'; import{ImageCropperModule} from 'src/app/project/createnewproject/projectitems/imageupload/image-cropper/image-cropper.module'

import { QuillModule } from 'ngx-quill' import { NgxFloatButtonModule } from 'ngx-float-button'; import { HighlightModule } from 'ngx-highlightjs'; import { SellerpannelComponent } from './sellerpannel/sellerpannel.component'; import { SellerHubResolver } from './sellerpannel/SellerHubResolver'; import { CasesComponent } from './sellerpannel/cases/cases.component'; import { HistoryComponent } from './sellerpannel/history/history.component'; import { AccountComponent } from './sellerpannel/account/account.component'; import { OrderitemComponent } from './sellerpannel/orderitem/orderitem.component'; import { OrderlistComponent } from './sellerpannel/orderlist/orderlist.component'; import { TimelineComponent } from './timeline/timeline.component'; import { OrderhistoryItemComponent } from './orders/orderhistory-item/orderhistory-item.component'; import { ProjectpublishComponent } from './project/createnewproject/projectpublish/projectpublish.component'; import { PersonalinfoComponent } from './profile/personalinfo/personalinfo.component'; import { PublicprofileComponent } from './profile/publicprofile/publicprofile.component'; import { PublicProfileResolver } from './profile/publicprofile/publicprofileResolver'; import { UserpublicprofileprojectdisplayComponent } from './profile/publicprofile/userpublicprofileprojectdisplay/userpublicprofileprojectdisplay.component'; import { ChatComponent } from './chat/chat.component'; import { ChatgroupHeaderComponent } from './chat/chatgroup-header/chatgroup-header.component'; import { ChatgroupDetailsComponent } from './chat/chatgroup-details/chatgroup-details.component'; import { ChatResolver } from './chat/chatResolver'; import { PaypallinkComponent } from './paypallink/paypallink.component'; import { UserNotLogInComponent } from './user-not-log-in/user-not-log-in.component'; import { LicensagreementComponent } from './licensagreement/licensagreement.component'; import { CookiepolicyComponent } from './cookiepolicy/cookiepolicy.component';

// ng-Zorro-antd import { NzDatePickerModule } from 'ng-zorro-antd/date-picker'; import { NzTimePickerModule } from 'ng-zorro-antd/time-picker'; import { NZ_I18N, en_US } from 'ng-zorro-antd'; import { registerLocaleData } from '@angular/common'; import en from '@angular/common/locales/en'; registerLocaleData(en); import { NzTimelineModule } from 'ng-zorro-antd/timeline'; import { NzPopconfirmModule } from 'ng-zorro-antd/popconfirm'; import { NzDropDownModule } from 'ng-zorro-antd/dropdown'; import { NzButtonModule } from 'ng-zorro-antd/button'; import { NzListModule } from 'ng-zorro-antd/list'; import { ServicecalenderComponent } from './sellerpannel/servicecalender/servicecalender.component'; import { NzCalendarModule } from 'ng-zorro-antd/calendar'; import { NzStatisticModule } from 'ng-zorro-antd/statistic'; import { NzInputNumberModule } from 'ng-zorro-antd/input-number'; import { NzBadgeModule } from 'ng-zorro-antd/badge'; import { NzTagModule } from 'ng-zorro-antd/tag'; import { NzSelectModule } from 'ng-zorro-antd/select'; import { NzRateModule } from 'ng-zorro-antd/rate'; import { NzSwitchModule } from 'ng-zorro-antd/switch'; import { NzAlertModule } from 'ng-zorro-antd/alert'; import { TimelineactionComponent } from './timeline/timelineaction/timelineaction.component'; import { NzUploadModule } from 'ng-zorro-antd/upload'; import { NzToolTipModule } from 'ng-zorro-antd/tooltip'; import { StatusComponent } from './profile/status/status.component'; import { NzProgressModule } from 'ng-zorro-antd/progress'; import { NzInputModule } from 'ng-zorro-antd/input'; import { NzAffixModule } from 'ng-zorro-antd/affix'; import { NzEmptyModule } from 'ng-zorro-antd/empty';

import { ShareButtonsModule } from '@ngx-share/buttons'; import './icons'; import { DepositComponent } from './sellerpannel/deposit/deposit.component'; import { CommentsComponent } from './project/displayproject/comments/comments.component'; import { ReviewComponent } from './project/displayproject/review/review.component'; import { AddressmodalComponent } from './checkout/addressmodal/addressmodal.component';

Amplify.configure(awsconfig);

@NgModule({ declarations: [ AppComponent, IbrainmartHeaderComponent, CreatenewprojectComponent, ProjectheaderComponent, ImageuploadComponent, ProjecttitleComponent, ItemimageuploaderComponent, SaleitemComponent, DownloadbleitemComponent, NosellingitemComponent, IbrainmartFooterComponent, StepsComponent, ProjectmanagetoolbarComponent, HomepageComponent, ProfileComponent, ProfilemanagerComponent, AccountsettingsComponent, ManageaddressComponent, PaymentmethodsComponent, NotificationsComponent, SignupComponent, ShippingComponent, TestComponent, ProjectvideoComponent, LoadprojectComponent, PricevariantComponent, UserprojectlistComponent, UserprojectitemComponent, DisplayprojectComponent, ProjectitemComponent, ProjectitemimagesComponent, ProjectstepsComponent, ProjectratingComponent, GetprojectratingComponent, ShoppingCartComponent, PaymentComponent, PaypalComponent, OrderPreviewComponent, OrdersComponent, ConfirmComponent, ProjectpreviewComponent, ContactusComponent, ServicepriceComponent, BusinesslocationComponent, SellerpannelComponent, CasesComponent, HistoryComponent, AccountComponent, OrderitemComponent, OrderlistComponent, TimelineComponent, OrderhistoryItemComponent, ProjectpublishComponent, PersonalinfoComponent, PublicprofileComponent, UserpublicprofileprojectdisplayComponent, ChatComponent, ChatgroupHeaderComponent, ChatgroupDetailsComponent, PaypallinkComponent, UserNotLogInComponent, LicensagreementComponent, CookiepolicyComponent, ServicecalenderComponent, TimelineactionComponent, StatusComponent, DepositComponent, CommentsComponent, ReviewComponent, AddressmodalComponent ], imports: [ BrowserModule.withServerTransition({ appId: 'serverApp' }), HttpClientModule, AppRoutingModule, MatProgressBarModule, BrowserAnimationsModule, MatCheckboxModule, MatSelectModule, MatFormFieldModule, ReactiveFormsModule, FormsModule, MatInputModule, MatToolbarModule, MatCardModule, // AngularFontAwesomeModule, MatTabsModule, MatExpansionModule,

SelectDropDownModule,
NgbModule,
AccordionModule.forRoot(),
AlertModule.forRoot(),
ButtonsModule.forRoot(),
CarouselModule.forRoot(),
CollapseModule.forRoot(),
BsDropdownModule.forRoot(),
ModalModule.forRoot(),
PaginationModule.forRoot(),
PopoverModule.forRoot(),
ProgressbarModule.forRoot(),
RatingModule.forRoot(),
SortableModule.forRoot(),
TabsModule.forRoot(),
TooltipModule.forRoot(),
TypeaheadModule.forRoot(),
SortablejsModule.forRoot({ animation: 150}),
NgSelectModule,
MatIconModule,
NgxPayPalModule,
OwlDateTimeModule, 
OwlNativeDateTimeModule,
AgmCoreModule.forRoot({
  apiKey: 'AIzaSrertetertewyruyrturyerwJ4vlmSBvSE60',
  libraries: ['geometry','places']
}),
ImageCropperModule,
QuillModule.forRoot({
  modules: {
    toolbar: [
      ['bold', 'italic', 'underline', 'strike'],
      ['blockquote', 'code-block'],
      [{ 'size': ['small', false, 'large', 'huge'] }],
      [{ 'align': [] }],
      [{ 'script': 'sub'}, { 'script': 'super' }],
      [{ 'header': 1 }, { 'header': 2 }],              
      [{ 'list': 'ordered'}, { 'list': 'bullet' }]
  ]
  }
}),
NgxFloatButtonModule,
HighlightModule,
DragDropModule,
MatSidenavModule,
MatDialogModule,
MatButtonModule,
MatSnackBarModule,
MatButtonToggleModule,
NzDatePickerModule,
NzTimePickerModule,
NzTimelineModule,
NzPopconfirmModule,
NzDropDownModule,
NzButtonModule,
NzListModule,
NzCalendarModule,
NzStatisticModule,
NzInputNumberModule,
NzBadgeModule,
NzTagModule,
NzSelectModule,
NzRateModule,
NzSwitchModule,
NzAlertModule,
NzUploadModule,
NzToolTipModule,
NzProgressModule,
MatTableModule,
ShareButtonsModule,
NzInputModule,
NzAffixModule,
NzEmptyModule

], providers: [ LocationService, CreateProjectResolver, UserProjectListResolver , DisplayprojectResolver, ProfileDataResolver, ShoppingCartResolver, PaymentDetailsResolver, OrderHistoryResolver, HomepageResolver, SellerHubResolver, PublicProfileResolver, ChatResolver,

{ provide: NZ_I18N, useValue: en_US },
NzPopconfirmModule

], bootstrap: [AppComponent], entryComponents :[CreatenewprojectComponent,AddressmodalComponent,ProjectratingComponent,TimelineactionComponent ,ReviewComponent,ProjectpublishComponent , UserNotLogInComponent ,LicensagreementComponent , CookiepolicyComponent] }) export class AppModule { }

alan-agius4 commented 4 years ago

Hello, this issue tracker is not the correct forum for support requests. Better options include StackOverflow or Gitter.

angular-automatic-lock-bot[bot] commented 4 years ago

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.