enable server side rendering

VadimDez · Nov 23, 2017 · c965b9a · c965b9a
1 parent aa0d1eb
commit c965b9a
Show file tree

Hide file tree

Showing 7 changed files with 63 additions and 28 deletions.
diff --git a/build/pdf-viewer/pdf-viewer.component.d.ts b/build/pdf-viewer/pdf-viewer.component.d.ts
@@ -1,7 +1,5 @@
 /// <reference types="pdf" />
 import { ElementRef, EventEmitter, OnChanges, SimpleChanges, OnInit } from '@angular/core';
-import 'pdfjs-dist/web/compatibility';
-import 'pdfjs-dist/web/pdf_viewer';
 export declare class PdfViewerComponent implements OnChanges, OnInit {
     private element;
     static CSS_UNITS: number;

diff --git a/build/pdf-viewer/pdf-viewer.component.js b/build/pdf-viewer/pdf-viewer.component.js
diff --git a/build/pdf-viewer/pdf-viewer.component.js.map b/build/pdf-viewer/pdf-viewer.component.js.map
diff --git a/dist/pdf-viewer.component.d.ts b/dist/pdf-viewer.component.d.ts
@@ -1,7 +1,5 @@
 /// <reference types="pdf" />
 import { ElementRef, EventEmitter, OnChanges, SimpleChanges, OnInit } from '@angular/core';
-import 'pdfjs-dist/web/compatibility';
-import 'pdfjs-dist/web/pdf_viewer';
 export declare class PdfViewerComponent implements OnChanges, OnInit {
     private element;
     static CSS_UNITS: number;

diff --git a/dist/pdf-viewer.component.js b/dist/pdf-viewer.component.js
diff --git a/package.json b/package.json
@@ -16,7 +16,8 @@
     "clean": "gulp clean",
     "compile": "gulp compile",
     "build": "gulp build",
-    "start": "npm run build && concurrently --kill-others \"gulp watch\" \"lite-server\""
+    "start": "npm run build && concurrently --kill-others \"gulp watch\" \"lite-server\"",
+    "copy": "cp -R ./build/pdf-viewer/ ./dist/"
   },
   "repository": {
     "type": "git",

diff --git a/src/pdf-viewer/pdf-viewer.component.ts b/src/pdf-viewer/pdf-viewer.component.ts
@@ -4,12 +4,19 @@
 import {
   Component, Input, Output, ElementRef, EventEmitter, OnChanges, SimpleChanges, OnInit, HostListener
 } from '@angular/core';
-import * as pdfjs from 'pdfjs-dist/build/pdf';
-window['pdfjs-dist/build/pdf'] = pdfjs;
-import 'pdfjs-dist/web/compatibility';
-import 'pdfjs-dist/web/pdf_viewer';
 
-PDFJS.verbosity = (<any>PDFJS).VERBOSITY_LEVELS.errors;
+function isSSR() {
+  return typeof window === 'undefined';
+}
+
+if (!isSSR()) {
+  window['pdfjs-dist/build/pdf'] = require('pdfjs-dist/build/pdf');
+  require('pdfjs-dist/web/compatibility');
+  require('pdfjs-dist/web/pdf_viewer');
+
+  PDFJS.verbosity = (<any>PDFJS).VERBOSITY_LEVELS.errors;
+}
+
 
 @Component({
   selector: 'pdf-viewer',
@@ -289,12 +296,15 @@ export class PdfViewerComponent implements OnChanges, OnInit {
   @Output('on-progress') onProgress = new EventEmitter<PDFProgressData>();
 
   constructor(private element: ElementRef) {
-    PDFJS.workerSrc = `https://cdnjs.cloudflare.com/ajax/libs/pdf.js/${ (PDFJS as any).version }/pdf.worker.min.js`;
+    if (!isSSR()) {
+      PDFJS.workerSrc = `https://cdnjs.cloudflare.com/ajax/libs/pdf.js/${ (PDFJS as any).version }/pdf.worker.min.js`;
+    }
   }
 
-
   ngOnInit() {
-    this.setupViewer();
+    if (!isSSR()) {
+      this.setupViewer();
+    }
   }
 
   @HostListener('window:resize', [])
@@ -313,6 +323,10 @@ export class PdfViewerComponent implements OnChanges, OnInit {
   }
 
   ngOnChanges(changes: SimpleChanges) {
+    if (isSSR()) {
+      return;
+    }
+
     if ('src' in changes) {
       this.loadPDF();
     } else if (this._pdf) {