Encoding::CompatibilityError: incompatible character encodings: GBK and UTF-8

直接grunt serve读的css是.tmp/css/main.css 而这个文件不通过build生成出来是这样:

/*
Encoding::CompatibilityError: incompatible character encodings: GBK and UTF-8

Backtrace:
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/util.rb:1185:in `absolute_path'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/util.rb:1185:in `absolute_path'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/importers/filesystem.rb:70:in `public_url'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/engine.rb:372:in `block in _render_with_sourcemap'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/util.rb:496:in `silence_warnings'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/engine.rb:370:in `_render_with_sourcemap'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/engine.rb:298:in `render_with_sourcemap'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/plugin/compiler.rb:492:in `update_stylesheet'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/plugin/compiler.rb:215:in `block in update_stylesheets'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/plugin/compiler.rb:209:in `each'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/sass-3.4.23/lib/sass/plugin/compiler.rb:209:in `update_stylesheets'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/compass-1.0.3/lib/compass/sass_compiler.rb:40:in `compile!'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/compass-1.0.3/lib/compass/commands/update_project.rb:49:in `perform'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/compass-1.0.3/lib/compass/commands/base.rb:18:in `execute'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/compass-1.0.3/lib/compass/commands/project_base.rb:19:in `execute'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/compass-1.0.3/lib/compass/exec/sub_command_ui.rb:43:in `perform!'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/compass-1.0.3/lib/compass/exec/sub_command_ui.rb:15:in `run!'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/compass-1.0.3/bin/compass:30:in `block in <top (required)>'
C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/compass-1.0.3/bin/compass:44:in `<top (required)>'
C:/Ruby23-x64/bin/compass:22:in `load'
C:/Ruby23-x64/bin/compass:22:in `<main>'
*/
body:before {
  white-space: pre;
  font-family: monospace;
  content: "Encoding::CompatibilityError: incompatible character encodings: GBK and UTF-8"; }

/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm1haW4uY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0VBeUJFO0FBQ0Y7RUFDRSxpQkFBaUI7RUFDakIsdUJBQXVCO0VBQ3ZCLHlGQUF5RixFQUFFIiwiZmlsZSI6Im1haW4uY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLypcclxuRW5jb2Rpbmc6OkNvbXBhdGliaWxpdHlFcnJvcjogaW5jb21wYXRpYmxlIGNoYXJhY3RlciBlbmNvZGluZ3M6IEdCSyBhbmQgVVRGLThcclxuXHJcbkJhY2t0cmFjZTpcclxuQzovUnVieTIzLXg2NC9saWIvcnVieS9nZW1zLzIuMy4wL2dlbXMvc2Fzcy0zLjQuMjMvbGliL3Nhc3MvdXRpbC5yYjoxMTg1OmluIGBhYnNvbHV0ZV9wYXRoJ1xyXG5DOi9SdWJ5MjMteDY0L2xpYi9ydWJ5L2dlbXMvMi4zLjAvZ2Vtcy9zYXNzLTMuNC4yMy9saWIvc2Fzcy91dGlsLnJiOjExODU6aW4gYGFic29sdXRlX3BhdGgnXHJcbkM6L1J1YnkyMy14NjQvbGliL3J1YnkvZ2Vtcy8yLjMuMC9nZW1zL3Nhc3MtMy40LjIzL2xpYi9zYXNzL2ltcG9ydGVycy9maWxlc3lzdGVtLnJiOjcwOmluIGBwdWJsaWNfdXJsJ1xyXG5DOi9SdWJ5MjMteDY0L2xpYi9ydWJ5L2dlbXMvMi4zLjAvZ2Vtcy9zYXNzLTMuNC4yMy9saWIvc2Fzcy9lbmdpbmUucmI6MzcyOmluIGBibG9jayBpbiBfcmVuZGVyX3dpdGhfc291cmNlbWFwJ1xyXG5DOi9SdWJ5MjMteDY0L2xpYi9ydWJ5L2dlbXMvMi4zLjAvZ2Vtcy9zYXNzLTMuNC4yMy9saWIvc2Fzcy91dGlsLnJiOjQ5NjppbiBgc2lsZW5jZV93YXJuaW5ncydcclxuQzovUnVieTIzLXg2NC9saWIvcnVieS9nZW1zLzIuMy4wL2dlbXMvc2Fzcy0zLjQuMjMvbGliL3Nhc3MvZW5naW5lLnJiOjM3MDppbiBgX3JlbmRlcl93aXRoX3NvdXJjZW1hcCdcclxuQzovUnVieTIzLXg2NC9saWIvcnVieS9nZW1zLzIuMy4wL2dlbXMvc2Fzcy0zLjQuMjMvbGliL3Nhc3MvZW5naW5lLnJiOjI5ODppbiBgcmVuZGVyX3dpdGhfc291cmNlbWFwJ1xyXG5DOi9SdWJ5MjMteDY0L2xpYi9ydWJ5L2dlbXMvMi4zLjAvZ2Vtcy9zYXNzLTMuNC4yMy9saWIvc2Fzcy9wbHVnaW4vY29tcGlsZXIucmI6NDkyOmluIGB1cGRhdGVfc3R5bGVzaGVldCdcclxuQzovUnVieTIzLXg2NC9saWIvcnVieS9nZW1zLzIuMy4wL2dlbXMvc2Fzcy0zLjQuMjMvbGliL3Nhc3MvcGx1Z2luL2NvbXBpbGVyLnJiOjIxNTppbiBgYmxvY2sgaW4gdXBkYXRlX3N0eWxlc2hlZXRzJ1xyXG5DOi9SdWJ5MjMteDY0L2xpYi9ydWJ5L2dlbXMvMi4zLjAvZ2Vtcy9zYXNzLTMuNC4yMy9saWIvc2Fzcy9wbHVnaW4vY29tcGlsZXIucmI6MjA5OmluIGBlYWNoJ1xyXG5DOi9SdWJ5MjMteDY0L2xpYi9ydWJ5L2dlbXMvMi4zLjAvZ2Vtcy9zYXNzLTMuNC4yMy9saWIvc2Fzcy9wbHVnaW4vY29tcGlsZXIucmI6MjA5OmluIGB1cGRhdGVfc3R5bGVzaGVldHMnXHJcbkM6L1J1YnkyMy14NjQvbGliL3J1YnkvZ2Vtcy8yLjMuMC9nZW1zL2NvbXBhc3MtMS4wLjMvbGliL2NvbXBhc3Mvc2Fzc19jb21waWxlci5yYjo0MDppbiBgY29tcGlsZSEnXHJcbkM6L1J1YnkyMy14NjQvbGliL3J1YnkvZ2Vtcy8yLjMuMC9nZW1zL2NvbXBhc3MtMS4wLjMvbGliL2NvbXBhc3MvY29tbWFuZHMvdXBkYXRlX3Byb2plY3QucmI6NDk6aW4gYHBlcmZvcm0nXHJcbkM6L1J1YnkyMy14NjQvbGliL3J1YnkvZ2Vtcy8yLjMuMC9nZW1zL2NvbXBhc3MtMS4wLjMvbGliL2NvbXBhc3MvY29tbWFuZHMvYmFzZS5yYjoxODppbiBgZXhlY3V0ZSdcclxuQzovUnVieTIzLXg2NC9saWIvcnVieS9nZW1zLzIuMy4wL2dlbXMvY29tcGFzcy0xLjAuMy9saWIvY29tcGFzcy9jb21tYW5kcy9wcm9qZWN0X2Jhc2UucmI6MTk6aW4gYGV4ZWN1dGUnXHJcbkM6L1J1YnkyMy14NjQvbGliL3J1YnkvZ2Vtcy8yLjMuMC9nZW1zL2NvbXBhc3MtMS4wLjMvbGliL2NvbXBhc3MvZXhlYy9zdWJfY29tbWFuZF91aS5yYjo0MzppbiBgcGVyZm9ybSEnXHJcbkM6L1J1YnkyMy14NjQvbGliL3J1YnkvZ2Vtcy8yLjMuMC9nZW1zL2NvbXBhc3MtMS4wLjMvbGliL2NvbXBhc3MvZXhlYy9zdWJfY29tbWFuZF91aS5yYjoxNTppbiBgcnVuISdcclxuQzovUnVieTIzLXg2NC9saWIvcnVieS9nZW1zLzIuMy4wL2dlbXMvY29tcGFzcy0xLjAuMy9iaW4vY29tcGFzczozMDppbiBgYmxvY2sgaW4gPHRvcCAocmVxdWlyZWQpPidcclxuQzovUnVieTIzLXg2NC9saWIvcnVieS9nZW1zLzIuMy4wL2dlbXMvY29tcGFzcy0xLjAuMy9iaW4vY29tcGFzczo0NDppbiBgPHRvcCAocmVxdWlyZWQpPidcclxuQzovUnVieTIzLXg2NC9iaW4vY29tcGFzczoyMjppbiBgbG9hZCdcclxuQzovUnVieTIzLXg2NC9iaW4vY29tcGFzczoyMjppbiBgPG1haW4+J1xyXG4qL1xyXG5ib2R5OmJlZm9yZSB7XHJcbiAgd2hpdGUtc3BhY2U6IHByZTtcclxuICBmb250LWZhbWlseTogbW9ub3NwYWNlO1xyXG4gIGNvbnRlbnQ6IFwiRW5jb2Rpbmc6OkNvbXBhdGliaWxpdHlFcnJvcjogaW5jb21wYXRpYmxlIGNoYXJhY3RlciBlbmNvZGluZ3M6IEdCSyBhbmQgVVRGLThcIjsgfVxyXG4iXX0= */

