Как минимизировать проект angularjs+bootstrap4

Я создал новый проект angularjs с семенем angularjs. Я добавил некоторые внешние зависимости с помощью bower - например, bootstrap4 и некоторые дополнительные модули angularjs, такие как ui- rout и ui-grid.

Размер всех исходных файлов составляет около 25 мегабайт.

Я хочу минимизировать это очевидно:)

Я попытался сделать с grunt и grunt-es и угадать с конкатенацией файлов и без, и это всегда терпит неудачу:(Обычно с ошибкой "неожиданный символ".

Кто-нибудь здесь, что Minified Angularjs seed + bootstrap4 с grunt или любой другой инструмент менеджера задач, который может мне помочь?

Я очень расстроен:(

МОЙ ПАКЕТ.JSON

{
  "name": "angular-seed",
  "private": true,
  "version": "0.0.0",
  "description": "A starter project for AngularJS",
  "repository": "https://github.com/angular/angular-seed",
  "license": "MIT",
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-preset-env": "^1.7.0",
    "bower": "^1.7.7",
    "grunt": "^1.0.3",
    "grunt-babel": "^7.0.0",
    "grunt-cli": "^1.2.0",
    "grunt-contrib-uglify-es": "git+https://github.com/gruntjs/grunt-contrib-uglify.git#harmony",
    "grunt-dist": "0.0.6",
    "grunt-es6-transpiler": "^1.0.2",
    "http-server": "^0.9.0",
    "jasmine-core": "^2.4.1",
    "karma": "^0.13.22",
    "karma-chrome-launcher": "^0.2.3",
    "karma-firefox-launcher": "^0.1.7",
    "karma-jasmine": "^0.3.8",
    "karma-junit-reporter": "^0.4.1",
    "protractor": "^4.0.9"
  },
  "scripts": {
    "postinstall": "bower install",
    "update-deps": "npm update",
    "postupdate-deps": "bower update",
    "prestart": "npm install",
    "start": "http-server -a localhost -p 8000 -c-1 ./app",
    "pretest": "npm install",
    "test": "karma start karma.conf.js",
    "test-single-run": "karma start karma.conf.js --single-run",
    "preupdate-webdriver": "npm install",
    "update-webdriver": "webdriver-manager update",
    "preprotractor": "npm run update-webdriver",
    "protractor": "protractor e2e-tests/protractor.conf.js",
    "update-index-async": "node -e \"var fs=require('fs'),indexFile='app/index-async.html',loaderFile='app/bower_components/angular-loader/angular-loader.min.js',loaderText=fs.readFileSync(loaderFile,'utf-8').split(/sourceMappingURL=angular-loader.min.js.map/).join('sourceMappingURL=bower_components/angular-loader/angular-loader.min.js.map'),indexText=fs.readFileSync(indexFile,'utf-8').split(/\\/\\/@@NG_LOADER_START@@[\\s\\S]*\\/\\/@@NG_LOADER_END@@/).join('//@@NG_LOADER_START@@\\n'+loaderText+'    //@@NG_LOADER_END@@');fs.writeFileSync(indexFile,indexText);\""
  },
  "dependencies": {
    "grunt-contrib-concat": "^1.0.1",
    "grunt-contrib-jshint": "^1.1.0",
    "grunt-contrib-qunit": "^2.0.0",
    "grunt-contrib-watch": "^1.1.0"
  }
}

СТРУКТУРА ПРОЕКТА

1 ответ

Я нашел эту тему

AngularJS имеет некоторые соглашения об именах, которые, кажется, вступают в противоречие с минификацией:

Поскольку AngularJS выводит зависимости контроллера из имен аргументов в функцию-конструктор контроллера, если бы вы минимизировали код JavaScript для контроллера PhoneListController, все его аргументы функции также были бы минимизированы, и инжектор зависимостей не смог бы правильно идентифицировать услуги.

Этот плагин, похоже, решает проблему: ng-annotate

Другие вопросы по тегам