Develop Reference

Load standalone js library using webpack

I'm trying to add this library to my project: https://github.com/DragonBones/DragonBonesJS/tree/master/Phaser/Demos
I use webpack for merging all libraries, it produces such output in index.html:
<script type="text/javascript" src="./dist/vendor.bundle.js"></script>
<script type="text/javascript" src="./dist/bundle.js"></script>
I'd like to inject required files between vendor.bundle.js - which, as I suspect contains all remaining libraries merged into one file - and bundle.js - which contains my game. I could also inject them at the end of vector.bundle.js, it doesn't matter for me. Unfortunately I don't know how to do that.
Let's say that's the list of files I need to load:
<script src="./libs/dragonBones/dragonBones.js"></script>
<script src="./out/DragHelper.js"></script>
<script src="./out/BaseDemo.js"></script>
<script src="./out/HelloDragonBones.js"></script>
<script src="./out/AnimationBase.js"></script>
<script src="./out/DragonBonesEvent.js"></script>
<script src="./out/AnimationLayer.js"></script>
<script src="./out/BoneOffset.js"></script>
<script src="./out/InverseKinematics.js"></script>
<script src="./out/BoundingBox.js"></script>
<script src="./out/ReplaceSlotDisplay.js"></script>
<script src="./out/ReplaceAnimation.js"></script>
<script src="./out/CoreElement.js"></script>
<script src="./out/PerformanceTest.js"></script>
Is there a way to modify index.html template to include them between these two files mentioned earlier? Or maybe there is better way of doing that?

need to use jquery-1.min.js and jquery.min.js together

I need to use both below files but just one of the can work if both of the use in pae
<script src="jquery.min.js"></script>
<script src="jquery-1.min.js"></script>//just this work
Or if change order
<script src="jquery-1.min.js"></script>
<script src="jquery.min.js"></script>//just this work
I use a drag and drop plugin , this need jquery.min.js and my theme need to jquery-1.min.js for be responsive

You should be able to do this when you use noConflict.
<!-- load jQuery-1 -->
<script type="text/javascript" src="jquery-1.min.js"></script>
<script type="text/javascript">
var jQuery_1_min = $.noConflict(true);
</script>
<!-- load jQuery -->
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
var jQuery_min = $.noConflict(true);
</script>
Now whenever you need one of these files you can do this.
//example
$jQuery_min('.selector').live('click', function(){
//do something
});
If it still wont work I dont know anymore... This is the way everybody does it. Quick google search.

Unable to reference jquery

I have a feeling I'm missing something obvious, could someone please help? I'm unable to reference jquery and mustache using <script> tags.
404 messages
file structure 1
file structure 2
<script src='/js/handlebars-v3.0.1'></script>
<script src='js/handlebars-v3.0.1'></script>
<script src="js/jquery-1.11.2.min"></script>
<script src='http://localhost/learning/js/handlebars-v3.0.1'></script>
<script src="js/main.js"></script>
if you notice, I'm able to read in main.js just fine using <script src="js/main.js"></script> but not with <script src='js/handlebars-v3.0.1'></script>
appreciate any help, thanks.

You misspelled the Javascript file names:
It should be:
<script src="js/jquery-1.11.2.min.js"></script>
<script src="js/handlebars-v3.0.1.js"></script>
<script src="js/main.js"></script>
Same for other Javascript files. Also, you included multiple copy of same JS.
Side note: use either double quote or single quotes only, for tidiness sake

JavaScript files inclusion in specific order

I have some JavaScript files that i want to include in my application in such order that these following 3 files
<script src="lib/angular.js"></script>
<script src="lib/jquery-mobile-angular-adapter.js"></script>
<script src="lib/custom.js"></script>
always execute after these 6
<script src="lib/jquery.js"></script>
<script src="lib/jquery.mobile.js"></script>
<script src="lib/custom1.js"></script>
<script src="http://include.jaydata.org/jaydata.js"></script>
<script type="text/javascript" src="lib/DBData/InMemoryProvider.js"></script>
<script src="lib/DBData/SpookyHealthEntities.js"></script>
currently i am doing like this
<script src="lib/jquery.js"></script>
<script src="lib/jquery.mobile.js"></script>
<script src="lib/custom1.js"></script>
<script src="http://include.jaydata.org/jaydata.js"></script>
<script type="text/javascript" src="lib/DBData/InMemoryProvider.js"></script>
<script src="lib/DBData/SpookyHealthEntities.js"></script>
<script src="lib/angular.js"></script>
<script src="lib/jquery-mobile-angular-adapter.js"></script>
<script src="lib/custom.js"></script>
But in this way last 3 executes before the first completes so i am getting error because in last 3 files my some code have to execute once the first 6 complete there whole execution

What I would suggest is to use include mechanism to include all the dependent files from the parent file. This way you can be certain of the loading as you want it to.
for example if a is dependent upon b and b on c, you will do the following.
Add include statement at the top of a for b and in b, an included statement for c.
Hope it helps.

Multiple JavaScript Issue

I include the following in my header
<!-- scripts -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<script type="text/javascript" src="./js/script.js"></script>
<script type="text/javascript" src="./js/jquery.infinitecarousel.js"></script>
<script type="text/javascript" src="./js/news.ticker.js"></script>
<script type="text/javascript" src="./js/jquery.autogrowtextarea.js"></script>
but the autogrowtextarea dont work if the script.js,jquery.infinitecarousel.js and news.ticker.js are included, but if i remove those three lines my autogrow textbox function work, why can this be. thanks

That means that something in one or all of those scripts is masking or breaking the functionality, or something on which it depends. Try not including the scripts one by one; isolate which one causes the break. Then look for duplicate definitions. Also, make sure that the scripts are included in the right order if there are any dependencies.

Try to put <script type="text/javascript" src="./js/jquery.autogrowtextarea.js"></script> next to the include of jquery and before the other ones and test if works. Maybe you have dependencies in the other files (script.js)