Hasty Treat - Bundlers in 2020

<p class="has-line-data" data-line-start="7" data-line-end="8">In this Hasty Treat, Scott and Wes talk about the state of bundlers in 2020 — Rome, Snowpack, Parcel, Webpack, Rollup, Vite, and more!</p> <h2 class="code-line" data-line-start="9" data-line-end="10"><a id= "LogRocket__Sponsor_9" name="LogRocket__Sponsor_9"></a>LogRocket - Sponsor</h2> <p class="has-line-data" data-line-start="10" data-line-end="11"> LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at <a href= "https://logrocket.com/syntax">logrocket.com/syntax</a>.</p> <h2 class="code-line" data-line-start="12" data-line-end="13"> <a id="Show_Notes_12" name="Show_Notes_12"></a>Show Notes</h2> <p class="has-line-data" data-line-start="14" data-line-end="15"> 02:39 - What is a bundler?</p> <ul> <li class="has-line-data" data-line-start="15" data-line-end="16"> On the one hand, you can write HTML, CSS and JavaScript and open it in the browser</li> <li class="has-line-data" data-line-start="16" data-line-end="18"> On the other hand, your build could be super complex</li> </ul> <p class="has-line-data" data-line-start="18" data-line-end="19"> 03:24 - What goes into configuring a bundler?</p> <ul> <li class="has-line-data" data-line-start="19" data-line-end="20"> Templating language you use (Jsx, Pug, Vue, etc.)</li> <li class="has-line-data" data-line-start="20" data-line-end="24"> JavaScript you write and compile to: <ul> <li class="has-line-data" data-line-start="21" data-line-end="22"> ES6/7/8/9</li> <li class="has-line-data" data-line-start="22" data-line-end="23"> Typescript</li> <li class="has-line-data" data-line-start="23" data-line-end="24"> CoffeeScript</li> </ul> </li> <li class="has-line-data" data-line-start="24" data-line-end="25"> Polyfills</li> <li class="has-line-data" data-line-start="25" data-line-end="26"> Environmental variables</li> <li class="has-line-data" data-line-start="26" data-line-e