Skip to content

Latest commit

 

History

History
23 lines (19 loc) · 818 Bytes

File metadata and controls

23 lines (19 loc) · 818 Bytes

Lesson: Webpack Loaders

Transpiling ES6 to ES5

  1. Create webpack config and define entry file and bundle path
  2. Install babel-loader, @babel/preset-env, @babel/core as dev dependency
  3. Add babel-loader to webpack config
  4. Adjust npm script "build"
  5. Generate bundle with webpack
  6. Confirm that bundle is ES5 code

Import Bootstrap CSS

  1. Import css files (style.css & bootstrap) into app.js
  2. Add style / css / file loaders (google it!)
  3. Configure that css files are handled

Hint: Webpack also needs a "file-loader" to properly load fonts.

Use dist folder

  1. Configure dist folder output
  2. Add html-webpack-plugin
  3. Configure html webpack plugin to create html file in dist folder using a template

Documentation

https://github.com/babel/babel-loader