Using css-loader in 'main'

[bmitchenko]

Is there a reason why component styles and other styles in 'main' are not processed by css-loader?

Let's say I have component with ~15 icons. These are small in size and I want them to be encoded in BASE64. The only way to do it now is to move some component's css rules including 'background[-url]' to styles.scss. But it doesn't help me to make this component reusabe in future (I want to move some components to standalone npm package).

[indywill]

I'm new also, but I think what you want to do is add the stylesheet you want loaded to app.styles array in angular-cli.json in the project root. Note that the path is relative to the app root, so for instance, use "../node_modules/font-awesome/css/font-awesome.min.css",
if you want to add font-awesom from your node modules.

Hope this helps.

[filipesilva]

This would be useful, yes.

Relevant to this is #3511, where we actually had css-loader for component styles but removed it to fix an issue.

Maybe we can look at re-adding it.

[filipesilva]

Superseded by #4285

[asnowwolf]

@filipesilva I vote to css-loader too.
But if only add css-loader, the sourcemap of the component style will be lose, I submitted two PRs about this issue: #4491 and angular/angular#14175

[filipesilva]

@asnowwolf your PR as is won't fix sourcemaps since your fix in angular/angular is not in. Can you resubmit your PR here after angular/angular#14175 is accepted?

[asnowwolf]

Ok, I will resubmit it after that. I've verified it with my patched version.

[filipesilva]

I trust it works in your patched version, mind you. It's just that it might be merged in a different form (or not merged at all) and until then, the code in the CLI would not be verifiable.

[asnowwolf]

Yes, I understand. It's a really good rule. 2017-02-13 23:31 GMT+08:00 Filipe Silva <[email protected]>:

…

I trust it works in your patched version, mind you. It's just that it might be merged in a different form (or not merged at all) and until then, the code in the CLI would not be verifiable. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#3617 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABYQ5_VAVX4bIgmnMq32rsyluWdjtQu0ks5rcHdWgaJpZM4LQHuz> .

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}