Nuzzob Nuzzob - 3 months ago 9
AngularJS Question

Build whole angular project using grunt

I'm using grunt for the first time in order to annotate/minify/uglify my whole angular project. Here is what i have for the moment :

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']);
}


This works great, i get all my .js files in a "build" folder, with the correct folder architecture. The problem is : i only have the javascript files.

What am i supposed to add in the gruntfile to have my whole project architecture in the "build" folder ? ( HTML,CSS and media files in the right places, not only the annotated/minified/uglified javascript ?

Answer

You'll want to look at the copy task. It lets you copy files from one directory to another (like your html, css, fonts, images, etc):

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`
}
Comments