2

我正在使用运行 AngularJS 应用程序的 yeoman Web 应用程序模板。 usemin很棒，但是 AngularJS 文件必须经过预处理ngmin才能在被usemin.

我可以使用ngmin.

 ngmin: {
     build: {
         src: ['<%= yeoman.app %>/js/one.js','<%= yeoman.app %>/js/two.js'],
         dest: '<%= yeoman.dist %>/ng/annotated.js' 
     }
 }

基本上我运行一个成功创建的构建annotated.js。

我想要的是声明annotated.js文件index.html以通知usemin该文件仅用于分发，而不是我提到的用于开发的文件。

  <!-- build:js js/app.min.js -->  //annotated.js only must be processed instead of those 2 files.
  <script src="js/one.js" type="text/javascript"></script>
  <script src="js/two.js" type="text/javascript"></script>
  <!-- endbuild -->

作为参考，我的 usemin 配置：

  useminPrepare: {
        options: {
            dest: '<%= yeoman.dist %>'
        },
        html: '<%= yeoman.app %>/index.html'
    },
    usemin: {
        options: {
            dirs: ['<%= yeoman.dist %>']
        },
        html: ['<%= yeoman.dist %>/{,*/}*.html'],
        css: ['<%= yeoman.dist %>/css/{,*/}*.css']
    }

作为参考，我的构建任务：

grunt.registerTask('build', [
    'clean:dist',
    'useminPrepare',
    'concat',
    'cssmin',
    'ngmin',
    'uglify',
    'copy:dist',
    'rev',
    'usemin'
]);

我怎样才能实现它？

4

1 回答 1

3

那么，您曾经yo webapp生成一个应用程序，然后将 Angular 插入其中？对于您创建的未来 Angular 应用程序（或者如果现在为时不晚），有一个生成器！https://github.com/yeoman/generator-angular

这是一个链接和一些代码，显示了如何ngmin使用 Angular 生成器预先配置任务：

https://github.com/yeoman/generator-angular/blob/v0.4.0/templates/common/Gruntfile.js#L326-335

ngmin: {
  dist: {
    files: [{
      expand: true,
      cwd: '<%= yeoman.dist %>/scripts',
      src: '*.js',
      dest: '<%= yeoman.dist %>/scripts'
    }]
  }
}

将其插入，根据需要进行调整，并让我知道它是否有效！

于 2013-08-22T16:01:12.130 回答