角生产构建错误找不到模块

时间:2020-05-18 14:09:45

标签: angular angular-library

我在构建带有使用npm install添加了外部库的生产角度应用程序时遇到问题。所以我的package.json有这个

    {
      "name": "control-panel",
      "version": "0.0.0",
      "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e"
      },
      "private": true,
      "dependencies": {
        "@angular/animations": "~7.2.0",
        "@angular/cdk": "^7.3.7",
        "@angular/common": "~7.2.0",
        "@angular/compiler": "~7.2.0",
        "@angular/core": "^7.2.16",
        "@angular/flex-layout": "^7.0.0-beta.24",
        "@angular/forms": "~7.2.0",
        "@angular/material": "^7.3.7",
        "@angular/platform-browser": "~7.2.0",
        "@angular/platform-browser-dynamic": "~7.2.0",
        "@angular/router": "~7.2.0",
        "babel-preset-es2015": "^6.24.1",
        "babel-preset-stage-2": "^6.24.1",
        "babel-register": "^6.26.0",
        "bootstrap": "^4.4.1",
        "core-js": "^2.5.4",
        "cors": "^2.8.5",
        "font-awesome": "^4.7.0",
        "hammerjs": "^2.0.8",
        "my-lib": "git+ssh://git@my-company.com:sherlock/componentlibrary.git",
        "moment": "^2.24.0",
        "ng2-file-upload": "^1.4.0",
        "ra-icons": "git+ssh://git@my-company.com:analytics/ra-icons.git",
        "rxjs": "^6.3.3",
        "rxjs-compat": "^6.3.3",
        "tslib": "^1.9.0",
        "zone.js": "~0.8.26"
      },
      "devDependencies": {
        "@angular-devkit/build-angular": "^0.12.4",
        "@angular/cli": "~7.2.3",
        "@angular/compiler-cli": "~7.2.0",
        "@angular/language-service": "~7.2.0",
        "@types/jasmine": "~2.8.8",
        "@types/jasminewd2": "~2.0.3",
        "@types/node": "^13.7.1",
        "codelyzer": "~4.5.0",
        "jasmine-core": "~2.99.1",
        "jasmine-spec-reporter": "~4.2.1",
        "karma": "~3.1.1",
        "karma-chrome-launcher": "~2.2.0",
        "karma-coverage-istanbul-reporter": "~2.0.1",
        "karma-jasmine": "~1.1.2",
        "karma-jasmine-html-reporter": "^0.2.2",
        "protractor": "~5.4.0",
        "ts-node": "~7.0.0",
        "tslint": "~5.11.0",
        "typescript": "~3.2.2"
      }
    }

and my app.module.ts imports the modules/components 

    import { NavModule } from 'my-lib/dist/my-lib' 

当我运行ng服务时,角度应用程序将工作,并且外部库组件将显示并正常运行。但是在运行ng build --prod时出现错误

ERROR in ./node_modues/my-lib/dist/my-lib/my-lib.ngfactory.js 
Module not found: Error: Can't resolve 'my-lib' in node_modules/my-lib/dist/my-lib' 
ERROR in ./src/app/app.module.ngfactory.js 

编辑
NavModule.ts


    import { NgModule, ModuleWithProviders } from '@angular/core';
    import { CommonModule } from '@angular/common';
    import { NavComponent } from './nav.component';
    import { NavbarService } from '../../services/navbar.service';
    import { MaterialModule } from '../../../material/material.module';

    @NgModule({
      declarations: [NavComponent],
      imports: [
        CommonModule,
        MaterialModule
      ],
      exports:[
        NavComponent
      ]
    })
    export class NavModule { 
      public static forRoot(environment: any): ModuleWithProviders{
        return {
          ngModule: NavModule,
          providers: [
            NavbarService,
            {
              provide: 'env',
              useValue: environment
            }
          ]
        };
      }
    }

package.json用于外部角度库

    {
      "name": "my-lib",
      "version": "0.0.1",
      "peerDependencies": {
        "@angular/common": "^7.2.0",
        "@angular/core": "^7.2.0"
      },
      "dependencies": {
        "@angular/material": "^7.3.7",
        "bootstrap": "^4.4.1",
        "font-awesome": "^4.7.0",
        "ra-icons": "git+ssh://git@my-company.com:analytics/ra-icons.git"
      }
    }

package.json用于git存储库,这样我就可以npm安装到Angular应用程序中


    {
      "name": "my-lib",
      "version": "0.0.0",
      "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e"
      },
      "private": true,
      "dependencies": {
        "@angular/animations": "~7.2.0",
        "@angular/cdk": "^7.3.7",
        "@angular/common": "~7.2.0",
        "@angular/compiler": "~7.2.0",
        "@angular/core": "~7.2.0",
        "@angular/forms": "~7.2.0",
        "@angular/material": "^7.3.7",
        "@angular/platform-browser": "~7.2.0",
        "@angular/platform-browser-dynamic": "~7.2.0",
        "@angular/router": "~7.2.0",
        "core-js": "^2.5.4",
        "rxjs": "~6.3.3",
        "rxjs-compat": "^6.3.3",
        "tslib": "^1.9.0",
        "zone.js": "~0.8.26"
      },
      "devDependencies": {
        "@angular-devkit/build-angular": "~0.12.0",
        "@angular-devkit/build-ng-packagr": "~0.12.0",
        "@angular/cli": "~7.2.3",
        "@angular/compiler-cli": "~7.2.0",
        "@angular/language-service": "~7.2.0",
        "@types/node": "~8.9.4",
        "@types/jasmine": "~2.8.8",
        "@types/jasminewd2": "~2.0.3",
        "codelyzer": "~4.5.0",
        "jasmine-core": "~2.99.1",
        "jasmine-spec-reporter": "~4.2.1",
        "karma": "~3.1.1",
        "karma-chrome-launcher": "~2.2.0",
        "karma-coverage-istanbul-reporter": "~2.0.1",
        "karma-jasmine": "~1.1.2",
        "karma-jasmine-html-reporter": "^0.2.2",
        "ng-packagr": "^4.2.0",
        "protractor": "~5.4.0",
        "ts-node": "~7.0.0",
        "tsickle": ">=0.34.0",
        "tslib": "^1.9.0",
        "tslint": "~5.11.0",
        "typescript": "~3.2.2"
      }
    }

0 个答案:

没有答案