0

I have an AngularJS project and I want Webpack to handle the build process for me, I need Webpack to output JS files dynamically from the src folder into my HTML template, and output them like this:

<script src="source1.js"></script>
<script src="source2.js"></script>
<script src="source3.js"></script>
...

Is it possible to load files in specific order rather than getting them all in one big file?

Siraj Kakeh
  • 741
  • 6
  • 20
  • Bundling code in such a way that dependencies are resolved correctly is a large part of the purpose of Webpack, so I’m wondering: what is the reason why you need to have separate files in order? Maybe there’s another way to achieve what you need. – Aankhen Jul 02 '18 at 09:59
  • @Aankhen I need to load some dependencies and also some modules should be loaded before some other modules – Siraj Kakeh Jul 02 '18 at 10:19
  • Can you specify your dependencies in your code itself using imports? – Aankhen Jul 02 '18 at 10:20
  • @Aankhen Sorry I didn't get what you mean, for example I have JQuery, Angular, some other AngularJs libs that I'm using all currently available in bower_components – Siraj Kakeh Jul 02 '18 at 10:33
  • 1
    It means that when you use JQuery in foo.js, for instance, you say `import $ from jquery;` at the top of the file. When Webpack compiles foo.js, it sees that you import JQuery, so it makes sure that JQuery is loaded before your code is. See https://webpack.js.org/api/module-methods/ – Aankhen Jul 02 '18 at 11:07
  • 1
    More information about Angular, Webpack, and JQuery: https://stackoverflow.com/questions/39511788/how-to-import-jquery-to-angular2-typescript-projects – Aankhen Jul 02 '18 at 11:16

0 Answers0