Cannot use addon/styles/addon.scss

[artsyca]

I've followed the instructions in the README for creating an addon with an included addon.scss file, but no matter what I do, the styles are not getting picked up by vendor.css.

Is there anything more we need to know in order to make this work?

AS an aside: addon.css is definitely getting picked up.

[Axxon]

hi @artsyca i've the same issue, could you please compare my repo https://github.com/Axxon/ember-cli-minimal-tree/tree/front2 if a done a mistake ?

[artsyca]

@Axxon : https://github.com/Axxon/ember-cli-minimal-tree/blob/front2/tests/dummy/app/styles/app.css according to the instructions, this should be app.scss but even so it hasn't worked for me..

[Axxon]

@artsyca I tried like you, without success. (i pushed that).

[dukex]

I had the same issue here

[Axxon]

So, a cool guy could share me a advise to integrate sass into my addon ?

[fpauser]

There seem to be some more issues with ember-cli-sass & ember-cli:
ember-cli/ember-cli#4084
ember-cli/ember-cli#3644
ember-cli/ember-cli#2905 (lists more related issues)

[simonexmachina]

Thanks @fpauser. Yes there definitely do seem to be issues outside the scope of ember-cli-sass here. Unfortunately I've just joined an early stage startup as a tech co-founder, so I simply do not have a second to look into this, sorry. Luckily the source code's available so I'm happy to review and publish any PRs from the community. I'm also open to adding other collaborators on this project as well if anyone is interested.

[artsyca]

Congratulations @aexmachina I wish you all the best.

[fpauser]

As it seems the last working version of ember-cli-sass was v4.0.0-beta.5 (discovered it by looking at ember-paper's package.json).

Something in v4.0.0-beta.6 breaks compatibility with ember-addons:
v4.0.0-beta.5...v4.0.0-beta.6

[fpauser]

Seems like tryFile() @ https://github.com/aexmachina/ember-cli-sass/blob/master/index.js#L21 is problematic. Unsure if this is really an ember-cli problem or if the scss/sass-check should also deal with the inputTrees.

[dukex]

SASSPlugin.prototype.toTree to addon:

> inputPath
'/'
> outputPath
'/'
> tree
'/file/to/my/project-addon/addon/styles'

SASSPlugin.prototype.toTree to dummy app:

> inputPath
'/app/styles'
> outputPath
'/assets'
> tree
{ inputTrees:
   [ { inputTrees: [Object],
       options: [Object],
       description: 'TreeMerger (ExternalTree)' },
     { inputTrees: [Object], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [Object], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [Object], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [Object], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTrees: [], options: [Object] },
     { inputTree: 'tests/dummy/app/styles',
       _includeFileCache: {},
       _destinationPathCache: {},
       _tmpDir: '/file/to/my/project-addon/tmp/funnel-dest_Hjw6n6.tmp',
       srcDir: '/',
       destDir: '/app/styles',
       destPath: '/file/to/my/project-addon/tmp/funnel-dest_Hjw6n6.tmp/app/styles',
       _instantiatedStack: 'Error\n    at new Funnel (/file/to/my/project-addon/node_modules/... (length: 852)' } ],
  options: { description: 'TreeMerger (stylesAndVendor)', overwrite: true },
  description: 'TreeMerger (stylesAndVendor)' }

There is a problem on tryFile when run the addon tree, inputPath is '/'

[simonexmachina]

Thanks for the investigation, you were right that that PR introduced the problem. Root cause is the issue above.

I've added an option in v4.0.1 that allows you to specify the file extension, which bypasses the tryFile lookup. So until the underlying issue is resolved you need to specify this option when using inside an addon.

[justin-lau]

I'm still having issue with v4.0.1 even after having extension set in the addon's Brocfile:

var app = new EmberAddon({
    sassOptions: {
        extension: 'scss',
    },
});

Also followed instructions in the readme for addons usage, but the content of addon/styles/addon.scss is not showing in dist/assets/vendor.css.

Am I missing anything?

[dukex]

@justin-lau the pull-request #57 will fix your problem

[justin-lau]

@dukex I thought the extension option was introduced as a temporary workaround to this issue... With your fixed branch I now understand it was actually meant for the scss files in the dummy app. Thanks!

[timohermans]

Any news on this? I'm actually waiting for the fix, so I'm still on 4.0.0-beta5

[dukex]

@temo44 We are waiting the pull request #57

[simonexmachina]

@temo44 you should be able to work around that issue by specifying the extension option.

[lmcardle]

+1 also having problems getting addon.scss compiling to dist/assets/vendor.css even with specifying:

// ember-cli-build.js
sassOptions: {
    extension: 'scss' // or sass
}

I am currently on 4.2.0

[dukex]

Hi everyone, given #78 was merged, now with 5.0.0 you can use sass on addon.
I think this issue can be closed

[simonexmachina]

Be aware that you now need to specify extension option if you're not using .scss