Grunt-include-source + usemin don't work together

Question

I was following this SO answer How to include scripts automatically in a yeoman/grunt project? how to include all js files from scripts folder via the usemin plugin. After I've added the grunt-include-source plugin, the usemin fails to replace the generated script block with correct concated+minified script, the block is only removed or just filled with the source tags.

The source in the index.html is as this:

<!-- build:js(.) scripts/vendor.js -->
<!-- bower:js -->
<!-- endbower -->
<!-- endbuild -->

<!-- build:js({.tmp,app}) scripts/scripts.js -->
<!-- include: "type": "js", "files": "scripts/**/*.js" -->
<!-- endbuild -->

After the grunt-include-source and grunt-wiredep is the code as this:

<!-- build:js(.) scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/es5-shim/es5-shim.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/json3/lib/json3.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<!-- endbower -->
<!-- endbuild -->

<!-- build:js({.tmp,app}) scripts/scripts.js -->
<script src="scripts/app.js"></script>
<script src="scripts/controllers/about.js"></script>
<script src="scripts/controllers/company/list.js"></script>
<script src="scripts/controllers/dashboard/main.js"></script>
... more ...
<!-- endbuild -->

I'm using the grunt-wiredep plugin, which is run after the grunt-include-source and before the grunt-usemin, this code is replaced correctly.

The output should be:

<script src="scripts/vendor.1e81ad0a.js"></script>
<script src="scripts/scripts.1e82ad0a.js"></script>

But is only:

<script src="scripts/vendor.1e81ad0a.js"></script>

<!-- build:js({.tmp,app}) scripts/scripts.js -->
<script src="scripts/app.js"></script>
<script src="scripts/controllers/about.js"></script>
<script src="scripts/controllers/company/list.js"></script>
<script src="scripts/controllers/dashboard/main.js"></script>
... more ...
<!-- endbuild -->

Does anybody has any solution for this issue?

Thanks in advance, Michal

I found a workaround to this issue. I refused to use the grunt-include-source plugin and replaced it with the [grunt-file-blocks](https://github.com/rrharvey/grunt-file-blocks/). This works perfect with the grunt-usemin. — Michal Skala, Sep 15 '14 at 06:45

score 1 · Accepted Answer · answered Oct 02 '14 at 15:43

1

In the task: 'copy:dist' comment the copy of the html so the good index.html (after includesource has run) wont get overridden with index.html from the app again

copy: {
      dist: {
        files: [{
          expand: true,
          dot: true,
          cwd: '<%= yeoman.app %>',
          dest: '<%= yeoman.dist %>',
          src: [
            '*.{ico,png,txt}',
            '.htaccess',
            //'*.html',
            'views/{,*/}*.html',
            'images/{,*/}*.{webp}',
            'fonts/*'
          ]
        }

answered Oct 02 '14 at 15:43

Avie

66
2

I just want to add some info here because it wasn't clear to me without a context. If you look at this answer https://stackoverflow.com/questions/21232889/how-to-include-scripts-automatically-in-a-yeoman-grunt-project/21363346#21363346 The include source config have a dist property that instructs the plugin to include sources from app/index.html to dist/index.html. So you have already copied the index.html to dist. – Ena Mar 20 '19 at 16:13

Grunt-include-source + usemin don't work together

1 Answers1