如何在v13 nx和Angular Monorepo中共享单个样式。CSS文件
我正在将NX / Angular Monorepo升级到NX 13.10。我想知道是否可以将构建的样式重新安置。1234Etc.css
文件文件 dist/styles
,这是我们在较旧版本中所做的。
我们曾经在angular.json
build.options.options
中进行此操作:
"styles": [
{
"input": "./libs/assets/css/styles.scss",
"bundleName": "../../styles/styles"
}
]
... ,而不是dist/[appName]/styles.1234etc.css
。上面显示的样式对象的位置已移至[appName]/project.json
。但是,在Angular的较新版本中,该示例中的Bundlename
路径不再是Bundlename
的有效值。它生成此错误: 不能将资产写入输出路径以外的位置。
因此,我们必须这样做:
"styles": [
{
"input": "./libs/assets/css/styles.scss",
"bundleName": "styles" <--filename, path no longer allowed
}
]
重述,我们现在正在获取此构建输出(dist/
中的样式位置):
nxng-example/
├── apps/
│ ├── qqq/
│
├── libs/
│ ├── assets/
│ ├── styles/styles.css
│
├── dist/
├── apps
├── qqq/
├── styles.12345etc.css <-- move this...
├── index.html, and .js files
...我更喜欢:
nxng-example/
├── apps/
│ ├── qqq/
│
├── libs/
│ ├── assets/
│ ├── styles/styles.css
│
├── dist/
├── apps
│ ├── qqq/
│ ├── index.html, and .js files
│
├── styles.12345etc.css <-- ...to here
这不是至关重要的 - 不要打破 - 我可以忍受它,并且我可以在构建后使用脚本来解决此问题(不过可能只接受新方法),但是我只是想知道是否有一种简单的方法可以拥有dist/ dist/ styles/style.1234etc.css
,我刚刚被忽略了吗?
示例代码,我有一个最小的monorepo,at https://githblitz.com/srbstackblitz/nxng-nxng-example-nxng-example 。谢谢。
I am upgrading an nx / angular monorepo to nx 13.10. I am wondering if it is possible to relocate the built styles.1234etc.css
file to a directory dist/styles
, which is what we had been doing in older versions.
We used to do this in angular.json
build.options
for each app:
"styles": [
{
"input": "./libs/assets/css/styles.scss",
"bundleName": "../../styles/styles"
}
]
... and this would result in dist/styles/styles.1234etc.css
, instead of dist/[appName]/styles.1234etc.css
. The location of styles object shown above is has now moved to [appName]/project.json
. However, in newer versions of Angular, the bundleName
path in that example is no longer a valid value for bundlename
. It generates this error:An asset cannot be written to a location outside of the output path.
So we have to do this instead:
"styles": [
{
"input": "./libs/assets/css/styles.scss",
"bundleName": "styles" <--filename, path no longer allowed
}
]
Restated, we are now getting this build output (note location of styles in dist/
):
nxng-example/
├── apps/
│ ├── qqq/
│
├── libs/
│ ├── assets/
│ ├── styles/styles.css
│
├── dist/
├── apps
├── qqq/
├── styles.12345etc.css <-- move this...
├── index.html, and .js files
... and what I would prefer:
nxng-example/
├── apps/
│ ├── qqq/
│
├── libs/
│ ├── assets/
│ ├── styles/styles.css
│
├── dist/
├── apps
│ ├── qqq/
│ ├── index.html, and .js files
│
├── styles.12345etc.css <-- ...to here
This is not critical - not breaking - and I can live with it, and I could use a script to fix this after the build (probably will just accept the new way, though), but I am just wondering if there is an easy way to have dist/styles/styles.1234etc.css
, that I have just overlooked?
I have a minimal monorepo for example code at https://github.com/srbStackblitz/nxng-example. Thanks.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论