3.0.0

🎉 Yeah, version 3 is finally here 🎉

Let’s recap the most important changes since the last 2.x.x release:

• build: Replace Gulp with Webpack (and npm scripts) (b91adea)
• bootstrap: Upgrade to Bootstrap 4 (e4680b5)
  • See Bootstrap v4 migration guide to read about the most notable as well as breaking changes.
• polyfills: Dynamically import and lazy load polyfills (00aa0de), Relates to #235
  • This keeps the vendor bundle in modern browser smaller because
    polyfills are only loaded when the used browser actually needs them.

Notable Changes since the last beta

Code Refactoring

• scripts: serve build via npm run build:serve (ce2cc70)

Features

• add PRODUCTION constant to ESLint config (bb0c954)
• improve the cacheability of the vendor bundle (735f2e6)
• reduce noise in terminal (especially in watch mode) (90a84bd)
• setup Babel plugin transform-imports (da517ed)
• setup tree shaking (90561f9)

BREAKING CHANGES

• scripts: Change the npm script name fpr serving the dist directory from npm run build:check to npm run build:serve

• The webpack runtime has moved into a separate file. Therefore you need to add a reference to that file into your HTML / Handlebars file(s) before the vendor bundle:

  <!-- webpack runtime JS -->
  @@runtime.js
  
  <!-- Vendor JS -->
  @@vendor.js
  
  <!-- Own JS -->
  @@app.js

  See https://developers.google.com/web/fundamentals/performance/webpack/use-long-term-caching#webpack_runtime_code for details about the why.

---

See all changes since the last prerelease.

Migration Guide

Below you’ll find the list of all breaking changes since the last 2.x.x release and what you have to adapt.

• build: Gulp and all the tasks are gone. But most of the npm scripts still do what they did before. Here are the main scripts needed for developing and building your project.

  Command	Description
  npm start	Builds for development, starts a webserver, watches files for changes, rebuilds incremental and reloads your browser.
  npm test	Lints your JavaScript files and runs unit test via the Jest CLI.
  npm run test:watch	Runs unit test with Jests watch option.
  npm run build	Builds for production to dist directory.
  npm run build:serve	Starts a static fileserver serving the dist directory.
  npm run build:analyze	Starts »Webpack Bundle Analyzer« to visualize size of Webpack output files

  See scripts section in package.json for all available scripts.

• build: The bundled polyfills moved to the vendor bundle, the webpack runtime has moved into a separate file. Plus the references to the bundles have changed. You have to update the references in your HTML / Handlebars file(s):

  <!-- Bundled vendor CSS files -->
  @@vendor.css
  
  <!-- Our compiled and merged Sass files -->
  @@app.css
  
  […]
  
  <!-- webpack runtime JS -->
  @@runtime.js
  
  <!-- Bundled vendor CSS files -->
  @@vendor.css
  
  <!-- Our compiled and merged Sass files -->
  @@app.css

• polyfills: Polyfills are now dynamically imported and lazy loaded to decrease the size of the vendor bundle for modern browsers. See README for details.

• eslint: We ’ve added eslint-plugin-unicorn and eslint-plugin-import which might introduce new linting errors. You might want to turn off rules in /.eslintrc.json in case you find them too opinionated.

• baumeister.json: The properties bundleCSS and includeStaticFiles in baumeister.json have moved to vendor.bundleCSS and vendor.includeStaticFiles. You have to adapt these changes in case you have added dependencies via these properties.

• bootstrap: We’ve updated to Bootstrap 4. See Bootstrap v4 migration guide to read about the most notable as well as breaking changes.

---

See all changes since the last release.