使用 ng2-pdf-viewer 时 ng-serve 出错

Posted 2023-02-19

【中文标题】使用 ng2-pdf-viewer 时 ng-serve 出错

【英文标题】：Error with ng-serve while using ng2-pdf-viewer

【发布时间】：2019-12-19 01:54:30

【问题描述】：

我想在单独的选项卡中的 Angular 应用程序中显示 PDF，使用 ng2-pdf-viewer。

已安装 npm install ng2-pdf-viewer --save

在 ng-serve 上出现错误

错误 C:/Users/Kusha/TCSTDM/node_modules/ng2-pdf-viewer/fesm5/ng2-pdf-viewer.js 未找到模块：错误：无法解析“C:\Users\Kusha\TCSTDM\node_modules\ng2-pdf-viewer\fesm5”中的“@angular/core” C:/Users/Kusha/TCSTDM/node_modules/pdfjs-dist/build/pdf.js 中的错误 未找到模块：错误：无法解析“C:\Users\Kusha\TCSTDM\node_modules\pdfjs-dist\build”中的“url” i ｢wdm｣：编译失败。 ../../../node_modules/ng2-pdf-viewer/src/app/pdf-viewer/pdf-viewer.component.d.ts(4,105) 中的错误： 错误 TS2307：找不到模块“@angular/core”。

app.module.ts

import  PdfViewerModule  from 'ng2-pdf-viewer';

component.ts 文件

import  Component, OnInit  from '@angular/core';



@Component(
  selector: 'app-pdfguideview',
  templateUrl: './pdfguideview.component.html',
  styleUrls: ['./pdfguideview.component.css']
)
export class PdfguideviewComponent implements OnInit 

  constructor()  

  ngOnInit() 
  

html文件

<ng2-pdfjs-viewer [src]="'assets/W2_2018.pdf'" 
[page]="1" 
[original-size]="true" 
style="display: block;">
</ng2-pdfjs-viewer>

【问题讨论】：

ng2-pdf-viewer 和 ng2-pdfjs-viewer 是两个不同的包。 :0

【参考方案1】：

您使用的是哪个版本的 angular 和 pdf-viewer？ 这对我有用： <pdf-viewer [src]="'assets/pdf-test.pdf'" [render-text]="true" style="display: block;"></pdf-viewer>

【讨论】：

ng2-pdf-viewer 5.3.3 版本，节点模块或 angular.json 是否需要任何更改？

不，我只注意到你使用了选择器 而在他们的实现中它说它应该是