CODEWITHSUNDEEP
requirejsgruntjs
user2498221
user2498221

Reputation: 11

Using grunt.js along with require.js to concat, minify, and inject javascript/css inline into HTML document

Perhaps my google-fu is failing me today, however I am looking for an example/way to configure grunt.js to insert the contents of the post-compile javascript (and CSS) into the final rendered HTML document (to help with load/render times).

Has anyone done this, or can point me in the right direction?

Upvotes: 1

Views: 1197

Answers (1)

Andreas Köberle
Andreas Köberle

Reputation: 110892

Take a look at grunt-usemin. With this task you can add comments to your head around your script/style tags. The task will find all sources between the start/end of the comment and concat/minify/build requirejs for this files

<!-- build:js build/js/app.js -->
<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 -->

This block for example will result in a file app.js holding all the minified/concatenated files and create a new html file that replace the block with <script src="build/js/app.js"></script>

Upvotes: 2

Related Questions