2013-07-13 2 views
4

나는 영구 웹 사이트를 만들기 위해 yeoman 1.0 rc와 grunt를 사용하고 있습니다. everithing은 정상적으로 작동하지만, 모든 파일 경로가 업데이트 된 비 축소 버전 이외의 버전으로 만들고 싶습니다. , 그게 가능하고 어떻게 내가 이것을 달성 할 수 있습니다.grunt cssmin non minified 버전을 보존

gruntfile은 요 webapp로 작성된 매우 보통의 툴툴 거리는 파일입니다.

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

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

grunt.initConfig({ 
    yeoman: yeomanConfig, 
    watch: { 
     options: { 
      nospawn: true 
     }, 
     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:server'] 
     }, 
     livereload: { 
      options: { 
       livereload: LIVERELOAD_PORT 
      }, 
      files: [ 
       '<%= yeoman.app %>/*.html', 
       '{.tmp,<%= yeoman.app %>}/styles/{,*/}*.css', 
       '{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js', 
       '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}' 
      ] 
     } 
    }, 
    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 [ 
         mountFolder(connect, '.tmp'), 
         mountFolder(connect, yeomanConfig.app), 
         lrSnippet 
        ]; 
       } 
      } 
     }, 
     test: { 
      options: { 
       middleware: function (connect) { 
        return [ 
         mountFolder(connect, '.tmp'), 
         mountFolder(connect, 'test') 
        ]; 
       } 
      } 
     }, 
     dist: { 
      options: { 
       middleware: function (connect) { 
        return [ 
         mountFolder(connect, yeomanConfig.dist) 
        ]; 
       } 
      } 
     } 
    }, 
    open: { 
     server: { 
      path: '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', 
      '!<%= yeoman.app %>/scripts/vendor/*', 
      'test/spec/{,*/}*.js' 
     ] 
    }, 
    mocha: { 
     all: { 
      options: { 
       run: true, 
       urls: ['http://localhost:<%= connect.options.port %>/index.html'] 
      } 
     } 
    }, 
    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', 
      generatedImagesDir: '.tmp/images/generated', 
      imagesDir: '<%= yeoman.app %>/images', 
      javascriptsDir: '<%= yeoman.app %>/scripts', 
      fontsDir: '<%= yeoman.app %>/styles/fonts', 
      importPath: '<%= yeoman.app %>/bower_components', 
      httpImagesPath: '/images', 
      httpGeneratedImagesPath: '/images/generated', 
      relativeAssets: false 
     }, 
     dist: { 
      options:{ 
       outputStyle: 'nested' 
      } 
     }, 
     server: { 
      options: { 
       debugInfo: true 
      } 
     } 
    }, 
    // not used since Uglify task does concat, 
    // but still available if needed 
    /*concat: { 
     dist: {} 
    },*/ 
    // not enabled since usemin task does concat and uglify 
    // check index.html to edit your build targets 
    // enable this task if you prefer defining your build targets here 
    /*uglify: { 
     dist: {} 
    },*/ 
    rev: { 
     dist: { 
      files: { 
       src: [ 
        '<%= yeoman.dist %>/scripts/{,*/}*.js', 
        '<%= yeoman.dist %>/styles/{,*/}*.css', 
        '<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp}', 
        '<%= yeoman.dist %>/styles/fonts/*' 
       ] 
      } 
     } 
    }, 
    useminPrepare: { 
     options: { 
      dest: '<%= yeoman.dist %>' 
     }, 
     html: '<%= yeoman.app %>/index.html' 
    }, 
    usemin: { 
     options: { 
      dirs: ['<%= yeoman.dist %>'] 
     }, 
     html: ['<%= yeoman.dist %>/{,*/}*.html'], 
     css: ['<%= yeoman.dist %>/styles/{,*/}*.css'] 
    }, 
    imagemin: { 
     dist: { 
      files: [{ 
       expand: true, 
       cwd: '<%= yeoman.app %>/images', 
       src: '{,*/}*.{png,jpg,jpeg}', 
       dest: '<%= yeoman.dist %>/images' 
      }] 
     } 
    }, 
    svgmin: { 
     dist: { 
      files: [{ 
       expand: true, 
       cwd: '<%= yeoman.app %>/images', 
       src: '{,*/}*.svg', 
       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', 
       dest: '<%= yeoman.dist %>' 
      }] 
     } 
    }, 
    // Put files not handled in other tasks here 
    copy: { 
     dist: { 
      files: [{ 
       expand: true, 
       dot: true, 
       cwd: '<%= yeoman.app %>', 
       dest: '<%= yeoman.dist %>', 
       src: [ 
        '*.{ico,txt}', 
        '.htaccess', 
        'images/{,*/}*.{webp,gif}', 
        'styles/fonts/*' 
       ] 
      }, { 
       expand: true, 
       cwd: '.tmp/images', 
       dest: '<%= yeoman.dist %>/images', 
       src: [ 
        'generated/*' 
       ] 
      }] 
     } 
    }, 
    concurrent: { 
     server: [ 
      'coffee:dist', 
      'compass:server' 
     ], 
     test: [ 
      'coffee', 
      'compass' 
     ], 
     dist: [ 
      'coffee', 
      'compass:dist', 
      'imagemin', 
      'svgmin', 
      'htmlmin' 
     ] 
    } 
}); 

grunt.registerTask('server', function (target) { 
    if (target === 'dist') { 
     return grunt.task.run(['build', 'open', 'connect:dist:keepalive']); 
    } 

    grunt.task.run([ 
     'clean:server', 
     'concurrent:server', 
     'connect:livereload', 
     'open', 
     'watch' 
    ]); 
}); 

grunt.registerTask('test', [ 
    'clean:server', 
    'concurrent:test', 
    'connect:test', 
    'mocha' 
]); 

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

grunt.registerTask('default', [ 
    'jshint', 
    'test', 
    'build' 
]); 

}};

감사합니다.

답변

0

생산을 위해 항상 가장 적은 양의 파일을 목표로해야합니다 (HTTP가 연결을 열 때 가장 비싸기 때문에). 특히 파일 크기가 가장 작습니다. 의미는 제작 용으로 "dist"폴더를 배포하는 것입니다.

테스트 용도로는 속도가 문제가 아니기 때문에 일반적으로 "app"폴더를 배포합니다. 필자가 작성한 것처럼 코드 (css og js)의 어디에 문제가 있는지 정확하게 알고 싶습니다. 입니다.

그래서 내가 원하는대로 모든 것이 확실해질 때까지 "app"폴더를 배포하는 것이 좋습니다.