Как опубликовать пакет для использования в приложении AoT angular2

У меня есть код, написанный на машинописном языке angular2, это экспортируемый модуль с сервисами и компонентами.

@NgModule({
    declarations:[
        ...DECLARATIONS
    ],
    imports: [
        CommonModule,
        ChartModule
    ],
    exports:[
        ...DECLARATIONS,
        CommonModule,
        ChartModule
    ],
    providers:[
        AlertErrorHandleService
        , AuthenticationModelService
        , AuthConnectionBackend
    ],
    schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})
export class MyModule {
    static forRoot():ModuleWithProviders {
        return {
            ngModule: StmsModule,
            providers: [AlertErrorHandleService
                , AuthenticationModelService
                , AuthConnectionBackend
            ]
        };
    }
}

Я хочу использовать этот MyModule в разных приложениях angular2, поэтому я опубликовал его с этим tsconfig и скриптами.

{
  "compilerOptions": {
    "emitDecoratorMetadata": true,
    "removeComments": true,
    "module": "es2015",
    "target": "es5",
    "moduleResolution": "node",
    "sourceMap": true,
    "declaration": true,
    "noImplicitAny": false,
    "experimentalDecorators": true,
    "lib": ["dom", "es2015"],
    "outDir": "dist",
    "types": [
      "node"
    ]
  },
  "exclude": [
    "node_modules",
    "dist",
    "scripts"
  ],
  "angularCompilerOptions": {
    "genDir": "aot"
  }
}

пакеты.json

"name": "my-lib",
  "version": "0.2.1",
  "description": "Shared lib angular2",
  "main": "index.js",
  "typings": "index.d.ts",
  "scripts": {
    "ngc": "ngc",
    "lint": "tslint src/**/*.ts",
    "copyPackage":"node ./scripts/copy-package",
    "build": "rimraf -rf aot dist && npm run ngc && npm run copyPackage",
    "publishPackage": "npm run build && cd dist && npm publish"
  },
  "keywords": [
    "angular",
    "angular2"
  ],
  "author": "Haddar Macdasi",
  "license": "MIT",
  "dependencies": {
    "@angular/core": "2.1.1",
    "@angular/common": "2.1.1",
    "@angular/compiler": "2.1.1",
    "@angular/compiler-cli": "2.1.1",
    "@angular/http":"2.1.1",
    "@angular/platform-browser": "2.1.1",
    "rxjs": "5.0.0-beta.12",
    "angular2-highcharts": "0.4.1",
    "highcharts": "5.0.2"
  },
  "devDependencies": {
    "@types/chai": "^3.4.34",
    "@types/node": "^6.0.41",
    "typescript": "^2.0.3"
  }

в другом приложении angular2, которое было создано с использованием семени из семя angular2, я установил пакет, пытаясь чтобы использовать все это работает, так как я запускаю приложение не в AOT, а в AoT, оно имеет ошибку

Ошибка: Неожиданное значение «MyModule», импортированное модулем «AboutModule».

У меня есть пара вопросов:

  1. как мне опубликовать пакет/в чем отличия внутри tsconfig "module" = es2015/systemjs/commonjs
  2. Имеет ли тип публикации модуля какое-либо отношение к тому, как пакет можно использовать внутри angular2, то есть, если я использую публикацию systemjs, могу ли я использовать этот пакет в приложении angular2 AoT?
  3. Есть ли какая-либо передовая практика, как опубликовать общий модуль angular2 и использовать его в приложениях diff?

person Haddar Macdasi    schedule 05.12.2016    source источник


Ответы (2)


Я ссылаюсь на незнание фактической проблемы, но узнал сообщение об ошибке из сообщения в блоге, которое я только что читал по другой причине.

Похоже, это связано с необходимостью включения файлов *.metadata.json в ваш пакет npm.

https://medium.com/@isaacplmann/getting-your-angular-2-library-ready-for-aot-90d1347bcad#.p7i6p63e8

person Darran    schedule 29.01.2017

ИМХО, еще очень рано переходить на AoT. Я только что попробовал это в своем проекте. Я думаю, что инструменты для AoT еще не готовы.

Тем не менее, я думаю, что я заставил это работать в моем проекте. Вы можете использовать ту же настройку, чтобы заставить свою работать.

Вот github для ngx-clipboard

Этот проект на самом деле довольно небольшой, но он показывает, как использовать стороннюю библиотеку (чистый javascript) с angular и быть совместимым с AoT.

Есть много вещей, которые могут нарушить сборку AoT.

Webpack, ngTool, угловой, Typescript. Я бы посоветовал вам попробовать использовать те же версии, что и я.

1. Используйте es2015, потому что AoT не требует

https://angular.io/docs/ts/latest/cookbook/aot-compiler.html#!#rollup

  1. Я думаю, это зависит. Но если вы хотите сделать свой пакет совместимым с AoT, я думаю, вам лучше использовать es2015.

  2. Я не нашел ни одного.

    Но я нашел это сообщение < /а> полезно.

person maxisam    schedule 24.12.2016