Angularjs无法find模块后与requirejs优化器optmize

我有这个回购在这个提交angularseed:a9ad4568bd8534b888ae5cb3bf1a7f92f66d633d(只是学习工具和库)。 也许有人可以帮助我。

当我尝试使用requirejs优化我的代码时出现问题。 我使用grunt-contrib-requirejs。

要查看问题,您必须克隆回购。

Nodejs是强制性的。

https://github.com/neonds/angularseed.git cd angularseed npm run configure //to download deps npm run dev //then open http://localhost:9000 npm run prod 

当我运行prod脚本时,似乎ngRouter没有正确加载和。 有人可以帮我find问题吗?

错误login控制台

Gruntfile:

 module.exports = function(grunt) { 'use strict'; grunt.loadNpmTasks('grunt-contrib-clean'); grunt.loadNpmTasks('grunt-contrib-copy'); grunt.loadNpmTasks('grunt-contrib-concat'); grunt.loadNpmTasks('grunt-contrib-jshint'); grunt.loadNpmTasks('grunt-contrib-watch'); grunt.loadNpmTasks('grunt-contrib-connect'); grunt.loadNpmTasks('grunt-contrib-requirejs'); grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), project: { src: 'src', vendor: 'bower_components', build: 'build', dist: 'dist', }, clean: { dist: '<%= project.dist %>', build: '<%= project.build %>' }, jshint: { all: ['Gruntfile.js', '<%= project.src %>/scripts/**/*.js'] }, copy: { vendor: { files: [ {expand: true, cwd: '<%= project.vendor %>/angular/', src: ['angular.min.js', 'angular.min.js.map'], dest: '<%= project.build %>/assets/vendor/js'}, {expand: true, cwd: '<%= project.vendor %>/angular-route/', src: ['angular-route.min.js', 'angular-route.min.js.map'], dest: '<%= project.build %>/assets/vendor/js'}, {expand: true, cwd: '<%= project.vendor %>/requirejs/', src: 'require.js', dest: '<%= project.build %>/assets/vendor/js'}, {expand: true, cwd: '<%= project.vendor %>/jquery/dist', src: 'jquery.min.js', dest: '<%= project.build %>/assets/vendor/js'}, {expand: true, cwd: '<%= project.vendor %>/bootstrap/dist/', src: ['*/**.min.js', '*/**.min.js.map'], dest: '<%= project.build %>/assets/vendor/bootstrap'}, {expand: true, cwd: '<%= project.vendor %>/bootstrap/dist/', src: ['*/**.min.css', '*/**.min.css.map'], dest: '<%= project.build %>/assets/vendor/bootstrap'}, {expand: true, cwd: '<%= project.vendor %>/bootstrap/dist/fonts', src: '*', dest: '<%= project.build %>/assets/vendor/bootstrap/fonts'}, {expand: true, cwd: '<%= project.vendor %>/components-font-awesome/', src: ['css/*', 'fonts/*'], dest: '<%= project.build %>/assets/vendor/components-font-awesome'}, ], }, scripts: { files: [ {expand: true, cwd: '<%= project.src %>/', src: 'index.html', dest: '<%= project.build %>/'}, {expand: true, cwd: '<%= project.src %>/../', src: 'favicon.ico', dest: '<%= project.build %>/'}, {expand: true, cwd: '<%= project.src %>/scripts', src: ['**/*.js'], dest: '<%= project.build %>/assets/js'}, {flatten: true, expand: true, cwd: '<%= project.src %>/scripts', src: '**/*.html', dest: '<%= project.build %>/', filter: 'isFile'}, ], } }, concat: { options: { separator: '\n\n', }, build_css: { src: [ '<%= project.src %>/**/*.css' ], dest: '<%= project.build %>/assets/css/styles.css' }, }, connect: { sever: { options: { hostname: 'localhost', port: 9000, base: 'build/', livereload: 35729 } } }, watch: { options: { livereload: true, dateFormat: function(time) { grunt.log.writeln('The watch finished in ' + time + 'ms at' + (new Date()).toString()); grunt.log.writeln('Waiting for more changes...'); } }, scripts: { files: '<%= project.src %>/**/*.js', tasks: ['jshint','copy:scripts'], }, styles: { files: '<%= project.src %>/**/*.css', tasks: ['concat:build_css'], } }, requirejs: { compile: { options: { baseUrl: "./build/assets/js", out: '<%= project.dist %>/<%= pkg.name %>-<%= pkg.version %>.min.js', mainConfigFile:'./build/assets/js/main.js', name: 'main' }, preserveLicenseComments : false, optimize: "uglify" } } }); grunt.registerTask('build', function(){ grunt.task.run('clean'); grunt.task.run('jshint'); grunt.task.run('copy:vendor'); grunt.task.run('copy:scripts'); grunt.task.run('concat:build_css'); grunt.task.run('connect'); grunt.task.run('watch'); }); grunt.registerTask('dist', function () { grunt.task.run('clean'); grunt.task.run('jshint'); grunt.task.run('copy:vendor'); grunt.task.run('copy:scripts'); grunt.task.run('concat:build_css'); grunt.task.run('requirejs'); }); }; 

谢谢!!

Angular失败,因为它调用函数上的.toString()来找出它需要注入的参数。 当您缩小脚本时,这当然会立即中断。 例如,而不是这个:

 appModule.config(function ($routeProvider) { $routeProvider .when('/', { template: '<home></home>' }); }) 

哪些会被缩小到像这样的东西:

 appModule.config(function(a){a.when('/',{template:'<home></home>'})}) 

由于Angular是如此糟糕的想法,它不知道在上面的缩小脚本应该是$routeProvider所以它只是失败悲惨的时候提出这一点。

你需要这样做:

 appModule.config(['$routeProvider', function ($routeProvider) { $routeProvider .when('/', { template: '<home></home>' }); }]) 

你可以看到更多的解释,为什么Angular在这里缩小时很容易破解: https ://scotch.io/tutorials/declaring-angularjs-modules-for-minification