我试图使用
samaxes minify maven plugin在我的angularjs应用程序中缩小javascripts和css文件.我能够获得所有js& css缩小并使用maven构建war文件,但在尝试打开app url时我得到错误:[$injector:unpr]未知提供者:aProvider< - a我的应用程序不起作用. 下面我提供我的pom插件配置
<plugin> <groupId>com.samaxes.maven</groupId> <artifactId>minify-maven-plugin</artifactId> <version>1.7.4</version> <executions> <execution> <id>min-js</id> <phase>prepare-package</phase> <goals> <goal>minify</goal> </goals> </execution> </executions> <configuration> <charset>UTF-8</charset> <skipMerge>true</skipMerge> <cssSourceDir>myapp/styles</cssSourceDir> <jsSourceDir>myapp/javascript</jsSourceDir> <jsEngine>CLOSURE</jsEngine> <closureLanguage>ECMASCRIPT5</closureLanguage> <closureAngularPass>true</closureAngularPass> <nosuffix>true</nosuffix> <webappTargetDir>${project.build.directory}/minify</webappTargetDir> <cssSourceIncludes> <cssSourceInclude>**/*.css</cssSourceInclude> </cssSourceIncludes> <cssSourceExcludes> <cssSourceExclude>**/*.min.css</cssSourceExclude> </cssSourceExcludes> <jsSourceIncludes> <jsSourceInclude>**/*.js</jsSourceInclude> </jsSourceIncludes> <jsSourceExcludes> <jsSourceExclude>**/*.min.js</jsSourceExclude> </jsSourceExcludes> </configuration> </plugin> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-war-plugin</artifactId> <version>2.4</version> <configuration> <webResources> <resource> <directory>${project.build.directory}/minify</directory> </resource> </webResources> </configuration> </plugin>
目录结构
我的控制器结构
'use strict'; angular.module('myApp').controller('MyController',function($scope,$filter,$location,$interval,ngTableParams,$modal,$transition,myService,$timeout) { ... });
Chrome控制台错误
samaxes minify maven plugin是否支持缩小angularjs应用程序或我是否需要使用任何其他替代方案?
请帮助我在我的angularjs应用程序中缩小js和css.
解决方法
你走在正确的轨道上.
请注意,当您缩小控制器的JavaScript代码时,其所有函数参数也将缩小,并且依赖项注入器将无法正确识别服务.
可以通过使用依赖项的名称来注释函数来克服这个问题,这些依赖项的名称是以字符串形式提供的,这些字符串不会被缩小.有两种方法:
(1.)在控制器函数上创建一个$inject属性,该函数包含一个字符串数组.例如:
function MyController($scope,$timeout) {...} MyController.$inject = ['$scope','$filter','$location','$interval','ngTableParams','$modal','$transition','myService','$timeout'];
(2.)使用内联注释,而不是仅提供函数,而是提供数组.在你的情况下,它看起来像:
angular.module('myApp').controller('MyController',['$scope','$timeout',$timeout) { ... }]);
有关详细信息,请查看此tutorial的“关于缩小的注意事项”部分.