Impossible to minify other than production


#1

Hi there,

I’m trying to minify my js/css in other environments than production. I’ve read this: Development mode, why minify and pack? I’ve also tried that: https://ember-cli.com/asset-compilation (which is basically the same)

However, when I do ember build --environment=whatever (where whatever is not production), it doesn’t minify anything.

Why is that?

Thanks


#2

We do something like this and it seems to work ok though I haven’t actually checked really recently:

In ember-cli-build.js:

// get environment
var env = EmberApp.env();
// if we are building for a production environment turn minification on
if(env.indexOf('prod') > -1) {
  app.options.minifyCSS.enabled = true;
  app.options.minifyJS.enabled = true;
}

#3

Sorry, I didn’t see your message earlier, didn’t get the notification.

This doesn’t solve the issue for me. It’s impossible for me to minify builds with any command other than ember build --environment=production.


#4

Hmmmmm what version of Ember are you on, and what does your ember-cli-build.js look like?


#5
$ ember -v
ember-cli: 2.9.1
node: 6.9.1
os: darwin x64

I just did a brand new install of ember for a new project and wanted to give this a new try, so I don’t have a lot of customization of anything.

My ember-cli-build.js looks like this:

/*jshint node:true*/
/* global require, module */
var EmberApp = require('ember-cli/lib/broccoli/ember-app');

module.exports = function(defaults) {
  var app = new EmberApp(defaults, {
    minifyJS: {
      enabled: true
    },
    minifyCSS: {
      enabled: true
    }
  });

  app.import('app/styles/style.css');

  return app.toTree();
};

Then I try to run something like ember build --environment=whatever. It builds, but I don’t get any minification.


#6

How are you verifying that minification is not enabled?

I tried your config in an (almost) brand new app that I’ve been playing with, same version of Ember CLI (2.9.1) and minification seems to work fine. I verified this by running a build (in my case i did it with ember serve -e other) and then opening <project-root>/dist/vendor.js and <project-root>/dist/<appname>.js and they are minified as expected. If i remove that config they are not minified.

You’ll probably notice that the app source is still explorable in the ‘source’ tab of the Chrome (or other browser) dev tools. To disable that I think you’ll want to turn sourcemaps off:

  var app = new EmberApp(defaults, {
    minifyJS: {
      enabled: true
    },
    minifyCSS: {
      enabled: true
    },
    sourcemaps: {
      enabled: false
    }
  });

#7

Very simple: when everything is minified, I get an output like this.

$ ember build --environment=production
bootstrap-sassy config: all JS enabled, glyphicons enabled
cleaning up...
Built project successfully. Stored in "dist/".
File sizes:
 - demo-1208aea6cf3c124868f73fbf78cd7b93.js: 613 B (334 B gzipped)
 - demo-b4aa5e9138764f35037f1d3490616bf9.css: 1.47 KB (663 B gzipped)
 - style-045a666e4a8dd115ef4b919501a15212.css: 26.73 KB (6.1 KB gzipped)
...

and css/js files in dist/ are minified.

Otherwise

$ ember build --environment=staging
bootstrap-sassy config: all JS enabled, glyphicons enabled
cleaning up...
Built project successfully. Stored in "dist/".

and css/js files in dist/ are not minified.