eibrahim commented 8 years ago

I am getting the broken @import errors with the ember-cli-jquery-ui addon after upgrading to ember 2.3.0. The only way I was able to make my build work was to add ember-cli-build.js

    minifyCSS: {
      enabled: false,
    },

But obviously this turns off my CSS minification... Any idea what is going on?

The full error is:

File: assets/vendor.css
Broken @import declaration of "theme.css"
Broken @import declaration of "accordion.css"
Broken @import declaration of "autocomplete.css"
Broken @import declaration of "button.css"
Broken @import declaration of "datepicker.css"
Broken @import declaration of "dialog.css"
Broken @import declaration of "draggable.css"
Broken @import declaration of "menu.css"
Broken @import declaration of "progressbar.css"
Broken @import declaration of "resizable.css"
Broken @import declaration of "selectable.css"
Broken @import declaration of "selectmenu.css"
Broken @import declaration of "sortable.css"
Broken @import declaration of "slider.css"
Broken @import declaration of "spinner.css"
Broken @import declaration of "tabs.css"
Broken @import declaration of "tooltip.css"
Error: Broken @import declaration of "theme.css"
Broken @import declaration of "accordion.css"
Broken @import declaration of "autocomplete.css"
Broken @import declaration of "button.css"
Broken @import declaration of "datepicker.css"
Broken @import declaration of "dialog.css"
Broken @import declaration of "draggable.css"
Broken @import declaration of "menu.css"
Broken @import declaration of "progressbar.css"
Broken @import declaration of "resizable.css"
Broken @import declaration of "selectable.css"
Broken @import declaration of "selectmenu.css"
Broken @import declaration of "sortable.css"
Broken @import declaration of "slider.css"
Broken @import declaration of "spinner.css"
Broken @import declaration of "tabs.css"
Broken @import declaration of "tooltip.css"
    at arrayToError (/myapp/node_modules/array-to-error/index.js:41:15)
    at minifyCallback (/myapp/node_modules/clean-css-promise/index.js:33:20)
    at whenSourceMapReady (/myapp/node_modules/clean-css/lib/clean.js:139:16)
    at Object.whenDone (/myapp/node_modules/clean-css/lib/clean.js:155:14)
    at processNext (/myapp/node_modules/clean-css/lib/imports/inliner.js:105:13)
    at importFrom (/myapp/node_modules/clean-css/lib/imports/inliner.js:79:10)
    at processNext (/myapp/node_modules/clean-css/lib/imports/inliner.js:104:16)
    at inlineLocalResource (/myapp/node_modules/clean-css/lib/imports/inliner.js:347:12)
    at inline (/myapp/node_modules/clean-css/lib/imports/inliner.js:218:10)
    at importFrom (/myapp/node_modules/clean-css/lib/imports/inliner.js:74:12)

by the way ember build works but ember build --environment production breaks which I guess comes back to minifyCSS.enabled = true

6

stefanpenner commented 8 years ago

does this happen with a basic app, or does it require something special? Can you provide a reduced application that demonstrate this, as it will aide in debugging.

eibrahim commented 8 years ago

very easy to reproduce...

ember new demo cd demo ember install ember-cli-jquery-ui ember build --environment production

stefanpenner commented 8 years ago

@eibrahim thank you

jasonmit commented 8 years ago

I'm seeing this as well, started happening this morning.

eibrahim commented 8 years ago

So can I keep 1.1 and set relativeTo = assets

jasonmit commented 8 years ago

No, that won't work. ~~Your best bet is to lock broccoli-clean-css down to 1.0.0 until the underlying issue is triaged further and fixed.~~

jasonmit commented 8 years ago

var app = new EmberApp(defaults, {
  minifyCSS: {
    options: {
      processImport: false
    }
  }
});

Should solve/workaround this in the meantime, but I suspect as more people upgrade to 2.3.0 this will reported on more and more.

It looks like the guard which allowed for swallowing of errors, and was enabled by default, was removed which introduced the issue, but it should have been treated as an API breaking change. I've sent PRs in to resolve the issue.

eibrahim commented 8 years ago

The processImport workaround worked for me and I was able to build with the production flag. But wouldn't that break the CSS? If a css import abc.css and we tell it not to process it, does that mean abc.css will not be part of the final css?

jasonmit commented 8 years ago

@eibrahim clean-css is used for minifying. You likely are using a preprocessor like LESS or SaSS to handle imports.