问题标签 [ng-packagr]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
973 浏览

angular - 在 Angular 库中使用带有 Ng-Packagr 的全局变量

鉴于我们试图在使用 ng-packagr 构建的 Angular 项目中引用 Lodash,我们收到以下错误:

错误 TS2686:“_”指的是一个 UMD 全局,但当前文件是一个模块。考虑改为添加导入。

这向我表明它没有正确选择我们设置的打字稿定义文件。

该错误仅在使用 ng-packagr 构建时发生。使用 ng-serve 测试演示应用程序时,它工作正常。

打字.d.ts

我在 ng-packagr 的 github 页面上看到了各种关于使用外部或嵌入式的问题,但文档非常稀少,并且该领域的实验没有为我提供任何线索。

我已经看到这个片段弹出了几次,它似乎准确地引用了正确的路径。

ng-package.json

有人知道我如何调试和调查这个吗?

0 投票
5 回答
11355 浏览

angular - 你如何调试 Angular 6 库

我正在编写一个 Angular 6 库,但无法弄清楚如何进入打字稿。

我使用以下方法生成了应用程序:ng new mylibapp

然后我使用以下方法添加了库:ng g library @abc/cool-lib -p abc

当我执行时:ng build @abc/cool-lib

mylibapp/dist/abc/cool-lib它在文件夹中生成代码

我现在如何调试此代码并在位于的 ts 文件中设置断点mylibapp/projects/abc/cool-lib/src/lib

0 投票
1 回答
1807 浏览

angular - 使用 ng-packagr 它无法识别我的 tsconfig 路径

将 ng-packagr 用于我的 Angular 6 和 AngularCLI 应用程序,它无法识别我的 tsconfig 路径,因为我进行了构建。正常的 ng build --aot --prod 工作正常。

这些是我的路径:

我的 tsconfig.json:

我得到的错误往往是找不到模块....例如因为它不知道@app 是什么。

该应用程序在提供例如 npm start 时也可以正常工作。

0 投票
3 回答
7219 浏览

angular - angular-cli 库创建辅助入口点

我正在尝试在我的 angular npm 包中创建我认为称为辅助入口点的东西。我想要以下两个入口点

使用angular-cli生成基础包生成如下结构

根据 ng-packagr文档,您可以在名为 models 的数据服务下添加一个文件夹,然后在该文件夹中添加一个package.json文件夹,但 ng-packagr 似乎使用与 angular-cli 略有不同的结构。理想情况下,我正在尝试对类似于https://github.com/angular/angular/tree/master/packages/common的结构进行建模,但只要公众公开@scope/data-service@scope/data-service/models我就会很高兴。

当我尝试创建类似于 ng-packager 推荐的结构时,我得到

error TS6059: File 'C:/projects/data-service-app/projects/scope/data-service/models/src/index.ts' is not under 'rootDir' 'C:\projects\data-service-app\projects\scope\data-service\src'. 'rootDir' is expected to contain all source files.

当我将模型目录移动到data-service\src目录中时,我的入口点是

如何摆脱辅助入口点上的 src?

使用 angular-cli 时创建具有辅助入口点的库的正确方法是什么?

0 投票
2 回答
6671 浏览

angular - Angular6.x 库未公开 public_api.ts 中的所有成员

将我的项目更新到最新版本的 Angular (6.0.4) 后,我想最终将我的代码分离到不同的库中。

设置如下:

  1. CMS - 应用程序
  2. 客户端 - 应用程序
  3. 核心 - 两个应用程序共享成员的库

我创建了 3 个空项目并开始将所有组件和服务移动到正确的文件夹中。在最终完成所有这些编辑并删除 TS 错误之后,我的构建仍然失败。我的 CMS 应用程序似乎找不到我的库中定义的任何模块、组件或服务。我的图书馆正在正确构建,并且似乎包含所有这些元素。

