Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

How to handle require.js in v2.0 ? #112

Closed
sleeper opened this Issue May 11, 2013 · 27 comments

Comments

Projects
None yet
Contributor

sleeper commented May 11, 2013

In the scope of usemin 2.0, I'm rewriting part of grunt-usemin ... One question that keeps bothering me is how to handle require.js.

Actually require.js is installed by bower in app/components/requirejs/require.js, but then how to handle it:

  1. Have it go through the standard flow (concat -> uglifyjs), and have it concatenated to other files
  2. Add it to the copy target, and copied to scripts/vendor/require.js

I would tend to say that 2 is better but would really like to ear from you (also taking into account I do not know require.js vey well).

Member

paulirish commented May 11, 2013

Throw a warning?

IMO require.js should never be shipped to users. Every AMD app should take a trip through grunt-require to send the app through r.js and almond in place.

Owner

addyosmani commented May 12, 2013

I completely agree with Paul on this one. There's no reason require.js should be shipping with your app. R.js and Almond alleviate this need sufficiently.

Contributor

sleeper commented May 12, 2013

So are we saying that we need to deprecate the use of require.js within blocks and fail if any are present ?

Member

paulirish commented May 12, 2013

the softer option: throw a big ass warning. and tell people how to handle
this, but let it continue.

i'm in favor of the more draconian failure mode, to be honest.

On Sun, May 12, 2013 at 6:48 AM, Frederick Ros notifications@github.comwrote:

So are we saying that we need to deprecate the use of require.js within
blocks and fail if any are present ?


Reply to this email directly or view it on GitHubhttps://github.com/yeoman/grunt-usemin/issues/112#issuecomment-17778190
.

Contributor

sleeper commented May 12, 2013

To be honest, I'm on your side: this is one of the features I like the most with Go: no warnings, only errors.
I can fail early and give advice on how to fix this. I just need to read a little bit more about require.js, r.js and so on ...

Contributor

sleeper commented May 14, 2013

So, my proposal:

  1. Deprecate use of require.js in blocks, e.g.
<!-- build:js js/app.min.js -->
<script data-main="js/main" src="js/vendor/require.js"></script>
<!-- -->
  1. Stop the processing in case such a block is found and indicate to use to use grunt-requirejs

Does everyone agree on this ?

Member

paulirish commented May 14, 2013

Yup. Let's give it a go.

Best if we can also point to a doc page on the yeoman site on how to do
this effectively and why shipping require.js is not recommended.

On Mon, May 13, 2013 at 8:22 PM, Frederick Ros notifications@github.comwrote:

So, my proposal:

  1. Deprecate use of require.js in blocks, e.g. html <script data-main="js/main" src="js/vendor/require.js"></script>
  2. Stop the processing in case such a block is found and indicate to
    use to use grunt-requirejs

Does everyone agree on this ?


Reply to this email directly or view it on GitHubhttps://github.com/yeoman/grunt-usemin/issues/112#issuecomment-17854717
.

Contributor

sleeper commented May 14, 2013

Ok. This is my next task ;)

Could someone hep me on the redaction of the 'why shipping require.js is not recommended' (at least get the cons ;))
As said, I'm not using require.js nor use it beyond setting the conf in Grunt ;)

Owner

sindresorhus commented May 15, 2013

Sgtm.

Sorry for the mass mention but I would like to be sure this is the right move:
@thomaswelton @robdodson @passy @mlatief @iammerrick @alejandrogarciaiglesias @satazor

@sindresorhus thanks for joining me. I agree with @paulirish and @addyosmani on not shipping RequireJS and optimizing through r.js + almond for the dist build. I'm currently working with grunt-contrib-requirejs + almond and everything works like a charm. But i think that maybe using Yeoman in dev server mode should leave the require.js script tag with the data-main attribute... It may improve regarde/watch rebuild times? Does that makes sense?
As with everything, solution should be simple :)

Member

passy commented May 15, 2013

+1 for fast failing. If we have a chance to educate the user, let's use it!

Contributor

sleeper commented May 15, 2013

@alejandrogarciaiglesias Agreed for the development mode. When I said fast failing this is if the require.js is within a block and only here.

I haven't yet used usemin as our server code generates and bootstraps our initial page, that being said this project looks sweet and I'll take a look at using it for my next project.

However, I hate to disagree with the legends @addyosmani & @paulirish on this one but I think it is a dangerous move to assume that using almond is always the best move... And error is extreme, perhaps a warning? In our application we use grunt-contrib-requirejs to build different submodules and then we run some static analysis to make sure the modules are optimized properly (no duplicates across built modules). Then we lazily load the modules as necessary.

To assume that all apps should be fine without lazily loading code is a dangerous move particularly when you are talking about apps that are using a module system (usually they are bigger and consequently are more likely to require lazy loading code). It's not just the lazy loading of code, but code that uses multiple requirejs configurations or sub contexts. Just saying, "you must only use almond" tosses away a lot of the power and compelling reasons for using Require.js.

@iammerrick Agreed, this setup using lazy loading sub-modules is also the way I currently work in a project.

Contributor

sleeper commented Jul 26, 2013

Support dropped.

@sleeper sleeper closed this Jul 26, 2013

I can't really figure out the right way to make grunt-contrib-requirejs to call almond and work with grunt-usemin v2. No matter how I try, I can't get usemin to process my almondified main.js .

I wouldn't dare to ask you if I hadn't researched quite a lot on my own before.

Could you please provide some simple instructions on how you do it? I have really no clue on what needs to be changed in the workflow now that usemin doesn't support requirejs build blocks. My previous workflow is based on two-month old generator-webapp Gruntfile but I would want to use the new feature in grunt-usemin v2.

So, is there a best practice for using grunt-usemin and grunt-contrib-requirejs?

What I am doing for now:

    1. In the development mode, use requirejs to load all the dependences
<!-- build:js /static/scripts/all.js -->
        <script src="static/bower_components/requirejs/require.js"></script>
        <script src="static/scripts/require.config.js"></script>
        <script src="static/scripts/main.js"></script>
<!-- endbuild -->
    1. In the production mode, use grunt-usemin to concat these js files into all.js, then use grunt-contrib-requirejs to overwrite all.js
requirejs:{
    main: {
        options: {
            name: '../bower_components/almond/almond',
            include: 'main',
            out: '<%= grunt.bbt.dist %>/static/scripts/all.js'
        }
    }
}

Any suggestion?

Best if we can also point to a doc page on the yeoman site on how to do this effectively and why shipping require.js is not recommended.
@paulirish

was this doc page ever written?

I managed to use yeoman/grunt-bower-requirejs to generate a config file from my bower manifest.

// Automagically wire-up installed Bower components into your RequireJS config
bower: {
  raget: {
    rjsConfig: '<%= config.app %>/src/requireConfig.js'
  }
}

Then with grunt-contrib-requirejs

requirejs: {
  compile: {
    options: {
      baseUrl: '<%= config.app %>/src',
      mainConfigFile: '<%= config.app %>/src/requireConfig.js',
      name: 'almond',
      include: 'main',
      insertRequire: ['main'],
      out: '<%= config.dist %>/src/main.js',
      wrap: true
    }
  }
}

The only thing left is processing the reference in index.html and for my particular edge case concatenating my output with some shims prior to minifcation / cache busting.

Any suggestions?

amatiasq commented May 9, 2014

I don't understand the reason for this I have this HTML

<!-- build:js resources/build.js -->
<script
  src="resources/libs/requirejs/require.js"
  data-main="resources/app/app-config">
</script>
<!-- endbuild -->

With grunt I build my app with almond and save it on resources/build.js so this:

<script src="resources/build.js"></script>

And it works and I was not shipping require.js with my app. I didn't even knew usemin was aware I was using require.

Now I updated to usemin 2.1 and my build process doesn't work anymore.

Running "usemin:html" (usemin) task

Processing as HTML - index.html
Warning: require.js blocks are no more supported. Use --force to continue.

Aborted due to warnings.

Is there anything I can do to build my project now?

@amatiasq
What I am doing for now: #112 (comment)

Was there ever an article/tutorial created on this topic? I'm still a bit baffled as to why my single file build script is looking for my module dependencies when I run index.html out of /dist. I'll also get errors around "define is not defined".

I tried including requirejs as a path, but that appears to be actually including requirejs instead of going through the optimizer. I'm using grunt-requirejs and not grunt-contrib-requirejs (not sure what to use and when).

In my scenario, main.js contains my require.config paths.

Index.html

<!-- build:js js/main.js -->
    <script src="bower_components/requirejs/require.js"></script>
    <script src="js/main.js"></script>
<!-- endbuild -->

Grunt file:

'use strict';

