2013-05-07 28 views
6

Qualcuno ha riscontrato un problema utilizzando la bussola con yeoman e grunt in cui i fogli di stile non vengono compilati nella loro build. Sono nuovo a questo e sto cercando di capire veramente cosa sta succedendo dietro le quinte. Qualsiasi aiuto sarebbe apprezzato.Yeoman/Grunt non compilando Compass

Grazie!

'use strict'; 
    var lrSnippet = require('grunt-contrib-livereload/lib/utils').livereloadSnippet; 
    var mountFolder = function (connect, dir) { 
    return connect.static(require('path').resolve(dir)); 
    }; 

    module.exports = function (grunt) { 
    // load all grunt tasks 
    require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks); 

    // configurable paths 
    var yeomanConfig = { 
     app: 'app', 
     dist: 'dist' 
    }; 

    try { 
     yeomanConfig.app = require('./component.json').appPath || yeomanConfig.app; 
    } catch (e) {} 

    grunt.initConfig({ 
     yeoman: yeomanConfig, 
     watch: { 
     coffee: { 
      files: ['<%= yeoman.app %>/scripts/{,*/}*.coffee'], 
      tasks: ['coffee:dist'] 
     }, 
     coffeeTest: { 
      files: ['test/spec/{,*/}*.coffee'], 
      tasks: ['coffee:test'] 
     }, 
     compass: { 
      files: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'], 
      tasks: ['compass'] 
     }, 
     livereload: { 
      files: [ 
      '<%= yeoman.app %>/{,*/}*.html', 
      '{.tmp,<%= yeoman.app %>}/styles/{,*/}*.css', 
      '{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js', 
      'images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}' 
      ], 
      tasks: ['livereload'] 
     } 
     }, 
     connect: { 
     options: { 
      port: 9000, 
      // Change this to '0.0.0.0' to access the server from outside. 
      hostname: 'localhost' 
     }, 
     livereload: { 
      options: { 
      middleware: function (connect) { 
       return [ 
       lrSnippet, 
       mountFolder(connect, '.tmp'), 
       mountFolder(connect, yeomanConfig.app) 
       ]; 
      } 
      } 
     }, 
     test: { 
      options: { 
      middleware: function (connect) { 
       return [ 
       mountFolder(connect, '.tmp'), 
       mountFolder(connect, 'test') 
       ]; 
      } 
      } 
     } 
     }, 
     open: { 
     server: { 
      url: 'http://localhost:<%= connect.options.port %>' 
     } 
     }, 
     clean: { 
     dist: { 
      files: [{ 
      dot: true, 
      src: [ 
       '.tmp', 
       '<%= yeoman.dist %>/*', 
       '!<%= yeoman.dist %>/.git*' 
      ] 
      }] 
     }, 
     server: '.tmp' 
     }, 
     jshint: { 
     options: { 
      jshintrc: '.jshintrc' 
     }, 
     all: [ 
      'Gruntfile.js', 
      '<%= yeoman.app %>/scripts/{,*/}*.js' 
     ] 
     }, 
     karma: { 
     unit: { 
      configFile: 'karma.conf.js', 
      singleRun: true 
     } 
     }, 
     coffee: { 
     dist: { 
      files: [{ 
      expand: true, 
      cwd: '<%= yeoman.app %>/scripts', 
      src: '{,*/}*.coffee', 
      dest: '.tmp/scripts', 
      ext: '.js' 
      }] 
     }, 
     test: { 
      files: [{ 
      expand: true, 
      cwd: 'test/spec', 
      src: '{,*/}*.coffee', 
      dest: '.tmp/spec', 
      ext: '.js' 
      }] 
     } 
     }, 
     compass: { 
     options: { 
      sassDir: '<%= yeoman.app %>/styles', 
      cssDir: '.tmp/styles', 
      imagesDir: 'images', 
      javascriptsDir: '<%= yeoman.app %>/scripts', 
      fontsDir: '<%= yeoman.app %>/styles/fonts', 
      importPath: '<%= yeoman.app %>/components', 
      relativeAssets: true 
     }, 
     dist: {}, 
     server: { 
      options: { 
      debugInfo: true 
      } 
     } 
     }, 
     concat: { 
     dist: { 
      files: { 
      '<%= yeoman.dist %>/scripts/scripts.js': [ 
       '.tmp/scripts/{,*/}*.js', 
       '<%= yeoman.app %>/scripts/{,*/}*.js' 
      ] 
      } 
     } 
     }, 
     useminPrepare: { 
     html: '<%= yeoman.app %>/index.html', 
     options: { 
      dest: '<%= yeoman.dist %>' 
     } 
     }, 
     usemin: { 
     html: ['<%= yeoman.dist %>/{,*/}*.html'], 
     css: ['<%= yeoman.dist %>/styles/{,*/}*.css'], 
     options: { 
      dirs: ['<%= yeoman.dist %>'] 
     } 
     }, 
     imagemin: { 
     dist: { 
      files: [{ 
      expand: true, 
      cwd: '<%= yeoman.app %>/images', 
      src: '{,*/}*.{png,jpg,jpeg}', 
      dest: '<%= yeoman.dist %>/images' 
      }] 
     } 
     }, 
     cssmin: { 
     dist: { 
      files: { 
      '<%= yeoman.dist %>/styles/main.css': [ 
       '.tmp/styles/{,*/}*.css', 
       '<%= yeoman.app %>/styles/{,*/}*.css' 
      ] 
      } 
     } 
     }, 
     htmlmin: { 
     dist: { 
      options: { 
      /*removeCommentsFromCDATA: true, 
      // https://github.com/yeoman/grunt-usemin/issues/44 
      //collapseWhitespace: true, 
      collapseBooleanAttributes: true, 
      removeAttributeQuotes: true, 
      removeRedundantAttributes: true, 
      useShortDoctype: true, 
      removeEmptyAttributes: true, 
      removeOptionalTags: true*/ 
      }, 
      files: [{ 
      expand: true, 
      cwd: '<%= yeoman.app %>', 
      src: ['*.html', 'views/*.html'], 
      dest: '<%= yeoman.dist %>' 
      }] 
     } 
     }, 
     cdnify: { 
     dist: { 
      html: ['<%= yeoman.dist %>/*.html'] 
     } 
     }, 
     ngmin: { 
     dist: { 
      files: [{ 
      expand: true, 
      cwd: '<%= yeoman.dist %>/scripts', 
      src: '*.js', 
      dest: '<%= yeoman.dist %>/scripts' 
      }] 
     } 
     }, 
     uglify: { 
     dist: { 
      files: { 
      '<%= yeoman.dist %>/scripts/scripts.js': [ 
       '<%= yeoman.dist %>/scripts/scripts.js' 
      ] 
      } 
     } 
     }, 
     rev: { 
     dist: { 
      files: { 
      src: [ 
       '<%= yeoman.dist %>/scripts/{,*/}*.js', 
       '<%= yeoman.dist %>/styles/{,*/}*.css', 
       'images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}', 
       '<%= yeoman.dist %>/styles/fonts/*' 
      ] 
      } 
     } 
     }, 
     copy: { 
     dist: { 
      files: [{ 
      expand: true, 
      dot: true, 
      cwd: '<%= yeoman.app %>', 
      dest: '<%= yeoman.dist %>', 
      src: [ 
       '*.{ico,txt}', 
       '.htaccess', 
       'components/**/*', 
       'images/{,*/}*.{gif,webp}', 
       'styles/fonts/*' 
      ] 
      }] 
     } 
     } 
    }); 

    grunt.renameTask('regarde', 'watch'); 

    grunt.registerTask('server', [ 
     'clean:server', 
     'coffee:dist', 
     'compass:server', 
     'livereload-start', 
     'connect:livereload', 
     'open', 
     'watch' 
    ]); 

    grunt.registerTask('test', [ 
     'clean:server', 
     'coffee', 
     'compass', 
     'connect:test', 
     'karma' 
    ]); 

    grunt.registerTask('build', [ 
     'clean:dist', 
     // 'jshint', 
     // 'test', 
     // 'coffee', 
     'compass:dist', 
     'useminPrepare', 
     'imagemin', 
     'cssmin', 
     'htmlmin', 
     'concat', 
     'copy', 
     // 'cdnify', 
     'ngmin', 
     'uglify', 
     'rev', 
     'usemin' 
    ]); 

    grunt.registerTask('default', ['build']); 
    }; 
+0

Qual è l'errore, quando si esegue 'grunt compass'? – drinchev

+0

Ho effettivamente trovato il problema. Sembra che useminPrepare riscriva il mio concat ma non correttamente. Questo 'dist/styles/main.css': ['app/styles/main.css'] dovrebbe essere ignorato ma non sono sicuro di come farlo :( – alvincrespo

+3

Non è stata trovata una risposta in questo thread github: https: // github .com/yeoman/generatore-angolare/issues/193 – alvincrespo

risposta

6

La soluzione della questione GitHub fornito:

ho modificato il compito grugnito di compilazione e si trasferisce a 'concat' prima 'imagemin' e ora costruire grugnito funziona correttamente ed è correttamente main.css generato.