[SOLVED] Sass include and Ionic2 RC.0

How do I include a scss file from another scss in Ionic2 RC.0?

In beta 11, I had a scss with following mixin declaration in it:

@mixin nexus5X() {
  @media (min-width: 412px) and (max-width: 412px) {

which I used to import in app.core.scss, like following:

@import "include/media-queries.scss";

now when I run my app migrated to Ionic2 RC.0 I always have got the error that that mixin isn’t found in my scss files where I use it.

 no mixin named nexus5X

Any clue?

I added custom css to app.component.scss in app folder and it is picked automatically

1 Like

Thx. It turns out my global.scss wasn’t loaded, that’s why I had to add in separate scss the include too.

I fixed the include of global.scss and my include were good again aka I don’t have anymore to specify them in each file.

Futhermore, if you do an include in a specific.scss file, the path to the included should be relative to the source of the scss file you will include.

where did you include import for global.scss?

Two “solutions” (don’t know if it’s the right way to do it but)

  1. In variable.scss add at the end of the file

    @import “global”;

  2. Or, the one I finally use. Create a new scss file app.component.scss next to your app.component.ts file and place your code there. Don’t use global.scss anymore

I had the first hack, but it gets overridden by theme scss, so it was not working well.
The second one seems good though, thank you!