Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Merge all javascript files to one file

it's possible auto merge all javascripts on html page merge to one large javascript? (same for css)

for example:

<html>
<head></head>
<body>
  <script src="/extern/jquery/jquery-2.1.3.min.js"></script>
  <script src="/extern/bootstrap/js/bootstrap.min.js"></script>
  <script src="/extern/form_validator/jquery.form-validator.min.js"></script>
  <script src="/extern/moment/moment.js"></script>
  <script src="/js/jsIndex.js"></script>
</body>
</html>

Thanks

like image 805
Fanda36 Avatar asked Jun 29 '16 15:06

Fanda36


2 Answers

This one works on me

mainhub.js

function callAll(jsfiles) {
    var src = document.createElement("script");
    src.setAttribute("type", "text/javascript");
    src.setAttribute("src", jsfiles);
    document.getElementsByTagName("head")[0].appendChild(src);
}
callAll("your/path/to/a/jsfile1.js");
callAll("your/path/to/a/jsfile2.js");
callAll("your/path/to/a/jsfile3.js");

then all you have to call is the mainhub.js on your header

<script type="text/javascript" src="your/path/mainhub.js" ></script>
like image 61
nekomancer Avatar answered Oct 07 '22 21:10

nekomancer


grunt-usemin (- https://github.com/yeoman/grunt-usemin) could help.

like image 35
trk Avatar answered Oct 07 '22 21:10

trk