grunt---grunt_test 測試用例

說明css

http://www.gruntjs.net/getting-started --grunt快速入門(建立package.json和Gruntfile.js
準備一份新的 Grunt 項目
通常須要在你的項目中添加兩份文件:package.json 和 Gruntfile。html

package.json: 此文件被npm用於存儲項目的元數據,以便將此項目發佈爲npm模塊。你能夠在此文件中列出項目依賴的grunt和Grunt插件,放置於devDependencies配置段內。npm

Gruntfile: 此文件被命名爲 Gruntfile.js 或 Gruntfile.coffee,用來配置或定義任務(task)並加載Grunt插件的。 此文檔中提到的 Gruntfile 其實說的是一個文件,文件名是 Gruntfile.js 或 Gruntfile.coffee。json

http://blog.csdn.net/playboyanta123/article/details/43230831 安裝
http://caibaojian.com/grunt.html --安裝sass

http://caibaojian.com/grunt.html#t3ide

http://www.cnblogs.com/snandy/archive/2013/03/11/2949177.html --值得研究grunt

package.json:spa

{
"name": "test_grunt",
"version": "0.1.0",
"devDependencies": {
"grunt": "^1.0.1",
"grunt-contrib-concat": "~0.1.1",
"grunt-contrib-jshint": "~0.1.1",
"grunt-contrib-uglify": "~0.1.2"
}
}.net

Gruntfile.js配置參數:插件

  // Project configuration.
module.exports = function(grunt) {
    // 使用嚴格模式
    'use strict';

    // 這裏定義咱們須要的任務
    grunt.initConfig({
     pkg: grunt.file.readJSON('package.json'),
    //其餘任務
     concat: {  
         options: {  
             separator: ';',  
             stripBanners: true  
         },  
         dist: {  
             src: [  
                 "js/EvenUtil.js",  
                 "js/222.js",
             ],  
             dest: "assets/js/default.js"  
         }  
     },  
     uglify: {  
         options: {  
         },  
         dist: {  
             files: {  
                 'assets/js/default.min.js': 'assets/js/default.js'  
             }  
         }  
     },  
     cssmin: {  
         options: {  
             keepSpecialComments: 0  
         },  
         compress: {  
             files: {  
                 'assets/css/default.css': [
                     "dist/css/test.css", 
                     "dist/css/common.css",  
                     "dist/css/public.css",  
                     "dist/css/index.css"  
                 ]  
             }  
         }  
     }, 
        // 設置任務,刪除文件夾
    clean: {
        dist: 'dist'
    },

    // 經過sass編譯成css文件
    sass: {
        dist: {
            files: [{
                expand: true,
                cwd: 'scss',
                src: ['*.scss'],
                dest: 'dist/css',
                ext: '.css'
            }]
        }
    },
         // 檢測改變,自動跑sass任務
    watch: {
        scripts: {
            files: ['scss/*.scss','js/*.js','assets/css/*.css'],
            tasks: ['sass','concat','uglify','cssmin'],
            options: {
                spawn: false
            }
        }
    }


    });

      grunt.loadNpmTasks('grunt-contrib-concat');  
      grunt.loadNpmTasks('grunt-contrib-uglify');  
      grunt.loadNpmTasks('grunt-contrib-cssmin');
    // 必定要引用着3個模塊
    grunt.loadNpmTasks('grunt-contrib-clean');
    grunt.loadNpmTasks('grunt-contrib-sass');
    grunt.loadNpmTasks('grunt-contrib-watch');
    // 把須要跑的任務註冊到default這裏每次運行grunt的時候先刪除dist,而後從新編譯,最後監測文件夾的狀況。
    grunt.registerTask('default', ['clean:dist', 'sass:dist', 'concat', 'uglify', 'cssmin', 'watch']);
};
View Code
相關文章
相關標籤/搜索