javascript - 使用 grunt 构建整个 Angular 项目

Question

我第一次使用 grunt 来注释/缩小/丑化我的整个 Angular 项目。这是我目前所拥有的:

module.exports = function(grunt) {
grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    ngAnnotate: {
        options: {
            singleQuotes: true
        },
        all: { //"app" target
             files: [
            {
                expand: true,
                src: ['./app/**/*.js'],
                dest: './build',
            },
        ],
        }
    },
    concat: {
        js: { //target
             files: [
            {
                expand: true,
                src: ['./build/**/*.js'],
                dest: '.',
            },
        ],
        }
    },
    uglify: {
        js: { //target
             files: [
            {
                expand: true,
                src: ['./build/**/*.js'],
                dest: '.',
            },
        ],
        }
    }



    //grunt task configuration will go here     
});
//load grunt task
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-ng-annotate');
//register grunt default task
grunt.registerTask('default', ['ngAnnotate', 'concat', 'uglify']);
}

这很好用，我将所有 .js 文件放在“build”文件夹中，并具有正确的文件夹架构。问题是:我只有 javascript 文件。

我应该在 gruntfile 中添加什么才能将整个项目架构放在“build”文件夹中？ ( HTML、CSS 和媒体文件位于正确的位置，而不仅仅是带注释/缩小/丑化的 javascript ？

Answer 1

您需要查看 copy task 。它允许您将文件从一个目录复制到另一个目录(例如 html、css、字体、图像等):

copy: {
  html: {
    files: [
      {expand: true, cwd: '.app/', src: ['some-dir/index.html'], dest: '.build/'}
    ]
  },
  css: {
    files: [
      {expand: true, cwd: '.app/', src: ['some-dir/styles/**/*.css'], dest: '.build/'}
    ]
  },
  // ... more targets for `copy`
}