Webpacker 6: Troubleshooting Guide

Published:  Dec 24th, 2020
Updated:  Feb 16th, 2021

A (growing) collection of tools and techniques for debugging your Webpack(er) setup.

I highly recommend reading the SurviveJS - Webpack 5 ebook for a real deep dive!.

Locating the Issue

Use the network tab in your browser to view the CSS that’s being sent to the browser for clues.

Cached Styles

If you update your styles but your UI does not change and there are no errors, it’s likely browser caching.

Hard reload after clearing your cache and you should see your changes.

To avoid these errors, import your styles into your JS pack vs. using style-loader.

Tools

Dashboards