After trying to embed angular into the body tag, I noticed that nothing is loading up. Upon inspecting the resources panel, I found that only files from the head are present. Moving all the scripts to the head section resolves the issue and everything loads correctly, but when they remain in the body, they don't load.
<body>
<section ui-view=""></section>
<!-- inject:js-->
<script src="/angular/angular.js"></script>
<script src="/json3/lib/json3.js"></script>
<script src="/es5-shim/es5-shim.js"></script>
<script src="/jquery/dist/jquery.js"></script>
<script src="/angular-resource/angular-resource.js"></script>
<script src="/angular-cookies/angular-cookies.js"></script>
<script src="/angular-sanitize/angular-sanitize.js"></script>
<script src="/angular-animate/angular-animate.js"></script>
<script src="/angular-touch/angular-touch.js"></script>
<script src="/angular-ui-router/release/angular-ui-router.js"></script>
<!-- endinject-->
<!-- inject:files:js-->
<script src="/js/app.js"></script>
<!-- endinject-->
</body>
Why is this happening? Why is the content not loading onto the page?
Despite using gulp
and gulp-webserver
, those shouldn't be the root cause of the problem.