StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POGrunt usemin: concatenated JavaScript file not created
text
Body
copied!<p>I am using the <em>usemin</em> task in my Yeoman generator. In the HTML it looks like it has worked fine as the separate JavaScript files are replaced by a link to a single file. However, the file that is being referenced to has not been created. Am I missing a setting?</p> <p><strong>Gruntfile.js</strong></p> <pre><code>'use strict'; module.exports = function (grunt) { // load all grunt tasks require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks); // configurable paths var yeomanConfig = { app: 'app', dev: 'dev', dist: 'dist' }; grunt.initConfig({ yeoman: yeomanConfig, clean: { dist: { files: [{ dot: true, src: [ '.tmp', '<%%= yeoman.dist %>/*', '!<%%= yeoman.dist %>/.git*' ] }] } }, copy: { dev: { files: [ {expand: true, cwd: '<%%= yeoman.app %>', src: ['**', '!**/scss/**'], dest: '<%%= yeoman.dev %>'}, {expand: true, cwd: '<%%= yeoman.app %>/assets/scss/fonts', src: ['**'], dest: '<%%= yeoman.dev %>/assets/css/fonts'}, {expand: true, cwd: '<%%= yeoman.app %>/assets/bower_components/jquery', src: ['jquery.min.js'], dest: '<%%= yeoman.dev %>/assets/js/lib', rename: function (dest) { var jQConf = grunt.file.readJSON('app/assets/bower_components/jquery/bower.json'); return dest + '/jquery-' + jQConf.version + '.min.js'; }}, {expand: true, cwd: '<%%= yeoman.app %>/assets/bower_components/jquery-legacy', src: ['jquery.min.js'], dest: '<%%= yeoman.dev %>/assets/js/lib', rename: function (dest) { var jQLegConf = grunt.file.readJSON('app/assets/bower_components/jquery-legacy/.bower.json'); return dest + '/jquery-' + jQLegConf.version + '.min.js'; }}, // Only copy over the unminified migrate plugin {expand: true, cwd: '<%%= yeoman.app %>/assets/bower_components/jquery-migrate', src: ['jquery-migrate.js'], dest: '<%%= yeoman.dev %>/assets/js/lib', rename: function (dest) { var jqMigConf = grunt.file.readJSON('app/assets/bower_components/jquery-migrate/.bower.json'); return dest + '/jquery-migrate-' + jqMigConf.version + '.js'; }} ] }, dist: { files: [ {expand: true, cwd: '<%%= yeoman.app %>', src: ['**', '!**/scss/**', '!**/js/*.js', '!**/bower_components/**'], dest: '<%%= yeoman.dist %>'}, {expand: true, cwd: '<%%= yeoman.app %>/assets/scss/fonts', src: ['**'], dest: '<%%= yeoman.dist %>/assets/css/fonts'}, {expand: true, cwd: '<%%= yeoman.app %>/assets/bower_components/jquery', src: ['jquery.min.js'], dest: '<%%= yeoman.dist %>/assets/js/lib', rename: function (dest) { var jQConf = grunt.file.readJSON('app/assets/bower_components/jquery/bower.json'); return dest + '/jquery-' + jQConf.version + '.min.js'; }}, {expand: true, cwd: '<%%= yeoman.app %>/assets/bower_components/jquery-legacy', src: ['jquery.min.js'], dest: '<%%= yeoman.dist %>/assets/js/lib', rename: function (dest) { var jQLegConf = grunt.file.readJSON('app/assets/bower_components/jquery-legacy/.bower.json'); return dest + '/jquery-' + jQLegConf.version + '.min.js'; }}, // Only copy over the minified migrate plugin {expand: true, cwd: '<%%= yeoman.app %>/assets/bower_components/jquery-migrate', src: ['jquery-migrate.min.js'], dest: '<%%= yeoman.dist %>/assets/js/lib', rename: function (dest) { var jqMigConf = grunt.file.readJSON('app/assets/bower_components/jquery-migrate/.bower.json'); return dest + '/jquery-migrate-' + jqMigConf.version + '.min.js'; }} ] } }, compass: { dev: { options: { sassDir: '<%%= yeoman.app %>/assets/scss', cssDir: '<%%= yeoman.dev %>/assets/css', environment: 'development' } }, dist: { options: { sassDir: '<%%= yeoman.app %>/assets/scss', cssDir: '<%%= yeoman.dist %>/assets/css', environment: 'production' } } }, replace: { dev: { options: { patterns: [{ match: '/@jquery-migrate-local/g', replacement: function () { var jQMigConf = grunt.file.readJSON('app/assets/bower_components/jquery-migrate/.bower.json'); return 'assets/js/lib/jquery-migrate-' + jQMigConf.version + '.js'; }, expression: true }] } }, dist: { options: { patterns: [{ match: '/@jquery-cdn/g', replacement: function () { var jQConf = grunt.file.readJSON('app/assets/bower_components/jquery/bower.json'); return '//ajax.googleapis.com/ajax/libs/jquery/' + jQConf.version + '/jquery.min.js'; }, expression: true }, { match: '/@jquery-legacy-cdn/g', replacement: function () { var jQLegConf = grunt.file.readJSON('app/assets/bower_components/jquery-legacy/bower.json'); return '//ajax.googleapis.com/ajax/libs/jquery/' + jQLegConf.version + '/jquery.min.js'; }, expression: true }, { match: '/@jquery-local/g', replacement: function () { var jQConf = grunt.file.readJSON('app/assets/bower_components/jquery/bower.json'); return 'assets/js/lib/jquery-' + jQConf.version + '.min.js'; }, expression: true }, { match: '/@jquery-legacy-local/g', replacement: function () { var jQLegConf = grunt.file.readJSON('app/assets/bower_components/jquery-legacy/bower.json'); return 'assets/js/lib/jquery-' + jQLegConf.version + '.min.js'; }, expression: true }, { match: '/@jquery-migrate-local/g', replacement: function () { var jQMigConf = grunt.file.readJSON('app/assets/bower_components/jquery-migrate/.bower.json'); return 'assets/js/lib/jquery-migrate-' + jQMigConf.version + '.min.js'; }, expression: true }] }, files: [ {src: ['app/index.html'], dest: 'app/index.html'} ] } }, processhtml: { dev: { files: { '<%%= yeoman.dev %>/index.html': ['<%%= yeoman.app %>/index.html'] } }, dist: { options: { data: { message: '.min' } }, files: { '<%%= yeoman.dist %>/index.html': ['<%%= yeoman.app %>/index.html'] } } }, useminPrepare: { html: '<%%= yeoman.app %>/index.html', options: { dest: '<%= yeoman.dist %>' } }, usemin: { options: { dirs: ['<%%= yeoman.dist %>'] }, html: ['**/*.html'], css: ['**/*.css'] } }); grunt.registerTask('server', []); grunt.registerTask('dev', [ 'clean', 'copy:dev', 'compass:dev', 'replace' ]); grunt.registerTask('build', [ 'clean', 'copy:dist', 'compass:dist', 'replace:dist', 'useminPrepare', 'usemin' ]); }; </code></pre> <p><strong>index.html</strong></p> <pre><code> <script src="assets/js/variables.js"></script> <script src="assets/js/functions.js"></script> <script src="assets/js/script.js"></script> <script src="assets/js/events.js"></script>  </code></pre> <p><strong>terminal process message</strong></p> <pre><code>Running "useminPrepare:html" (useminPrepare) task Going through app/index.html to update the config Looking for build script HTML comment blocks Found a block:  <script src="assets/bower_components/selectivizr/selectivizr.js"></script> <script src="assets/bower_components/respond/respond.src.js"></script>  Updating config with the following assets: - app/assets/bower_components/selectivizr/selectivizr.js - app/assets/bower_components/respond/respond.src.js Found a block:  <script src="assets/js/variables.js"></script> <script src="assets/js/functions.js"></script> <script src="assets/js/script.js"></script> <script src="assets/js/events.js"></script>  Updating config with the following assets: - app/assets/js/variables.js - app/assets/js/functions.js - app/assets/js/script.js - app/assets/js/events.js Configuration is now: cssmin: {} concat: { 'dist/assets/js/lteie8.main.js': [ 'app/assets/bower_components/selectivizr/selectivizr.js', 'app/assets/bower_components/respond/respond.src.js' ], 'dist/assets/js/main.js': [ 'app/assets/js/variables.js', 'app/assets/js/functions.js', 'app/assets/js/script.js', 'app/assets/js/events.js' ] } uglify: { 'dist/assets/js/lteie8.main.js': 'dist/assets/js/lteie8.main.js', 'dist/assets/js/main.js': 'dist/assets/js/main.js' } requirejs: {} </code></pre> <p>Results in (HTML): <code><script src="assets/js/main.js"></script></code> but no <em>main.js</em> file created</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload