Question

在过去的一天里，我一直在努力缩小我的angularJs文件。该文件采用es6格式。

angularJs文件

var myApp = angular.module('myApp', ['ui.router', 'testData']);

angular.element(document).ready(() => {
    window.xxx = xxx('path');

    window.xxx.init({
            onLoad: 'login-required'
        })
        .success((authenticated) => {

           //code
        })
        .error(function() {
            window.location.reload();
        });
});

myApp.config(function($stateProvider, $urlRouterProvider, $httpProvider) {

    $httpProvider.interceptors.push('authInterceptor');
    //ui router code

});

myApp.factory('authInterceptor', function($q, Auth) {
    return {
        request: function (config) {
            //code
            return deferred.promise;
        }
    };
});

package.json文件看起来

{
  "engines": {
    "node": ">= 0.10.0"
  },
  "name": "do-job",
  "version": "0.1.0",
  "description": "App",
  "devDependencies": {
    "babelify": "^6.0.1",
    "grunt": "~0.4.5",
    "grunt-browserify": "^5.2.0",
    "grunt-contrib-clean": "^1.0.0",
    "grunt-contrib-concat": "~0.4.0",
    "grunt-contrib-connect": "^1.0.2",
    "grunt-contrib-jshint": "~0.10.0",
    "grunt-contrib-qunit": "~0.5.2",
    "grunt-contrib-uglify": "~0.5.0",
    "grunt-contrib-watch": "~0.6.1"
  }
}

grunt文件看起来像

module.exports = function(grunt) {

  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    connect: {
        server: {
            options: {
                port: 9000,
                base: 'dist/src',
                keepalive: true
            }
        }
    },
    copy: {
      main: {
        expand: true,
        cwd: 'src',
        src: '**',
        dest: 'dist/src',
      },
    },
 browserify: {
  dist: {
    options: {
      transform: [["babelify", { "stage": 0 }]]
    },
    files: {
      "src/app/app.js": "src/app/app.js"
    }
  }
},
  ngAnnotate: {
        options: {
            singleQuotes: true
        },
        app: {
            files: {
                'src/app/app.js': ['src/app/app.js'],

            }
        }
    },


    uglify: {
      options: {
        banner: '<%= banner %>'
      },
      dist: {
        src: 'src/app/app.js',
        dest: 'dist/app/app.min.js'
      }
    }
  });


  grunt.loadNpmTasks('grunt-contrib-copy');
  grunt.loadNpmTasks("grunt-browserify");
  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-clean');
  grunt.loadNpmTasks('grunt-contrib-connect');

  grunt.registerTask('default', ['clean']);

};

index.html看起来像

<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <!-- change -->

    <script src="../js/jquery.min.js"></script>

    <Script src="resources/bootstrap-3.3.7-dist/js/bootstrap.min.js"></Script>
    <!-- end -->

    <script type="text/javascript" src="https://js.xxx.com/"></script>
    <Script src="resources/angular.min.js"></Script>
    <Script src="resources/angular-ui-router.min.js"></Script>
    <script src="resources/angular-local-storage.min.js"></script>
    <script src="//localhost:9090/auth/js/xxx.js"></script>
    <script src="app.js"></script>
    <script src="directives/testData/testData.js"></script>

    <script src="controllers/controller.js"></script>

    <link href="resources/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="css/custom.css" rel="stylesheet">
    <script type="text/javascript" 
        src="resources/angular-payments.js">
    </script>


</head>

控制器示例

var headerModule = angular.module('headerModule',[]);
headerModule.controller('headerController',function($scope, $http, Auth){
    console.log('inside headerController');
    //code

});

我首先使用babel从es6转换为es5然后使用minify但它不起作用。我仍然得到angularJS的喷油器模块错误。此外，ngAnnotate不起作用导致相同的错误。缩小此文件的正确方法是什么？

使用babel的grunt uglify不工作es6

0 个答案: