zoukankan      html  css  js  c++  java
  • 我的grunt配置

    module.exports = function(grunt) {
    
        // 配置.
        grunt.initConfig({
            pkg: grunt.file.readJSON('package.json'),
            watch: {
                css: {
                    files: 'static/introduce/scss/**/*.scss',
                    tasks: ['clean:css','compass'],
                    options: {
                        livereload: true
                    }
                } ,
                includereplace:{
                    files:'src/html/**/*.html',
                    tasks:['includereplace','copy:html','clean:html']
                }
    
            },
            jshint:{//js代码检测工具
                options: {
                    jshintrc: '.jshintrc'
                },
                src: ["src/static/introduce/js/app/**/*.js"]
            },
            includereplace: {//包含html片段
                nav: {
                    files: [
                        {src: 'src/html/**/*.html', dest: '.tmphtml/'}
                    ]
                }
            },
            uglify: {//js压缩
                options: {
                    banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */
    '
                },
                js: {
                    files: [{
                        expand: true,
                        cwd: 'static/introduce/js',
                        src: '**/*.js',
                        dest: 'static/introduce/js',
                        ext:".min.js"
                    }]
                }
            },
            compass: {//compass
                dev: {
                    options: {
                        sassDir: 'static/introduce/scss',
                        cssDir: 'static/introduce/css',
                        outputStyle:'compressed',
                        noLineComments: true
                    }
                }
            },
            clean: {//清除
                mod:["static/introduce/css/module"],
                css:["static/introduce/css"],
                html:[".tmphtml/"]
            },
            copy: {//复制
                css: {
                    expand: true,
                    cwd: 'static/introduce/css/',
                    src: '**',
                    dest: '../../src/SVipSys/SVipSys.Web/static/Introduce/css',
                    flatten: true,
                    filter: 'isFile'
                },
                scss:{
                    expand: true,
                    cwd: 'static/introduce/scss/',
                    src: '**',
                    dest: '../../src/SVipSys/SVipSys.Web/static/Introduce/scss'
                },
                html:{
                    expand: true,
                    cwd: '.tmphtml/src/html/',
                    src: '**',
                    dest: 'view/'
                }
            },
            imagemin:{//图片压缩
                dynamic: {
                    files: [{
                        expand: true,
                        cwd: 'static/',
                        src: ['**/*.{png,jpg,gif}'],
                        dest: 'static/'
                    }]
                }
            }
        });
    
        // 加载任务
        grunt.loadNpmTasks('grunt-contrib-uglify');
        grunt.loadNpmTasks('grunt-contrib-compass');
        grunt.loadNpmTasks('grunt-contrib-clean');
        grunt.loadNpmTasks('grunt-contrib-watch');
        grunt.loadNpmTasks('grunt-contrib-copy');
        grunt.loadNpmTasks('grunt-include-replace');
        grunt.loadNpmTasks('grunt-contrib-jshint');
        grunt.loadNpmTasks('grunt-contrib-imagemin');
    
        // 任务列表
        grunt.registerTask('default',['clean:css','compass','clean:mod',,'watch']);
        grunt.registerTask('tpl',['includereplace','copy:html','clean:html']);
    
    };

    写在后面的话,最初听到grunt这个词的时候,是在去年上半年,当时前端构建工具非常火,我一直觉得它是一个非常高大上的东西,后来发现真的只是个工具而已。大神们说,你们不应该被工具所累,因为工具是学不完的。是的,我们不需要跟风,但不代表不必要用。很多是项目需求,比如你在入职后接手了一些新的项目,那么,最好就是学习它,掌握它。使用grunt的时候,确实感到了方便之处,比如图片压缩、js压缩、代码检测。。。工具,它是帮我们干活,减少重复、无聊的工作量的。所以,使用它的时候,我们应该明确的知道,希望它能帮我们干什么活,而不是对着API写一堆配置都不知道在干嘛。。。

  • 相关阅读:
    [leetCode]101对称二叉树
    UESTC
    UESTC
    UESTC
    Java编程思想 学习笔记12
    Java编程思想 学习笔记11
    Java编程思想 学习笔记10
    Java编程思想 学习笔记9
    Java编程思想 学习笔记8
    Java编程思想 学习笔记7
  • 原文地址:https://www.cnblogs.com/qianlegeqian/p/4586282.html
Copyright © 2011-2022 走看看