Question

我使用yeoman/generator-angular生成器设置了一个简单的AngularJS应用程序。对于翻译服务，我按以下顺序安装了以下凉亭包：

bower.json

"angular-translate": "~2.8.1",
"angular-translate-loader-static-files": "~2.8.1",
"angular-translate-handler-log": "~2.8.1"

使用grunt wiredep，它们会插入到我的主模板文件中，旁边是所有其他依赖项：

应用/ index.html中

<!-- build:js(.) scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/bootstrap-sass-official/assets/javascripts/bootstrap.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-filter/dist/angular-filter.min.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="bower_components/angular-translate/angular-translate.js"></script>
<script src="bower_components/angular-translate-loader-static-files/angular-translate-loader-static-files.js"></script>
<script src="bower_components/angular-translate-handler-log/angular-translate-handler-log.js"></script>
<!-- endbower -->
<!-- endbuild -->

我在我的应用中注入依赖项，如下所示：

应用/脚本/ app.js

var saEvents = angular.module('saEvents', [
'saCore',
'ngSanitize',
'angular.filter',
'ui.router',
'pascalprecht.translate'
]);

并像这样配置$translateProvider：

saEvents

// route configuration via stateProvider
.config([
    '$stateProvider',
    '$urlRouterProvider',
    '$translateProvider',
    function ($stateProvider, $urlRouterProvider, $translateProvider) {

    $urlRouterProvider.otherwise('/');

    $stateProvider
        .state('home', {
            url: '/',
            templateUrl: 'views/main.html'
        })
        .state('day', {
            url: '/day/:date',
            controller: 'DayCtrl',
            templateUrl: 'views/days.html',
            resolve: {
                date: ['$stateParams', function ($stateParams) {
                    return $stateParams.date;
                }]
            }
        })
        .state('day.location', {
            url: '/location/:locationId',
            templateUrl: 'views/days.location.html',
            controller: 'LocationCtrl'
        })
        .state('event', {
            url: '/event/:eventId',
            controller: 'EventCtrl',
            templateUrl: 'views/events/detail.html'
        })
    ;

    $translateProvider.useStaticFilesLoader({
        prefix: 'locales/locale-',
        suffix: '.json'
    });
    $translateProvider.useMissingTranslationHandlerLog();
    $translateProvider.preferredLanguage('de_DE');

}])

当我使用grunt serve在开发模式下工作并在http://localhost:9000/打开应用时，一切都按预期工作，但只要我使用grunt build构建项目并打开 dist 版本我收到以下错误：

vendor.696ffd4f.js:14 Uncaught TypeError: angular.module(...).run(...) is not a function
vendor.696ffd4f.js:4 Uncaught Error: [$injector:unpr] Unknown provider: $translateStaticFilesLoaderProvider <- $translateStaticFilesLoader

http://errors.angularjs.org/1.4.8/ $注射器/ unpr？P0 =％24translateStaticFilesLoaderProvider％20％3 C-％20％24translateStaticFilesLoader

我设法通过移动块之外的angular-translate扩展名的javascript源文件来解决问题：

应用/ index.html中

<!-- build:js(.) scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/bootstrap-sass-official/assets/javascripts/bootstrap.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-filter/dist/angular-filter.min.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="bower_components/angular-translate/angular-translate.js"></script>
<!-- endbower -->
<!-- endbuild -->

<!-- build:js({.tmp,app}) scripts/scripts.js -->
<script src="../bower_components/angular-translate-loader-static-files/angular-translate-loader-static-files.js"></script>
<script src="../bower_components/angular-translate-handler-log/angular-translate-handler-log.js"></script>
<script src="scripts/core/core.module.js"></script>
<script src="scripts/core/core.config.js"></script>
<script src="scripts/core/core.services.js"></script>
<script src="scripts/core/core.controller.js"></script>
<script src="scripts/app.js"></script>
<!-- endbuild -->

但这感觉就像一个肮脏的把戏，我很乐意找到一个干净的解决方案。

未知提供者：$ translateStaticFilesLoaderProvider＆lt; - $ translateSaticFilesLoader with yeoman and grunt build

0 个答案: