Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

HTML as Webpack entry point

Tags:

gulp

webpack

First of all, I'm completely new to web development so if my approach is totally wrong, just say so.

I want to automate build of sass and ts files, so I read about Gulp/Webpack, and seems like webpack is the way to go.

I am building a simple single page website and for now I only have a small javascript that's needed, so it makes sense in my mind that the entry point for webpack should be the html file itself. However, all the docs and tutorials only talk about starting from a .js.

Is there a way to start from the HTML and resolve js, css, images and other required stuff?

Should I just scrap using webpack and just use gulp to compile the typescript and sass?

like image 704
Lorenzo Avatar asked Mar 09 '19 21:03

Lorenzo


People also ask

Can webpack bundle HTML?

To configure Webpack to bundle HTML we'll use our first plugin, a dependency called HtmlWebpackPlugin. Remember, loaders offer functionality to files before Webpack bundles them, whereas plugins modify the entire bundle itself.

What is an entry point webpack?

The entry object is where webpack looks to start building the bundle. The context is an absolute string to the directory that contains the entry files.

Does webpack generate HTML?

Use webpack to build your JS assets and it will create a . html file with all assets imported in. Run yarn dev , and hopefully after a few sections you will see a dist directory was created with your JS files included.

Why do we use HTML webpack plugin?

The HtmlWebpackPlugin simplifies creation of HTML files to serve your webpack bundles. This is especially useful for webpack bundles that include a hash in the filename which changes every compilation.


1 Answers

One alternative would be to use Parcel, which supports having a HTML file as the entry.

like image 169
ᅙᄉᅙ Avatar answered Sep 28 '22 02:09

ᅙᄉᅙ