main.css

因此页面上就不会有正常的样式了,第一行的报错异常醒目.

去网上搜关于编码的问题, 得到的解答是在scss前面加上一句 @charset "utf-8";

如果这样还不能使得grunt server(或者grunt serve)在.tmp文件夹下生成正确的css,

从dist拷贝一个过来, 去掉时间戳倒是可以救个急, 不是长久之计.

解决方案参考 https://github.com/imathis/octopress/issues/232

试过改engin.ruby文件没有效果：

C:\Ruby\lib\ruby\gems\1.9.1\gems\sass-3.3.14\lib\sass

在这个文件里面engine.rb，添加一行代码（同方法1）

Encoding.default_external = Encoding.find('utf-8')

放在所有的require XXXX 之后即可, 还尝试加过下面这两行,也没反应.

//LANG=en_US.UTF-8
LANG=zh_CN.UTF-8

//LC_ALL=en_US.UTF-8
LC_ALL=zh_CN.UTF-8

最后还是回头去研究gruntfile.js, 这篇文章很有启发:http://blog.csdn.net/u012844719/article/details/23164939

声明，以下相关全是前端的东西。
Yeoman 一个自动化工作流，说白了就是把一些你需要手动操作的东西，自动给你做好。
我的理解就是给你创建一个项目，然后里面该有的东西都有了。
官网：http://www.yeoman.io/
Grunt 什么？大G？，其实不是的。
一个类似maven的东西（不知道maven？，那总知道ant吧），能够对前端的文件进行压缩，打包，还有部署，（应该不jiào部署，jiào整理，更合适一些）。
官网：http://gruntjs.com/
grunt的强大，在于可以有很多第三方的插件可以下载，例如less，coffeescripe等等，grunt可以帮助你自动编译这些文件。
Bower 一只肥鸟，官方说法jiào做A package manager for the web，也就是包管理器。
自我感觉不是很好用，比如你需要用jquery，它会把jquery相关的文件全部下载，例如jquery.cokkie.js等，不仅浪费时间，还占用空间。
下面来讲解，这三样东西的具体配置：
安装Yeoman
//首先，你可以执行 sudo npm install -g yo grunt-cli bower 这样可以一下安装3个文件，当然你也可以选择不装。。
先得安装Node.js，Git和Ruby，不要问为什么，官网说的。。。
npm install -g yo

创建一个project目录，定位在该目录下
然后安装generator-webapp，这也东西使用来生成器的，也就是能够生成你app的程序
npm install -g generator-webapp
-g 的意思是全局安装，这样的话你就可以在任何地方使用yo命令了。
默认情况下会让你选择webapp所用的框架，例如 

可以多选，也可以单选，选择后生成的相关配置文件也会根据你的选择来改变，所以这一配置要慎重。
这样，yeoman就装好了。
让你想执行bower命令时，发现报错，因为你还没装bower。。
安装Bower
npm install -g bower
这个很简单，先装上再说，具体用法，下面会讲。
安装Grunt 

npm install -g grunt-cli

cli并不是grunt，只是一个能够让你执行grunt命令的程序
接下来安装grunt
npm install -g grunt

回到你建的project目录，装完之后可以看到 目录下会有一个Gruntfile.js文件，
这个是grunt的核心文件，也是这三样东西jiāo互的文件。
// Generated on 2014-04-08 using generator-webapp 0.4.8
'use strict';

