如何最小化angularjs + bootstrap4项目

时间:2018-08-02 15:25:51

标签: angularjs minify grunt-contrib-uglify

我用angularjs种子创建了一个新的 angularjs 项目。 我添加了一些Bower外部依赖项-例如 bootstrap4 和一些angularjs附加模块,例如 ui-rout ui-grid

所有源文件的大小约为25 MB。

我想缩小 :)

我尝试使用 grunt grunt-es uglify 并没有文件的情况下进行合并,但始终失败:( 通常会出现“意外字符” 错误。

这里有人知道Minified Angularjs种子+ bootstrap4带有咕unt声还是可以指导我的任何其他任务管理器工具吗?

我真的很沮丧:(

我的PACKAGE.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"
  }
}

项目结构 enter image description here

1 个答案:

答案 0 :(得分:2)

我发现了this thread

AngularJS has some naming conventions which seem to collide with minification:

  

由于AngularJS从名称中推断出控制器的依赖关系   控制器的构造函数的参数,如果要   缩小所有PhoneListController控制器的JavaScript代码   其功能参数也将被最小化,并且   依赖注入程序将无法正确识别服务。

此插件似乎可以解决以下问题: ng-annotate