I have problems understanding the usemin(Prepare), described in here: usemin
What I understand is, that with the usemin, you can combine many files as only one file, which would be a good idea when building your JS application. I also understand the flow how you should use it, for example:
// simple build task
grunt.registerTask('build', [
'useminPrepare',
'concat:generated',
'cssmin:generated',
'uglify:generated',
'filerev',
'usemin'
]);
Then if you have this code:
<!-- build:js js/app.js -->
<script src="js/app.js"></script>
<script src="js/controllers/thing-controller.js"></script>
<script src="js/models/thing-model.js"></script>
<script src="js/views/thing-view.js"></script>
<!-- endbuild -->
The concat task would combine all those files into a one file, called app.js, and put it in a .tmp folder. Then the uglify task would take the file app.js from the .tmp folder, uglify all js in it, and put it to dist-folder.
Let's say that before useminPrepare, I have had another task, which translates the original html (index.html) also to dist folder. Now when the usemin task starts, I have set it to use the dist folder, and it should replace the old blocks with a reference to the generated app.js. So now, in the html inside the dist folder, the same part should look something like this:
<script src="js/app.js"></script>
Is this correct? So now there shouldn't be any comment tags left? Now I have a problem related to the usemin. The situation is this: In the beginning html, I have comment tags for bower_components (bower-install) inside usemin tags like this:
<!-- build:js js/app.js -->
<script src="js/app.js"></script>
<script src="js/controllers/thing-controller.js"></script>
<!-- bower:js -->
<script src="bower_components/something/some_bower_component.js"></script>
<script src="bower_components/something/some_bower_component.js"></script>
<script src="bower_components/something/some_bower_component.js"></script>
<!-- endbower -->
<script src="js/models/thing-model.js"></script>
<script src="js/views/thing-view.js"></script>
<!-- endbuild -->
With this setting, everything seems to work good until the usemin task in the end. The usemin task is now unable to replace the code blocks. I have identified the reason why it can't. It is because I have those bower comment blocks there. So if I separately make the first tasks, then transfer the code to dist, then remove those bower comment tags, and make the rest of the tags in the build, then everything works fine. I want to solve this so that I can run all the tasks straight through. How could I solve this? Why does usemin fail if it sees comment blocks? Could I change usemin options to ignore comment blocks? Or should I write a grunt task, that will remove those particular comment blocks after bower components are injected and the html has been transfered to dist? The versions I have are:
"grunt-bower-install": "~0.7.0",
"grunt-concurrent": "~0.4.1",
"grunt-contrib-clean": "~0.5.0",
"grunt-contrib-coffee": "~0.7.0",
"grunt-contrib-compass": "~0.6.0",
"grunt-contrib-concat": "~0.3.0",
"grunt-contrib-connect": "~0.5.0",
"grunt-contrib-copy": "~0.4.1",
"grunt-contrib-cssmin": "~0.7.0",
"grunt-contrib-htmlmin": "~0.1.3",
"grunt-contrib-uglify": "~0.2.0",
"grunt-usemin": "~2.0.0",
