4

Webpack を使用して Angular アプリをバンドルしようとしていますが、バンドルの縮小後に問題が発生しています。この構文は、依存関係の手動注釈を使用して機能します。

var app = angular.module('app', [
    'ui.router'
])
.config(['$locationProvider', '$stateProvider', ($locationProvider, $stateProvider) => {
    $locationProvider.html5Mode(true);
    $stateProvider
        .state('root', {
            url: '/',
            views: {
                '': {
                    template: '<p>Hello!</p>'
                }
            }
        });
}]);

この構文では$injector:modulerrエラーが発生します。

var app = angular.module('app', [
    'ui.router'
])
.config(($locationProvider, $stateProvider) => {
    $locationProvider.html5Mode(true);
    $stateProvider
        .state('root', {
            url: '/',
            views: {
                '': {
                    template: '<p>Hello!</p>'
                }
            }
        });
});

Webpack に ng-annotate-loader を使用しています。構成ファイルの関連部分は次のとおりです。

module: {
    loaders: [
        {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'ng-annotate!babel?stage=1'
        },

[$injector:modulerr]しかし、これはエラーを修正しません。loader: 'ng-annotate!babel?stage=1'で行を変更しようとしましたがloaders: ['ng-annotate', 'babel?stage=1']、改善されませんでした。どうすれば修正できるか教えてください。

編集:最終的に、私の質問は基本的にAngular ng annotateの複製であることがわかりました。

EDIT2： Angularモジュールを変数として宣言するのではなく、es6モジュールとしてインポートしていたため、ng-annotateがangularモジュールの.configに注釈を付けることができなかったことを指摘されました。

4

1 に答える 1

5

OK、最終的にng-annotate の Readmeで見つけたのは、文字列'ngInject';を関数内に配置すると、ng-annotateどの関数に注釈を付けるかを示すことができるということです。

私は自分のセットアップでそれを試しましたが、うまくいきました。

しかし、関数内でそのような余分なマーカー文字列を必要としない方法で ng-annotate-loader を設定することは素晴らしいことです。

PS: 私の質問の Edit2 部分には、最終的な答えが含まれています。私の場合、構文angularを使用して変数として宣言されるのではなく、ES6 モジュールとしてインポートされたため、ng-annotate の静的アナライザーが不満になりました。require

于 2015-11-03T21:58:16.963 に答える