Lin*_*der 6 angular ng-packagr
将我的项目更新到最新版本的Angular(6.0.4)后,我想最终将我的代码分成不同的库.
设置如下:
我创建了3个空项目,并开始将所有组件和服务移动到正确的文件夹中.在最终完成所有这些编辑并删除TS错误后,我的构建仍然失败.好像我的CMS应用程序找不到我库中定义的任何模块,组件或服务.我的库正在构建,似乎包含所有这些元素.
ERROR in ./src/app/app.module.ts
Module not found: Error: Can't resolve '**\Webdictaat.Client\dist\core\core' in '**\Webdictaat.Client\projects\cms\src\app'
Run Code Online (Sandbox Code Playgroud)
我的库包含一个public_api.ts,看起来它正常工作但生成的core.ts文件不包含所有导出的成员.例如,wd-core.module位于public_api.d.ts的第二行
真正的问题:我的图书馆出了什么问题,并非所有成员都出口了?
//dist/core/public_api.d.ts
export * from './lib/avatar/avatar.component';
export * from './lib/wd-core.module';
export * from './lib/modal-component/modal-component.component';
export * from './lib/game-elements/game-elements.module';
export * from './lib/core/html-outlet.directive';
export * from './lib/services';
export * from './lib/models';
//dist/core/core.d.ts
//No wd-core.module :(
/**
* Generated bundle index. Do not edit.
*/
export * from './public_api';
export { BaseModalService as ?g } from './lib/core/basemodal.service';
export { GroupByPipe as ?v } from './lib/core/group-by.pipe';
export { ArraySortPipe as ?w } from './lib/core/order-by.pipe';
export { ProcessTokenComponent as ?x } from './lib/core/process-token.component';
export { DirtyGuard as ?k } from './lib/core/security/dirty.guard';
export { wdApi as ?b } from './lib/core/wd.service';
export { WdFilterPipe as ?u } from './lib/core/wdfilter.pipe';
export { DialogComponent as ?s } from './lib/dialog/dialog.component';
export { ModalComponentComponent as ?y } from './lib/modal-component/modal-component.component';
export { NavMenuService as ?m } from './lib/nav-menu/nav-menu.service';
export { AccountService as ?a } from './lib/services/account.service';
export { AchievementService as ?i } from './lib/services/achievement.service';
export { AssignmentService as ?n } from './lib/services/assignment.service';
export { ConfigService as ?d } from './lib/services/config.service';
export { DialogService as ?e } from './lib/services/dialog.service';
export { DictaatService as ?c } from './lib/services/dictaat.service';
export { GoogleAnalyticsEventsService as ?q } from './lib/services/google-analytics.service';
export { ImageService as ?h } from './lib/services/images.service';
export { ParticipantService as ?o } from './lib/services/participantService';
export { PollService as ?r } from './lib/services/poll.service';
export { QuizService as ?f } from './lib/services/quiz.service';
export { RatingService as ?j } from './lib/services/rating.service';
export { StylingService as ?p } from './lib/services/styling.service';
export { VideoService as ?l } from './lib/services/video.service';
export { SpinnerComponent as ?t } from './lib/spinner/spinner.component';
Run Code Online (Sandbox Code Playgroud)
完整的Github项目:
https://github.com/Webdictaat/Webdictaat.Client/tree/update6
图书馆项目
https://github.com/Webdictaat/Webdictaat.Client/tree/update6/projects/core
CMS应用程序项目
https://github.com/Webdictaat/Webdictaat.Client/tree/update6/projects/cms
我发现(由于错误和错误)Angular 6使用ng-packagr打包您的库,但不能正确处理通过其父目录名称引用的名为“ index.ts”的“桶”文件公开的导入。
因此,在您的public_api.ts文件中,例如,
export * from './lib/services';
Run Code Online (Sandbox Code Playgroud)
您需要将其更改为
export * from './lib/services/index';
Run Code Online (Sandbox Code Playgroud)
这很烦人,我希望当Angular CLI结合使用它时,它会得到修复或至少得到了很好的记录,但可惜,事实并非如此。
对于我来说,实际上还不清楚是ng-packagr问题还是Angular问题(可能是ngc),但是https://github.com/dherges/ng-packagr/issues/195上存在一个问题,描述了什么继续,并且链接到一些Angular问题,以及对Angular进行部分修复的请求。
换句话说,它很复杂。
同时,我发现仅直接引用index.ts文件即可使其工作。
您需要做的是将库外部需要的所有内容放入文件中,public_api.ts就像第一个答案所建议的那样。这是此文件的目的,需要完成此操作,以便您可以正确使用该库。此外,index.ts 文件的问题是真实存在的,因此如果更改后仍然遇到问题,只需将所有内容导出到 .ts 文件中public_api.ts。然后,您可以从“核心”而不是“核心/核心”甚至更长的路径进行导入,就像您现在在代码中所做的那样。例如在你的dictaat.module.ts它应该看起来像这样:
import { WdCoreModule, DictaatService } from 'core';
Run Code Online (Sandbox Code Playgroud)
如果它不能像这样工作,则意味着文件中缺少导出public_api.ts。
| 归档时间: |
|
| 查看次数: |
3526 次 |
| 最近记录: |