# Compile assets but not concatenate them

**URL:** <https://discuss.emberjs.com/t/compile-assets-but-not-concatenate-them/6154>\
**Category:** Ember CLI\
**Created:** [August 29, 2014, 7:42pm UTC](https://discuss.emberjs.com/t/compile-assets-but-not-concatenate-them/6154 "2014-08-29T19:42:20Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![MarcosMenegazzo](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/marcosmenegazzo/32/9464_2.png) [@MarcosMenegazzo](https://discuss.emberjs.com/u/MarcosMenegazzo)\
**Post date:** [August 29, 2014, 7:42pm UTC](https://discuss.emberjs.com/t/compile-assets-but-not-concatenate-them/6154/1 "2014-08-29T19:42:20Z")

</div>

What is needed to compile some SCSS and minifies it, but not concat in a single vendor.css or application-name.css?

---

<div class="post-metadata">

**Author:** ![MarcosMenegazzo](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/marcosmenegazzo/32/9464_2.png) [@MarcosMenegazzo](https://discuss.emberjs.com/u/MarcosMenegazzo)\
**Post date:** [September 5, 2014, 4:50pm UTC](https://discuss.emberjs.com/t/compile-assets-but-not-concatenate-them/6154/2 "2014-09-05T16:50:27Z")

</div>

This worked:

```javascript
//Brocfile.js
var mergeTrees = require('broccoli-merge-trees');
var compileSass = require('broccoli-sass');

sourceTress = ['app/styles'];
var phoneCss = compileSass(sourceTress, 'phone.scss', 'assets/phone.css');
var tabletCss = compileSass(sourceTress, 'tablet.scss', 'assets/tablet.css');
var pcCss = compileSass(sourceTress, 'pc.scss', 'assets/pc.css');

var emberAppTree = app.toTree();
module.exports = mergeTrees([emberAppTree, phoneCss, tabletCss, pcCss]);

```