Angular 6库-引导样式 [英] Angular 6 Library - bootstrap styles

查看:95
本文介绍了Angular 6库-引导样式的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我目前正在尝试创建Angular 6库,并在其他应用程序中使用它们。看来运作良好。我正在追踪: https://medium.com / @ SirMaxxx / angular-6-creating-a-shareable-control-library-6a27f0ebe5c2



我遇到的一个问题是在此类库中添加了依赖项,尤其是引导程序。



我要做的是创建一个组件库,该库与自定义样式和3rd party样式捆绑在一起,但是似乎没有办法?



我希望将对bootstrap的引用添加到与以下类似的angular.json文件中:

 样式:[
src / styles.css
],
scripts:[]

..但是Angular库不包含angular.json文件,这使我相信这样的事情是不可能的/不被支持的/等等。 / p>

帮助?

解决方案

不支持此功能。因为我不得不为一个客户提出解决方案,所以我摆弄了一些。最后,我找到了两个指向正确方向的帖子。 如何包含自定义SCSS主题? Dor3nz中邮。建议通过引入额外的自定义构建步骤来构建全局样式文件并将其复制到dist文件夹,以丰富构建过程。我做了一个小的原型,并且这种方法到目前为止效果很好,至少就我而言。示例可在此处展示该方法。希望对您有帮助...


I'm currently experimenting with creating Angular 6 libraries and consuming them in other applications. It seems to be working well. I am following: https://medium.com/@SirMaxxx/angular-6-creating-a-shareable-control-library-6a27f0ebe5c2

A problem that I am having is adding dependencies to such libraries, in particular with bootstrap.

What I am trying to do is to create a component library, which comes bundled with custom and 3rd party styles, however there does not seem to be a way to do that?

I would expect to add references to bootstrap to angular.json file similar to below:

"styles": [
    "src/styles.css"
],
"scripts": []

..however Angular libraries do not contain angular.json files, which leads me to believe that such a thing is not possible/not supported/etc.

Help?

解决方案

This is not supported "Out of the Box". I fiddled a bit around since I had to come up with a solution for one of my customers. In the end I found two posts pointing in the right direction. How to include a custom SCSS theme? and Medium Post of Dor3nz. The suggestion was to enrich the build process by introducing an extra custom build step for building tho Global Style file and copy it over to the dist folder. I did a small prototype and the approach is working quite good so far, at least in my case. Example could be found here Showcasing the approach. Hope it helps...

这篇关于Angular 6库-引导样式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