Apologies for the vague description, I am trying to be concise while acknowledging my limited understanding and potential incorrect assumptions.
I currently have a website that consists of one large HTML file with scripts defined in-line within <scripts> tags.
My objective is to extract all the scripts into individual .js files and then include them in either the index.html or within each other as needed. While I am familiar with how Node's require and Angular's import work, I admit to only knowing their usage rather than technical details.
Assumption 1: I assume I cannot utilize require as it is meant solely for Node.js. However, I recall encountering require in AngularJS 1.5 code which raises uncertainty. My guess is that such use cases were stitched together using tools like WebPack or Gulp.
Assumption 2: It seems logical to employ import, but this method requires a URL address for fetching the .js file. If I host my script on a server or CDN, it can be pulled in seamlessly. Unfortunately, providing local pathing (on the server) in index.html will not automatically fetch dependencies when served. Hence, I require npm/Webpack/other to pre-compile my index.html to ensure proper inclusion of dependencies on the server.
Assumption 3: The preferred approach seems to involve pre-compiling all assets into a single, self-contained html file for efficient serving. This assertion is based on the rise of Markdown being served from CDNs, the emergence of JAMstack architecture, and the popularity of static site generators like Jekyll (though mainly used for traditional Jekyll sites).
Assumption 4: Although I intend to transition to Typescript eventually, I believe this change will not alter the process significantly. I would simply compile TS into JS before applying the aforementioned solution.
Question: Given my situation and concerns, would it be advisable to explore using npm/Webpack to combine my separate .js files? How should I prepare these files for merging through the use of import/export? And if so, is there a standard process or example demonstrating this procedure?