我的库包含一个 public_api.ts 看起来它工作正常但生成的 core.ts 文件不包含所有导出的成员。例如,位于public_api.d.ts第二行的wd-core.module

真正的问题:我在图书馆中做错了什么,并非所有成员都被导出?

完整的 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

0 投票
0 回答
467 浏览

angular6 - 当组件在 Angular 应用程序内部使用并作为 Angular 之外的自定义元素时出现 Angular 元素错误

我正在尝试转换我的角度组件,以便它可以在角度和非角度环境中运行。

我已将我的元素添加为导出并将它们添加到自定义元素列表和条目组件列表中,以便它们将作为自定义元素导出。

下面是我的angular-liberary模块导出的代码

然后在 app 模块中作为 forRoot() 导入。

当我从如下所示安装的 npm 导入时,它给了我以下错误

当我直接将它们作为内部模块导入如下时,会出现以下错误。

仍在调试,任何帮助将不胜感激。

0 投票
0 回答
911 浏览

javascript - 构建时出现角度错误,因为外部库 - 意外值“BannerModule ...”

我创建了一个库,以便使用 ng-packagr 模块在两个不同的项目之间共享一些组件。

lib的结构是 在此处输入图像描述

在我的图书馆

src/package.json :

src/components/banner/banner.module.ts:

src/index.ts:

在客户端应用程序中

app.module.ts:

一切正常,在本地为应用程序提供服务,但是当我尝试为 prod 构建时,出现以下错误:

错误:由/Users/username/Dev/Work/Essence/app-mobile-network-site/src/app/app.module.ts 中的模块“AppModule”。请添加 @NgModule 注释。

0 投票
0 回答
3534 浏览

angular - Angular 6 - 导入带有子路由的库/npm模块时正确路由

我按照本指南构建了一个 Angular 6 库模块,并在我的库中运行了一个虚拟应用程序,因此我可以在开发过程中导入和测试模块。

我从图书馆导入的图书馆模块有子路线。我认为这是这个问题的根本原因。双关语意。库模块的路由模块如下所示:

在我的虚拟应用程序中,我有一个由 App Routing 模块延迟加载的 Modules 模块:

Modules 模块文件是我导入库模块的地方,如下所示:

当导航到 localhost:4200/modules 时,即使 modules.component.html 文件没有库模块的组件选择器,库模块也会被实例化。我的 modules.component.html 文件中的所有其他内容也不会出现。我认为这是因为 Library Module 的根路径是 ' ' ?当我传入函数以监视 eventEmitter 时,我需要包含组件选择器。选择器如下所示:

我想在我的虚拟应用程序中导航到 localhost:4200/modules 显示库模块并在虚拟应用程序的模块组件中捕获事件发射器。

0 投票
1 回答
12131 浏览

npm - 错误:运行 ng-packagr 时找不到模块“@angular/compiler-cli/src/perform_compile”

我有一个新安装的 Windows,我第一次尝试运行 ng-packagr。

我收到错误:

我确实通过运行安装了角度 CLI

它正在运行 v6.0.8

我的 ng-package.json:

我在这里想念什么?

0 投票
1 回答
410 浏览

angular - 如何使用辅助端点为 Angular 库创建 API

设想:

ng-packagr我使用导出的自定义components和一些模型类创建了一个自定义 UI 库。

问题:

在主项目中,import语句适用于导出的组件,但它不适用于导出的类并且webpack无法编译给出错误:

找不到模块错误无法解决my-custom-library/models

图书馆项目代码:

模型类:src/app/modules/my-custom-module/models/my-model.ts

索引文件:src/app/modules/my-custom-module/models/index.ts

根目录下的导出文件:models.ts

ng-packagr根目录下的文件:public_api.ts

主要项目代码:

目的: 为终端开发者简化和划分 UI 库 API。

我相信,我错过了一些关于映射webpack模块解析的内容,因为 VS Code 可以识别import、intellisense 工作,甚至Ctrl + Click导航到正确的文件,但webpack编译失败。

Git问题