Learn how the HTML webpack plugin is an example of a plugin that handles one small, useful, and specific task—it creates an HTML file and links to the bundle, so you don't have to perform this task manually.
- [Instructor] Another nice plugin to use in your project…is the HTML webpack plugin.…This is going to generate an HTML file…that links to the bundle.…So let's go ahead and install this…using our terminal.…And it's just called html-webpack-plugin…- -save-dev.…Great, so back to Sublime.…We're going to adjust our webpack config.…Now the first thing we want to do is import this,…so we'll say const HTMLWebpackPlugin,…and this is going to require html-webpack-plugin.…
Now inside of our plugins array here,…we're going to add one new value,…so we'll say new HTMLWebpackPlugin,…and we're going to call this.…So we'll create a new instance…of the plugin in our project.…You don't need to send it any options…at this point.…So once we give that a save,…we'll reopen our terminal, we'll run build,…and what this should do inside of the project…is it's going to create a new index file…that is linking to these bundles.…
And what's really cool about this is…it's actually doing the right thing for you.…So it's understanding…that the vendor bundle should go first,…
- What is webpack?
- Running webpack from the command line
- Setting up loaders
- Loading CSS
- Compiling SCSS
- Using webpack plugins
Skill Level Intermediate
1. What is webpack?
2. webpack Loaders
3. webpack and CSS
4. webpack Plugins
Next steps1m 1s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.