module.exports = function(grunt) {

  require('time-grunt')(grunt);

  // load all grunt tasks
  require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);

  // configurable paths
  var yeomanConfig = {
    app: 'app',
    dist: 'dist'
  };
  var s3conf = grunt.file.readJSON('grunt-s3.json');

  grunt.initConfig({
    yeoman: yeomanConfig,
    watch: {
      stylus: {
        files: ['<%= yeoman.app %>/styl/**/*.styl'],
        tasks: ['stylus:server', 'autoprefixer']
      },
      styles: {
        files: ['<%= yeoman.app %>/css/{,*/}*.css'],
        tasks: ['copy:styles']
      },
      livereload: {
        options: {
          livereload: '<%= connect.options.livereload %>'
        },
        files: [
          '<%= yeoman.app %>/*.html',
          '<%= yeoman.app %>/css/**/*.css',
          '<%= yeoman.app %>/js/{,*/}*.js',
          '<%= yeoman.app %>/img/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
        ]
      }
    },
    connect: {
      options: {
        port: 9000,
        livereload: 35729,
        hostname: '0.0.0.0'
      },
      livereload: {
        options: {
          open: true,
          base: [
            '.tmp',
            '<%= yeoman.app %>'
          ]
        }
      },
      test: {
        options: {
          port: 9001,
          base: [
            'test',
            '<%= yeoman.app %>'
          ]
        }
      },
      dist: {
        options: {
          open: true,
          base: '<%= yeoman.dist %>',
          livereload: false
        }
      }
    },
    clean: {
      dist: {
        files: [{
          dot: true,
          src: [
            '<%= yeoman.dist %>/*',
            '!<%= yeoman.dist %>/.git*'
          ]
        }]
      }
    },
    jshint: {
      options: {
        jshintrc: '.jshintrc',
        reporter: require('jshint-stylish'),
        force: false
      },
      all: [
        'Gruntfile.js',
        '<%= yeoman.app %>/js/{,*/}*.js',
        '!<%= yeoman.app %>/js/vendor/*',
        'test/spec/{,*/}*.js'
      ]
    },
    requirejs: {
      /*dist: {
        options: {
          baseUrl: '<%= yeoman.app %>/js',
          mainConfigFile: '<%= yeoman.app %>/js/main.js',
          name: 'main',
          out: '.tmp/concat/js/main.js',
          optimize: 'none',
          preserveLicenseComments: false,
          useStrict: true,
          wrap: true,
          mangle: false,
          paths: {
            massrelPlatform: 'empty:',
            twitter: 'empty:',
            facebook: 'empty:'
          }
        }
      },*/
      dist: {
        options: {
          baseUrl: '<%= yeoman.app %>/js',
          name: 'main',
          mainConfigFile: '<%= yeoman.app %>/js/main.js',
          out: '.tmp/concat/js/main.js',
          optimize: 'none',
          preserveLicenseComments: false,
          useStrict: true,
          wrap: true,
          mangle: false,
          paths: {
            // requirejs: '../bower_components/requirejs/require',
            twitter: 'empty:',
            facebook: 'empty:'
          },
          // include: 'requirejs'
        }
      }
    },
    concat: {
      // dist: {
      // src: '<%= yeoman.app %>/js/{,*/}*.js',
      // dest: '.tmp/concat/js/main.js',
      // files: {
      //     // '<%= config.dist %>/scripts/require.js': [
      //     //     '<%= config.app %>/scripts/**/*'
      //     // ]
      // }
      // }
    },
    rev: {
      dist: {
        files: {
          src: [
            '<%= yeoman.dist %>/js/{,*/}*.js',
            '<%= yeoman.dist %>/css/{,*/}*.css',
            // '<%= yeoman.dist %>/img/{,*/}*.{png,jpg,jpeg,gif,webp}',
            '<%= yeoman.dist %>/css/fonts/*',
            '!<%= yeoman.dist %>/js/vendor/modernizr.custom.13832.js'
          ]
        }
      }
    },
    useminPrepare: {
      options: {
        dest: '<%= yeoman.dist %>'
      },
      html: [
        '<%= yeoman.app %>/index.html',
        '!<%= yeoman.app %>/404.html'
      ]
    },
    usemin: {
      options: {
        dirs: ['<%= yeoman.dist %>']
      },
      html: ['<%= yeoman.dist %>/{,*/}*.html'],
      css: ['<%= yeoman.dist %>/css/{,*/}*.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,png,txt}',
            'img/**',
            'data/**',
            'css/font/*'
          ]
        }]
      },
      styles: {
        expand: true,
        dot: true,
        cwd: '<%= yeoman.app %>/css',
        dest: '.tmp/css/',
        src: '{,*/}*.css'
      }
    },
    autoprefixer: {
      options: {
        browsers: ['last 2 version']
      },
      predist: {
        files: [{
          expand: true,
          src: '<%= yeoman.app %>/css/*.css'
          // dest: '<%= yeoman.app %>/css/'
        }]
      }
    },
    stylus: {
      dist: {
        files: {
          '<%= yeoman.app %>/css/main.css': '<%= yeoman.app %>/styl/**/*.styl'
        }
      },
      server: {
        options: {
          compress: false
        },
        files: {
          '<%= yeoman.app %>/css/main.css': '<%= yeoman.app %>/styl/**/*.styl'
        }
      }
    },
    uncss: {
      dist: {
        options: {
          stylesheets: ['../.tmp/concat/css/main.css']
        },
        files: {
          '.tmp/concat/css/main.css': ['<%= yeoman.dist %>/*.html']
        }
      }
    },
    uglify: {
      dist: {
        files: {
          '<%= yeoman.dist %>/js/main.js': ['<%= yeoman.dist %>/js/main.js']
        }
      },
    },
    concurrent: {
      options: {
        logConcurrentOutput: false,
        limit: 4
      },
      server: [
        'stylus:server',
        'htmlmin'
      ],
      test: [],
      dist: [
        'stylus:dist',
        'copy:styles',
        'htmlmin'
      ]
    },
    bower: {
      options: {
        exclude: ['modernizr']
      },
      all: {
        rjsConfig: '<%= yeoman.app %>/js/main.js'
      }
    },
    s3: {
      options: s3conf.options,
      staging: s3conf.staging,
      production: s3conf.production
    }
  });

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

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

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

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

  grunt.registerTask('deploy', function(target) {
    grunt.task.run([
      'default'
    ]);

    if (target === 'staging') {
      return grunt.task.run(['s3:staging']);
    }

    if (target === 'production') {
      return grunt.task.run(['s3:production']);
    }

  });

};

