electron-webpack icon indicating copy to clipboard operation
electron-webpack copied to clipboard

Angular Styles with View Encapsulation

Open parliament718 opened this issue 3 years ago • 0 comments

There is this example of using electron-webpack in Angular https://github.com/kendraio/angular-electron-webpack-example

Just about every example I can find imports styles in a way that breaks view encapsulation of the styles.

The standard Angular way to import styles is through component stylesUrl:

@Component({
    selector: 'app-component',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.scss'],

The way I see it done (and how I've been doing it for lack of a better way), is

import "./app.component.scss";

@Component({
    selector: 'app-component',
    templateUrl: './app.component.html',
    encapsulation: ViewEncapsulation.None
})

I've tried various configurations for loaders to no avail. Does anyone have an example of their webpack.renderer.additions.js that allows Angular styles to be imported the way they were intended?

Note: In addition to component styles at src/renderer/app/components/**/*.scss, I also have some global styles at src/renderer/styles/*.scss

parliament718 avatar Jul 12 '20 12:07 parliament718