3

Addon has

// app/styles/my-addon.scss within addon
@import 'pods';
.testing123 .my-addon {
  color: white
}

// app/styles/pods.scss within addon
// @import 'some components go here';
.testing123 .pods {
  color: black
}

This works in the addon's dummy app. However when I build it into a real app:

// app/styles/app.scss
@import 'my-addon';

Now my app css contains

.testing123 .my-addon {
  color: white
}
// expect to see .texting123 .pods _but don't_

ember-cli-sass ^7.2.0 and ember-cli-sass-pods ^1.3.0 are both in addon's dependencies.

What am I doing wrong?

Edit 29th August 2018

Removed ember-cli-sass-pods and replaced with ember-component-css. Moved all sass into from app/... to addon/... and now everything is working (but of course I lose the ability to change sass variables in the app). But at least I can release.

bryan.crotaz
  • 97
  • 2
  • 5
  • what version of ember are you using? – NullVoxPopuli Aug 24 '18 at 20:01
  • Is the sass addon a `devDependency` in package.json? Try making it a `dependency` instead. – handlebears Aug 25 '18 at 10:00
  • Did you do all the addon specific steps in the README? Is the import at the very top of your file? (No comments above it) https://github.com/aexmachina/ember-cli-sass/blob/master/README.md – handlebears Aug 25 '18 at 10:05
  • @NullVoxPopuli Ember 3.1.4 – bryan.crotaz Aug 25 '18 at 11:22
  • @handlebears yes it is a dependency (last line of question) – bryan.crotaz Aug 25 '18 at 11:23
  • @handlebears pods import is at the top of the file – bryan.crotaz Aug 25 '18 at 11:25
  • @bryan.crotaz can you confirm your addon is configured this way: https://github.com/aexmachina/ember-cli-sass/blob/master/README.md#usage-within-in-repo-addon-and-in-repo-engine (at the bottom?) – NullVoxPopuli Aug 25 '18 at 12:59
  • @NullVoxPopuli I'm not using Ember Engines - so not sure what you're saying I should have done? – bryan.crotaz Aug 25 '18 at 13:08
  • I guess -- could you provide more specifics about your setup? like, what addon your using? if it's a custom addon, does it expose sass assets like in the above link (in the "in-repo addon" section) – NullVoxPopuli Aug 25 '18 at 16:26
  • addons I'm using: ember-cli-typescript (hopefully irrelevant) ember-cli-sass ember-cli-sass-pods – bryan.crotaz Aug 29 '18 at 09:50
  • @NullVoxPopuli I've made clear in the question that the app is trying to import a sass asset from the addon and this isn't working – bryan.crotaz Aug 29 '18 at 09:50
  • do you have control of the addon? can you change the import pods to import ./pods? I'm still unsure if you control the addon or not and can make these kinds of changes :) But yeah, ember-cli-typescript should be irrelevant for this situation. – NullVoxPopuli Aug 29 '18 at 10:13

1 Answers1

0

This is probably because you have your styles defined in the addon folder and not the app folder.

Move your styles folder inside the addon folder into the app folder and try again.

Your styles will still be available in the addon and in the test dummy app but will not also be exported out to any app using your addon.

Alon Bukai
  • 199
  • 1
  • 1
  • 7