Question

我正在尝试将外部库加载到我的角度应用程序中，这是一个webpack

基于设置。

我已经尝试过这些：

1-yarn add ngx-extended-pdf-viewer

2-导入模块：

 import { NgxExtendedPdfViewerModule } from 'ngx-extended-pdf-viewer';

3-现在通常在angular-cli应用程序中，我应该将这些文件添加到angular.json中：

   "scripts": [
      "node_modules/ngx-extended-pdf-viewer/assets/pdf.js",
      "node_modules/ngx-extended-pdf-viewer/assets/pdf.worker.js",
      "node_modules/ngx-extended-pdf-viewer/assets/viewer.js"
    ]

和

      "assets": [
      {
        "glob": "**/*",
        "input": "node_modules/ngx-extended-pdf-viewer/assets/locale",
        "output": "/assets/locale/"
      }
    ]

但是在我的情况下，这是一个基于webpack的设置，因此没有angular.json结构文件可以做到这一点。

我已经尝试像上面那样将那些文件加载到webpack.common.js中，但是它不起作用：

  new CopyWebpackPlugin([
            { from: './node_modules/ngx-extended-pdf-viewer/assets/pdf.js', to: 'ngx-extended-pdf-viewer/assets/pdf.js' },
            { from: './node_modules/ngx-extended-pdf-viewer/assets/pdf.worker.js', to: 'ngx-extended-pdf-viewer/assets/pdf.worker.js' },
            { from: './node_modules/ngx-extended-pdf-viewer/assets/viewer.js', to: 'ngx-extended-pdf-viewer/assets/viewer.js' },
        ]),

我不知道应该在哪里加载这些文件以使插件正常工作。

如何使用基于Webpack的设置在angular应用程序中加载外部库

0 个答案: