angularjsgruntjsyeomanwiredepgrunt-wiredep

Can wiredep or anything else be used to insert <script> tags in HTML to include all .js files in given directories?


Like you include bower sourced JS files in an HTML without specifying each script's URL, I want to include all JS files contained in a particular directory. How to go about this? There could be more than one directories and the JS files may located at any depth in the specified directories.

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

This sample code is from index.html of a yeoman generated project. the scripts directory is in the app directory which is inturn specified as an argument to build:js.

As I understand <!-- build:js({.tmp,app}) scripts/scripts.js --> tells wiredep to include all js files from the app directory and create a concatenated file scripts/scripts.js.

However, when I delete the <script> tags and run wiredep again, it does not recrate the <script> tags

<!-- build:js({.tmp,app}) scripts/scripts.js -->

<!-- endbuild -->

Whereas if I delete the script tags for bower sourced JS files then wiredep recreates them.


Solution

  • You can check this answer here, I still doubt how will you handle dependencies ... I mean, scripts should be loaded via certain order to work. It's not like that you are going to leave that task to include all the files on its own and their order will be solved automatcailly.

    You can also check out this post