I have the same issue from the default generator-backbone scaffolding.

index.html

<!-- build:js scripts/main.js -->
  <script data-main="scripts/main" src="bower_components/requirejs/require.js"></script>
<!-- endbuild -->

Gruntfile.js

'use strict';
var LIVERELOAD_PORT = 35729;
var SERVER_PORT = 9000;
var lrSnippet = require('connect-livereload')({port: LIVERELOAD_PORT});
var mountFolder = function (connect, dir) {
    return connect.static(require('path').resolve(dir));
};

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

module.exports = function (grunt) {
    // show elapsed time at the end
    require('time-grunt')(grunt);
    // load all grunt tasks
    require('load-grunt-tasks')(grunt);

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

    grunt.initConfig({
        yeoman: yeomanConfig,
        watch: {
            options: {
                nospawn: true,
                livereload: true
            },
            compass: {
                files: ['<%= yeoman.app %>/styles/{,**/}*.{scss,sass}'],
                tasks: ['compass']
            },
            livereload: {
                options: {
                    livereload: grunt.option('livereloadport') || LIVERELOAD_PORT
                },
                files: [
                    '<%= yeoman.app %>/*.html',
                    '{.tmp,<%= yeoman.app %>}/styles/{,*/}*.css',
                    '{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js',
                    '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp}',
                    '<%= yeoman.app %>/scripts/templates/*.{ejs,mustache,hbs}',
                    'test/spec/**/*.js'
                ]
            },
            jst: {
                files: [
                    '<%= yeoman.app %>/scripts/templates/*.ejs'
                ],
                tasks: ['jst']
            },
            test: {
                files: ['<%= yeoman.app %>/scripts/{,*/}*.js', 'test/spec/**/*.js'],
                tasks: ['test:true']
            }
        },
        connect: {
            options: {
                port: grunt.option('port') || SERVER_PORT,
                // 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: {
                    port: 9001,
                    middleware: function (connect) {
                        return [
                            lrSnippet,
                            mountFolder(connect, '.tmp'),
                            mountFolder(connect, 'test'),
                            mountFolder(connect, yeomanConfig.app)
                        ];
                    }
                }
            },
            dist: {
                options: {
                    middleware: function (connect) {
                        return [
                            mountFolder(connect, yeomanConfig.dist)
                        ];
                    }
                }
            }
        },
        open: {
            server: {
                path: 'http://localhost:<%= connect.options.port %>'
            },
            test: {
                path: 'http://localhost:<%= connect.test.options.port %>'
            }
        },
        clean: {
            dist: ['.tmp', '<%= yeoman.dist %>/*'],
            server: '.tmp'
        },
        jshint: {
            options: {
                jshintrc: '.jshintrc',
                reporter: require('jshint-stylish')
            },
            all: [
                'Gruntfile.js',
                '<%= yeoman.app %>/scripts/{,*/}*.js',
                '!<%= yeoman.app %>/scripts/vendor/*',
                'test/spec/{,*/}*.js'
            ]
        },
        mocha: {
            all: {
                options: {
                    run: true,
                    urls: ['http://localhost:<%= connect.test.options.port %>/index.html']
                }
            }
        },
        compass: {
            options: {
                sassDir: '<%= yeoman.app %>/styles',
                cssDir: '.tmp/styles',
                imagesDir: '<%= yeoman.app %>/images',
                javascriptsDir: '<%= yeoman.app %>/scripts',
                fontsDir: '<%= yeoman.app %>/styles/fonts',
                importPath: '<%= yeoman.app %>/bower_components',
                relativeAssets: true
            },
            dist: {},
            server: {
                options: {
                    debugInfo: true
                }
            }
        },
        requirejs: {
            dist: {
                // Options: https://github.com/jrburke/r.js/blob/master/build/example.build.js
                options: {
                    baseUrl: '<%= yeoman.app %>/scripts',
                    optimize: 'none',
                    paths: {
                        'templates': '../../.tmp/scripts/templates',
                        'jquery': '../../<%= yeoman.app %>/bower_components/jquery/dist/jquery',
                        'underscore': '../../<%= yeoman.app %>/bower_components/lodash/dist/lodash',
                        'backbone': '../../<%= yeoman.app %>/bower_components/backbone/backbone'
                    },
                    // TODO: Figure out how to make sourcemaps work with grunt-usemin
                    // https://github.com/yeoman/grunt-usemin/issues/30
                    //generateSourceMaps: true,
                    // required to support SourceMaps
                    // http://requirejs.org/docs/errors.html#sourcemapcomments
                    preserveLicenseComments: false,
                    useStrict: true,
                    wrap: true
                    //uglify2: {} // https://github.com/mishoo/UglifyJS2
                }
            }
        },
        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',
                    dest: '<%= yeoman.dist %>'
                }]
            }
        },
        copy: {
            dist: {
                files: [{
                    expand: true,
                    dot: true,
                    cwd: '<%= yeoman.app %>',
                    dest: '<%= yeoman.dist %>',
                    src: [
                        '*.{ico,txt}',
                        'images/{,*/}*.{webp,gif}',
                        'styles/fonts/{,*/}*.*',
                        'bower_components/sass-bootstrap/fonts/*.*'
                    ]
                }, {
                    src: 'node_modules/apache-server-configs/dist/.htaccess',
                    dest: '<%= yeoman.dist %>/.htaccess'
                }]
            }
        },
        bower: {
            all: {
                rjsConfig: '<%= yeoman.app %>/scripts/main.js'
            }
        },
        jst: {
            options: {
                amd: true
            },
            compile: {
                files: {
                    '.tmp/scripts/templates.js': ['<%= yeoman.app %>/scripts/templates/*.ejs']
                }
            }
        },
        rev: {
            dist: {
                files: {
                    src: [
                        '<%= yeoman.dist %>/scripts/{,*/}*.js',
                        '<%= yeoman.dist %>/styles/{,*/}*.css',
                        '<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp}',
                        '/styles/fonts/{,*/}*.*',
                        'bower_components/sass-bootstrap/fonts/*.*'
                    ]
                }
            }
        }
    });

    grunt.registerTask('createDefaultTemplate', function () {
        grunt.file.write('.tmp/scripts/templates.js', 'this.JST = this.JST || {};');
    });

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

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

        if (target === 'test') {
            return grunt.task.run([
                'clean:server',
                'createDefaultTemplate',
                'jst',
                'compass:server',
                'connect:test',
                'open:test',
                'watch'
            ]);
        }

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

    grunt.registerTask('test', function (isConnected) {
        isConnected = Boolean(isConnected);
        var testTasks = [
                'clean:server',
                'createDefaultTemplate',
                'jst',
                'compass',
                'connect:test',
                'mocha',
            ];

        if(!isConnected) {
            return grunt.task.run(testTasks);
        } else {
            // already connected so not going to connect again, remove the connect:test task
            testTasks.splice(testTasks.indexOf('connect:test'), 1);
            return grunt.task.run(testTasks);
        }
    });

    grunt.registerTask('build', [
        'clean:dist',
        'createDefaultTemplate',
        'jst',
        'compass:dist',
        'useminPrepare',
        'requirejs',
        'imagemin',
        'htmlmin',
        'concat',
        'cssmin',
        'uglify',
        'copy',
        'rev',
        'usemin'
    ]);

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

grunt build results in

Running "useminPrepare:html" (useminPrepare) task
Fatal error: require.js blocks are no more supported.

@DanielTate you can resolve the error?

@lauradaniela No I am no longer using usemin

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment