4

Due to certain circumstances, I'm forced to move my Angular 2 App to AngularJS.

Most of my Components have their own StyleUrl property for their specific stylesheets. So far searching online, I haven't found a way to do so in AngularJS, except integrating Webpack to my project, however I'm having trouble doing so.

I was wondering if there's another way, and if there isn't, what's the proper way of using Webpack for this?

EDIT: 5/9/2017:
Wanted to give an update on my situation. After some testing on the Dynamic CSS loading module which Yeshwanth provided, I discovered that the component CSS leaked to the outside DOM, which meant I had to keep searching for another solution.

Eventually I resigned to use the SCSS approach: Inside the component template, define one, big, encapsuling div element, and give it an ID of some kind. Then, inside an .scss file, write the style block for that ID and INSIDE that block place all of your component styles. After compiling the SCSS file, the resulting css file will act only on the component's elements.

I'm not sure if this fully emulates the emulated Shadow Dom of Angular 2, but for my purposes it was enough. Hope this helps.

Improve this question
1
  • There's a proper way to webpack. Commented Apr 25, 2017 at 8:54

1 Answer 1

Reset to default
2

I think in angular 1.x you cannot import style specific to your component. But the dynamic css loading might come handy. Please refer this

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Thanks for the link, I'll check it out, hopefully it will work with AngularJS 1.6.3.
Works great! Thanks :)
Welcome @ Chen Leikehmacher

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.