Есть ли способ сообщить angular -cli (для angular 2) для генерации мини-версии css?

Как говорится в заголовке, когда я запускаю "ng serve" angular -cli, генерирует обычный css, тогда как я ожидаю получить сокращенную версию. Есть ли какой-либо конкретный параметр для использования для angular -cli-build или какого-либо дополнительного плагина для установки и использования?

Это мой angular -cli-build.js

var Angular2App = require('angular-cli/lib/broccoli/angular2-app');


module.exports = function(defaults) {
  return new Angular2App(defaults, {
    vendorNpmFiles: [
      'systemjs/dist/system-polyfills.js',
      'systemjs/dist/system.src.js',
      'zone.js/dist/**/*.+(js|js.map)',
      'es6-shim/es6-shim.js',
      'reflect-metadata/**/*.+(ts|js|js.map)',
      'rxjs/**/*.+(js|js.map)',
      '@angular/**/*.+(js|js.map)',
      'angular2-cookie/**/*.js'
    ]
  });
};

ОТВЕТЫ

Ответ 1

Вы можете использовать

# --env=<your_env>
# --no-sourcemap
# minify => ./minify.js
ng build --env=prod --no-sourcemap && node minify

minify.js

// npm i --save-dev minifier fs-jetpack

const jetpack = require('fs-jetpack');
const path = require('path');
const minifier = require('minifier');

const files = jetpack.list(path.join(__dirname, 'dist'));

console.log(files);

for (const file of files) {
  if (/.*(\.js|\.css)$/g.test(file)) {
    console.log(`Start ${file}`);
    const filePath = path.join(__dirname, 'dist', file);
    minifier.minify(filePath, {output: filePath});
  }
}

console.log('End');

Ответ 2

ng build --prod --env=prod

или

ng serve --prod

Будет минимизировать и добавить хэш файла для вас.

  • --prod сообщает ему минимизировать хэш и gzip.
  • --env=prod сообщает ему использовать файл констант среды prod.

который будет выглядеть так

Ответ 3

Команды Джеймса работают и минимизируются даже при использовании ng serve --prod.

Однако вы можете увидеть что-то вроде следующего в Chrome и запутаться:

enter image description here

Это не выглядит минимизированным, делает это!

Посмотрите внимательнее, и вы увидите js:formatted 0, указывающий, что функция красивой печати была включена.

Открытие URL-адреса http://localhost:4200/main.5082a3da36a8d45dfa42.js непосредственно в новой вкладке показало мне, что CLI действительно полностью его минимизировал.

Вы можете щелкнуть значок {} чтобы отключить эту функцию, но, похоже, она исчезнет после того, как код будет напечатан, поэтому вам может потребоваться перезагрузить страницу и быстро щелкнуть по ней.

enter code here