// # Globbing
// for performance reasons we're only matching one level down:
// 'test/spec/{,*/}*.js'
// use this if you want to recursively match all subfolders:
// 'test/spec/**/*.js'

module.exports = function (grunt) {

    // Load grunt tasks automatically
    require('load-grunt-tasks')(grunt);

    // Time how long tasks take. Can help when optimizing build times
    require('time-grunt')(grunt);

    // Define the configuration for all the tasks
    grunt.initConfig({

        // Project settings
        config: {
            // Configurable paths
            app: 'app',
            dist: 'dist'
        },

        // Watches files for changes and runs tasks based on the changed files
        watch: {
            bower: {
                files: ['bower.json'],
                tasks: ['bowerInstall']
            },
            js: {
                files: ['<%= config.app %>/scripts/{,*/}*.js'],
                tasks: ['jshint'],
                options: {
                    livereload: true
                }
            },
            jstest: {
                files: ['test/spec/{,*/}*.js'],
                tasks: ['test:watch']
            },
            gruntfile: {
                files: ['Gruntfile.js']
            },
            styles: {
                files: ['<%= config.app %>/styles/{,*/}*.css'],
                tasks: ['newer:copy:styles', 'autoprefixer']
            },
            livereload: {
                options: {
                    livereload: '<%= connect.options.livereload %>'
                },
                files: [
                    '<%= config.app %>/{,*/}*.html',
                    '.tmp/styles/{,*/}*.css',
                    '<%= config.app %>/images/{,*/}*'
                ]
            }
        },

        // The actual grunt server settings
        connect: {
            options: {
                port: ,
                livereload: ,
                // Change this to '0.0.0.0' to access the server from outside
                hostname: 'localhost'
            },
            livereload: {
                options: {
                    open: true,
                    base: [
                        '.tmp',
                        '<%= config.app %>'
                    ]
                }
            },
            test: {
                options: {
                    port: ,
                    base: [
                        '.tmp',
                        'test',
                        '<%= config.app %>'
                    ]
                }
            },
            dist: {
                options: {
                    open: true,
                    base: '<%= config.dist %>',
                    livereload: false
                }
            }
        },

        // Empties folders to start fresh
        clean: {
            dist: {
                files: [{
                    dot: true,
                    src: [
                        '.tmp',
                        '<%= config.dist %>/*',
                        '!<%= config.dist %>/.git*'
                    ]
                }]
            },
            server: '.tmp'
        },

        // Make sure code styles are up to par and there are no obvious mistakes
        jshint: {
            options: {
                jshintrc: '.jshintrc',
                reporter: require('jshint-stylish')
            },
            all: [
                'Gruntfile.js',
                '<%= config.app %>/scripts/{,*/}*.js',
                '!<%= config.app %>/scripts/vendor/*',
                'test/spec/{,*/}*.js'
            ]
        },

        // Mocha testing framework configuration options
        mocha: {
            all: {
                options: {
                    run: true,
                    urls: ['http://<%= connect.test.options.hostname %>:<%= connect.test.options.port %>/index.html']
                }
            }
        },

        // Add vendor prefixed styles
        autoprefixer: {
            options: {
                browsers: ['last 1 version']
            },
            dist: {
                files: [{
                    expand: true,
                    cwd: '.tmp/styles/',
                    src: '{,*/}*.css',
                    dest: '.tmp/styles/'
                }]
            }
        },

        // Automatically inject Bower components into the HTML file
        bowerInstall: {
            app: {
                src: ['<%= config.app %>/index.html'],
                ignorePath: '<%= config.app %>/'
            }
        },

        // Renames files for browser caching purposes
        rev: {
            dist: {
                files: {
                    src: [
                        '<%= config.dist %>/scripts/{,*/}*.js',
                        '<%= config.dist %>/styles/{,*/}*.css',
                        '<%= config.dist %>/images/{,*/}*.*',
                        '<%= config.dist %>/styles/fonts/{,*/}*.*',
                        '<%= config.dist %>/*.{ico,png}'
                    ]
                }
            }
        },

        // Reads HTML for usemin blocks to enable smart builds that automatically
        // concat, minify and revision files. Creates configurations in memory so
        // additional tasks can operate on them
        useminPrepare: {
            options: {
                dest: '<%= config.dist %>'
            },
            html: '<%= config.app %>/index.html'
        },

        // Performs rewrites based on rev and the useminPrepare configuration
        usemin: {
            options: {
                assetsDirs: ['<%= config.dist %>', '<%= config.dist %>/images']
            },
            html: ['<%= config.dist %>/{,*/}*.html'],
            css: ['<%= config.dist %>/styles/{,*/}*.css']
        },

        // The following *-min tasks produce minified files in the dist folder
        imagemin: {
            dist: {
                files: [{
                    expand: true,
                    cwd: '<%= config.app %>/images',
                    src: '{,*/}*.{gif,jpeg,jpg,png}',
                    dest: '<%= config.dist %>/images'
                }]
            }
        },

        svgmin: {
            dist: {
                files: [{
                    expand: true,
                    cwd: '<%= config.app %>/images',
                    src: '{,*/}*.svg',
                    dest: '<%= config.dist %>/images'
                }]
            }
        },

        htmlmin: {
            dist: {
                options: {
                    collapseBooleanAttributes: true,
                    collapseWhitespace: true,
                    removeAttributeQuotes: true,
                    removeCommentsFromCDATA: true,
                    removeEmptyAttributes: true,
                    removeOptionalTags: true,
                    removeRedundantAttributes: true,
                    useShortDoctype: true
                },
                files: [{
                    expand: true,
                    cwd: '<%= config.dist %>',
                    src: '{,*/}*.html',
                    dest: '<%= config.dist %>'
                }]
            }
        },

        // By default, your `index.html`'s <!-- Usemin block --> will take care of
        // minification. These next options are pre-configured if you do not wish
        // to use the Usemin blocks.
        // cssmin: {
        //     dist: {
        //         files: {
        //             '<%= config.dist %>/styles/main.css': [
        //                 '.tmp/styles/{,*/}*.css',
        //                 '<%= config.app %>/styles/{,*/}*.css'
        //             ]
        //         }
        //     }
        // },
        // uglify: {
        //     dist: {
        //         files: {
        //             '<%= config.dist %>/scripts/scripts.js': [
        //                 '<%= config.dist %>/scripts/scripts.js'
        //             ]
        //         }
        //     }
        // },
        // concat: {
        //     dist: {}
        // },

        // Copies remaining files to places other tasks can use
        copy: {
            dist: {
                files: [{
                    expand: true,
                    dot: true,
                    cwd: '<%= config.app %>',
                    dest: '<%= config.dist %>',
                    src: [
                        '*.{ico,png,txt}',
                        '.htaccess',
                        'images/{,*/}*.webp',
                        '{,*/}*.html',
                        'styles/fonts/{,*/}*.*',
                        'bower_components/bootstrap/dist/fonts/*.*'
                    ]
                }]
            },
            styles: {
                expand: true,
                dot: true,
                cwd: '<%= config.app %>/styles',
                dest: '.tmp/styles/',
                src: '{,*/}*.css'
            }
        },

        // Run some tasks in parallel to speed up build process
        concurrent: {
            server: [
                'copy:styles'
            ],
            test: [
                'copy:styles'
            ],
            dist: [
                'copy:styles',
                'imagemin',
                'svgmin'
            ]
        }
    });

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

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

    grunt.registerTask('server', function (target) {
        grunt.log.warn('The `server` task has been deprecated. Use `grunt serve` to start a server.');
        grunt.task.run([target ? ('serve:' + target) : 'serve']);
    });

    grunt.registerTask('test', function (target) {
        if (target !== 'watch') {
            grunt.task.run([
                'clean:server',
                'concurrent:test',
                'autoprefixer'
            ]);
        }

        grunt.task.run([
            'connect:test',
            'mocha'
        ]);
    });

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

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

这是系统默认生成的，当时我选择的是bootstrap。
可以看到，文件中的每个配置项都是一个task，并且没一个task都是需要下载grunt插件的。
require('load-grunt-tasks')(grunt);

这段代码很重要，他会找到项目下的node_modules文件夹，把其中的grunt插件全部引入。
接下来便可以执行grunt serve命令了
grunt.registerTask('serve', function (target) {
        if (target === 'dist') {
            return grunt.task.run(['build', 'connect:dist:keepalive']);
        }

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

可以看到这个serve命令还接受一个参数target，如果执行grunt serve dist 就会执行build task还有connect下的dist下的 keeplive task。
如果不传参数，正常执行if外面的命令，最后也个watch task很关键，会启动一个临时server来给你debug用，会监听你的每个文件是否改变来刷新你的浏览器（livereload task配置相
关），很智能吧。

Yeoman Grunt Bower配置相关

后来我去掉了concurrent任务中的compass后面的server,直接运行本地compass就可以正常打包css到.tmp目录了.

// Generated on 2015-12-09 using generator-angular 0.14.0
'use strict';

// # Globbing
// for performance reasons we're only matching one level down:
// 'test/spec/{,*/}*.js'
// use this if you want to recursively match all subfolders:
// 'test/spec/**/*.js'

module.exports = function (grunt) {

  // Time how long tasks take. Can help when optimizing build times
  require('time-grunt')(grunt);

  // Automatically load required Grunt tasks
  require('jit-grunt')(grunt, {
    useminPrepare: 'grunt-usemin',
    ngtemplates: 'grunt-angular-templates',
    cdnify: 'grunt-google-cdn'
  });

  // Configurable paths for the application
  var appConfig = {
    app: require('./bower.json').appPath || 'app',
    dist: 'dist'
  };

  // Define the configuration for all the tasks
  grunt.initConfig({

    // Project settings
    yeoman: appConfig,

    // Watches files for changes and runs tasks based on the changed files
    watch: {
      bower: {
        files: ['bower.json'],
        tasks: ['wiredep']
      },
      js: {
        files: ['<%= yeoman.app %>/js/{,*/,*/*/}*.js'],
        tasks: ['newer:jshint:all', 'newer:jscs:all'],
        options: {
          livereload: '<%= connect.options.livereload %>'
        }
      },
      jsTest: {
        files: ['test/spec/{,*/}*.js'],
        tasks: ['newer:jshint:test', 'newer:jscs:test', 'karma']
      },
      compass: {
        files: ['<%= yeoman.app %>/css/{,*/,*/*/}*.{scss,sass}'],
        tasks: ['compass:server', 'postcss:server']
      },
      gruntfile: {
        files: ['Gruntfile.js']
      },
      livereload: {
        options: {
          livereload: '<%= connect.options.livereload %>'
        },
        files: [
          '<%= yeoman.app %>/{,*/,*/*/}*.html',
          '.tmp/css/{,*/}*.css',
          '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
        ]
      }
    },

    // The actual grunt server settings
    connect: {
      options: {
        port: ,
        // Change this to '0.0.0.0' to access the server from outside.
        hostname: 'localhost',
        livereload:
      },
      livereload: {
        options: {
          open: true,
          middleware: function (connect) {
            return [
              connect.static('.tmp'),
              connect().use(
                '/bower_components',
                connect.static('./bower_components')
              ),
              connect().use(
                '/app/css',
                connect.static('./app/css')
              ),
              connect.static(appConfig.app)
            ];
          }
        }
      },
      test: {
        options: {
          port: ,
          middleware: function (connect) {
            return [
              connect.static('.tmp'),
              connect.static('test'),
              connect().use(
                '/bower_components',
                connect.static('./bower_components')
              ),
              connect.static(appConfig.app)
            ];
          }
        }
      },
      dist: {
        options: {
          open: true,
          base: '<%= yeoman.dist %>'
        }
      }
    },

    // Make sure there are no obvious mistakes
    jshint: {
      options: {
        jshintrc: '.jshintrc',
        reporter: require('jshint-stylish')
      },
      all: {
        src: [
          'Gruntfile.js',
          '<%= yeoman.app %>/js/{,*/}*.js'
        ]
      },
      test: {
        options: {
          jshintrc: 'test/.jshintrc'
        },
        src: ['test/spec/{,*/}*.js']
      }
    },

    // Make sure code styles are up to par
    jscs: {
      options: {
        config: '.jscsrc',
        verbose: true
      },
      all: {
        src: [
          'Gruntfile.js',
          '<%= yeoman.app %>/js/{,*/}*.js'
        ]
      },
      test: {
        src: ['test/spec/{,*/}*.js']
      }
    },

    // Empties folders to start fresh
    clean: {
      dist: {
        files: [{
          dot: true,
          src: [
            '.tmp',
            '<%= yeoman.dist %>/{,*/}*',
            '!<%= yeoman.dist %>/.git{,*/}*'
          ]
        }]
      },
      server: '.tmp'
    },

    // Add vendor prefixed styles
    postcss: {
      options: {
        processors: [
          require('autoprefixer-core')({browsers: ['last 1 version']})
        ]
      },
      server: {
        options: {
          map: true
        },
        files: [{
          expand: true,
          cwd: '.tmp/css/',
          src: '{,*/}*.css',
          dest: '.tmp/css/'
        }]
      },
      dist: {
        files: [{
          expand: true,
          cwd: '.tmp/css/',
          src: '{,*/}*.css',
          dest: '.tmp/css/'
        }]
      }
    },

    // Automatically inject Bower components into the app
    wiredep: {
      app: {
        src: ['<%= yeoman.app %>/index.html'],
        ignorePath:  /\.\.\//
      },
      test: {
        devDependencies: true,
        src: '<%= karma.unit.configFile %>',
        ignorePath:  /\.\.\//,
        fileTypes:{
          js: {
            block: /(([\s\t]*)\/{}\s*?bower:\s*?(\S*))(\n|\r|.)*?(\/{}\s*endbower)/gi,
              detect: {
                js: /'(.*\.js)'/gi
              },
              replace: {
                js: '\'{{filePath}}\','
              }
            }
          }
      },
      sass: {
        src: ['<%= yeoman.app %>/css/{,*/}*.{scss,sass}'],
        ignorePath: /(\.\.\/){,}bower_components\//
      }
    },

    // Compiles Sass to CSS and generates necessary files if requested
    compass: {
      options: {
        sassDir: '<%= yeoman.app %>/css',
        cssDir: '.tmp/css',
        generatedImagesDir: '.tmp/images/generated',
        imagesDir: '<%= yeoman.app %>/images',
        javascriptsDir: '<%= yeoman.app %>/js',
        fontsDir: '<%= yeoman.app %>/css/fonts',
        importPath: './bower_components',
        httpImagesPath: '/images',
        httpGeneratedImagesPath: '/images/generated',
        httpFontsPath: '/css/fonts',
        relativeAssets: false,
        assetCacheBuster: false,
        raw: 'Sass::Script::Number.precision = 10\n'
      },
      dist: {
        options: {
          generatedImagesDir: '<%= yeoman.dist %>/images/generated'
        }
      },
      server: {
        options: {
          sourcemap: true
        }
      }
    },

    // Renames files for browser caching purposes
    filerev: {
      dist: {
        src: [
          '<%= yeoman.dist %>/js/{,*/}*.js',
          '<%= yeoman.dist %>/css/{,*/}*.css',
          '<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}',
          '<%= yeoman.dist %>/css/fonts/*'
        ]
      }
    },

    // Reads HTML for usemin blocks to enable smart builds that automatically
    // concat, minify and revision files. Creates configurations in memory so
    // additional tasks can operate on them
    useminPrepare: {
      html: '<%= yeoman.app %>/index.html',
      options: {
        dest: '<%= yeoman.dist %>',
        flow: {
          html: {
            steps: {
              js: ['concat', 'uglifyjs'],
              css: ['cssmin']
            },
            post: {}
          }
        }
      }
    },

    // Performs rewrites based on filerev and the useminPrepare configuration
    usemin: {
      html: ['<%= yeoman.dist %>/{,*/,*/*/}*.html'],
      css: ['<%= yeoman.dist %>/css/{,*/}*.css'],
      js: ['<%= yeoman.dist %>/js/{,*/}*.js'],
      options: {
        assetsDirs: [
          '<%= yeoman.dist %>',
          '<%= yeoman.dist %>/images',
          '<%= yeoman.dist %>/css'
        ],
        patterns: {
          js: [[/(images\/[^''""]*\.(png|jpg|jpeg|gif|webp|svg))/g, 'Replacing references to images']]
        }
      }
    },

    // The following *-min tasks will produce minified files in the dist folder
    // By default, your `index.html`'s <!-- Usemin block --> will take care of
    // minification. These next options are pre-configured if you do not wish
    // to use the Usemin blocks.
    cssmin: {
       dist: {
         files: {
           '<%= yeoman.dist %>/css/main.css': [
             '.tmp/css/{,*/}*.css'
           ]
         }
       },
      options: {
        rebase: false
      }
    },
    uglify: {
      options: {
        mangle: false
      }
    },
    concat: {
       dist: {}
    },

    imagemin: {
      dist: {
        files: [{
          expand: true,
          cwd: '<%= yeoman.app %>/images',
          src: '{,*/}*.{png,jpg,jpeg,gif}',
          dest: '<%= yeoman.dist %>/images'
        }]
      }
    },

    svgmin: {
      dist: {
        files: [{
          expand: true,
          cwd: '<%= yeoman.app %>/images',
          src: '{,*/}*.svg',
          dest: '<%= yeoman.dist %>/images'
        }]
      }
    },

    htmlmin: {
      dist: {
        options: {
          collapseWhitespace: true,
          conservativeCollapse: true,
          collapseBooleanAttributes: true,
          removeCommentsFromCDATA: true
        },
        files: [{
          expand: true,
          cwd: '<%= yeoman.dist %>',
          src: ['{*,*/,*/*/}*.html'],
          dest: '<%= yeoman.dist %>'
        }]
      }
    },

    ngtemplates: {
      dist: {
        options: {
          module: 'warrantyProcessApp',
          htmlmin: '<%= htmlmin.dist.options %>',
          usemin: 'js/scripts.js'
        },
        cwd: '<%= yeoman.app %>',
        src: 'html/{,*/,*/*/}.html',
        dest: '.tmp/templateCache.js'
      }
    },

    // ng-annotate tries to make the code safe for minification automatically
    // by using the Angular long form for dependency injection.
    ngAnnotate: {
      dist: {
        files: [{
          expand: true,
          cwd: '.tmp/concat/js',
          src: '*.js',
          dest: '.tmp/concat/js'
        }]
      }
    },

    // Replace Google CDN references
    cdnify: {
      dist: {
        html: ['<%= yeoman.dist %>/*.html']
      }
    },

    // Copies remaining files to places other tasks can use
    copy: {
      dist: {
        files: [{
          expand: true,
          dot: true,
          cwd: '<%= yeoman.app %>',
          dest: '<%= yeoman.dist %>',
          src: [
            '*.{ico,png,txt}',
            '*.html',
            'html/{,*/,*/*/}*.html',
            'images/{,*/}*.{webp}',
            'css/fonts/{,*/}*.*',
            'languages/{,*/}*.json',
            '.htaccess'
          ]
        }, {
          expand: true,
          cwd: '.tmp/images',
          dest: '<%= yeoman.dist %>/images',
          src: ['generated/*']
        }, {
          expand: true,
          cwd: '.',
          src: 'bower_components/bootstrap-sass-official/assets/fonts/bootstrap/*',
          dest: '<%= yeoman.dist %>'
        }]
      },
      styles: {
        expand: true,
        cwd: '<%= yeoman.app %>/css',
        dest: '.tmp/css/',
        src: '{,*/}*.css'
      }
    },

    // Run some tasks in parallel to speed up the build process
    concurrent: {
      server: [
        'compass:server'
      ],
      test: [
        'compass'
      ],
      dist: [
        'compass:dist',
        'imagemin',
        'svgmin'
      ]
    },

    ngdocs: {
       options: {
           dest: 'docs',
           html5Mode: false,
           scripts: [
               'bower_components/angular/angular.js',
               'bower_components/angular-animate/angular-animate.js'
           ]
       },
       api: {
           src: ['app/**/*.js', '!app/**/*-spec.js'],
           title: 'Docs'
       }
   },

    // Test settings
    karma: {
      unit: {
        configFile: 'test/karma.conf.js',
        singleRun: true
      }
    }
  });

  grunt.registerTask('serve', 'Compile then start a connect web server', function (target) {
    if (target === 'dist') {
      return grunt.task.run(['build', 'connect:dist:keepalive']);
    }

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

  grunt.registerTask('server', 'DEPRECATED TASK. Use the "serve" task instead', function (target) {
    grunt.log.warn('The `server` task has been deprecated. Use `grunt serve` to start a server.');
    grunt.task.run(['serve:' + target]);
  });

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

  grunt.registerTask('build', [
    'clean:dist',
    'wiredep',
    'useminPrepare',
    'concurrent:dist',
    'postcss',
    'ngtemplates',
    'concat',
    'ngAnnotate',
    'copy:dist',
    'cdnify',
    'cssmin',
    'uglify',
    'filerev',
    'usemin',
    'htmlmin'
  ]);

  grunt.loadNpmTasks('grunt-html-validation');

  grunt.registerTask('default', [
    'newer:jshint',
    'newer:jscs',
    'test',
    'build',
    'validation'
  ]);
};

gruntfile.js

不知道为什么其他人可以直接server去打包,反正我是不可以.