使用您的 angular 图书馆运送资产
Ship assets with your angular library
我 building an angular components library,使用 NX 工作区。
ATM 我正在实施一个文件上传器。此上传器将包含一张图片 (svg),该图片应包含在 library/package.
中
我在 Internet 上找到的所有解决方案都要求库的使用者更新他们的 angular.json
应用程序部分。对我来说,这是绝对不行的。这是我找到的一些解释此问题的资源:
我已经通过添加 assets
字段修改了我的 ng-package.json:
{
"$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
"dest": "../../dist/libs/example-ng-bootstrap",
"assets": ["./assets"],
"lib": {
"entryFile": "src/index.ts"
}
}
尝试添加
"targets:build:options:assets": [
"libs/example-ng-bootstrap/src/assets"
]
到 lib angular.json 部分(project.json - NX angular.json V2 样式),根本无法构建。
尝试遵循 ng-package.json 配置:
{
"$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
"dest": "../../dist/libs/example-ng-bootstrap",
"assets": ["/dist/libs/example-ng-bootstrap/lib/assets"],
"lib": {
"entryFile": "src/index.ts"
}
}
从包含的 links 开始,它确实解释了如何构建一个 NX 原理图来为您执行此操作,但是任何构建应用程序(angular 工作区样式)的人都会使用它库可能无法使用此原理图。
其他人(在 github link 中)也提到某些解决方案仅适用于同一 NX 工作区内的应用程序,当然这对任何人都没有帮助。
我很困惑为什么图书馆提供的资产不能开箱即用,或者不修改消费应用程序。您也可以通过 U 盘传送它们……不过,我可以提供 angular 原理图。
另外,我宁愿通过css来设计图标,也不愿消费者自己更新文件,但我还是想知道是否有好的解决方案。
有没有人有专业的处理方法?
编辑
似乎很难找到有关如何使用 NX 构建和发布 angular 原理图的信息,但是 this seems to be a useful link
这是我的决赛ng-package.json
:
{
"$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
"dest": "../../dist/libs/mycompany-ng-bootstrap",
"lib": {
"entryFile": "src/index.ts"
},
"assets": [
"./src/assets/**",
"./src/styles/**",
"./_bootstrap.scss"
]
}
发布 dist 文件后,例如发布到 NPM,我可以引用 angular.json
中的资产
"styles": [
"node_modules/@mintplayer/ng-bootstrap/_bootstrap.scss",
"src/styles.scss"
],
我 building an angular components library,使用 NX 工作区。 ATM 我正在实施一个文件上传器。此上传器将包含一张图片 (svg),该图片应包含在 library/package.
中我在 Internet 上找到的所有解决方案都要求库的使用者更新他们的 angular.json
应用程序部分。对我来说,这是绝对不行的。这是我找到的一些解释此问题的资源:
我已经通过添加 assets
字段修改了我的 ng-package.json:
{
"$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
"dest": "../../dist/libs/example-ng-bootstrap",
"assets": ["./assets"],
"lib": {
"entryFile": "src/index.ts"
}
}
尝试添加
"targets:build:options:assets": [
"libs/example-ng-bootstrap/src/assets"
]
到 lib angular.json 部分(project.json - NX angular.json V2 样式),根本无法构建。
尝试遵循 ng-package.json 配置:
{
"$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
"dest": "../../dist/libs/example-ng-bootstrap",
"assets": ["/dist/libs/example-ng-bootstrap/lib/assets"],
"lib": {
"entryFile": "src/index.ts"
}
}
从包含的 links 开始,它确实解释了如何构建一个 NX 原理图来为您执行此操作,但是任何构建应用程序(angular 工作区样式)的人都会使用它库可能无法使用此原理图。
其他人(在 github link 中)也提到某些解决方案仅适用于同一 NX 工作区内的应用程序,当然这对任何人都没有帮助。
我很困惑为什么图书馆提供的资产不能开箱即用,或者不修改消费应用程序。您也可以通过 U 盘传送它们……不过,我可以提供 angular 原理图。
另外,我宁愿通过css来设计图标,也不愿消费者自己更新文件,但我还是想知道是否有好的解决方案。
有没有人有专业的处理方法?
编辑
似乎很难找到有关如何使用 NX 构建和发布 angular 原理图的信息,但是 this seems to be a useful link
这是我的决赛ng-package.json
:
{
"$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
"dest": "../../dist/libs/mycompany-ng-bootstrap",
"lib": {
"entryFile": "src/index.ts"
},
"assets": [
"./src/assets/**",
"./src/styles/**",
"./_bootstrap.scss"
]
}
发布 dist 文件后,例如发布到 NPM,我可以引用 angular.json
"styles": [
"node_modules/@mintplayer/ng-bootstrap/_bootstrap.scss",
"src/styles.scss"
],