如何为AngularJS组件导入Stylesheets?

时间:2017-04-25 08:49:41

标签: javascript css angularjs webpack

由于某些情况,我被迫将Angular 2 App移至AngularJS。

我的大部分组件都有自己的StyleUrl属性用于特定的样式表。到目前为止在线搜索,我还没有找到一种方法在AngularJS中这样做,除了将Webpack集成到我的项目中,但是我遇到了麻烦。

我想知道是否有另一种方式,如果没有,那么使用Webpack的正确方法是什么?

编辑:2017年5月9日
想要了解我的情况。在对Yeshwanth提供的Dynamic CSS加载模块进行一些测试之后,我发现组件CSS泄漏到外部DOM,这意味着我必须继续搜索另一个解决方案。

最终我辞职使用SCSS方法:在组件模板中,定义一个大的封装div元素,并为它提供某种ID。然后,在.scss文件中,为该ID写入样式块,并在INSIDE中块放置所有组件样式。编译SCSS文件后,生成的css文件将仅对组件的元素起作用。

我不确定这是否完全模仿Angular 2的模拟Shadow Dom,但就我的目的而言,这已经足够了。希望这会有所帮助。

1 个答案:

答案 0 :(得分:2)

我认为在angular 1.x中,您无法导入特定于组件的样式。 但动态css加载可能会派上用场。 请参阅this