Why and how to transpile dependencies of your JavaScript application

If you're a web developer, you likely use bundlers like Webpack, Rollup, or Parcel which transpile JavaScript code with Babel under the hood. However, developers rarely transpile dependencies' code because everything seems to work fine without it, but this can lead to issues. The adoption of ES modules has improved, with native support in browsers and Node.js since 2020, allowing for tree-shaking and smaller bundles. To ensure compatibility with modern and legacy browsers, developers must transpile the code of dependencies, which can be done manually or using tools like optimize-plugin, a readily available tool that takes care of everything. Optimize-plugin provides faster bundling times and smaller bundle sizes by analyzing and bundling code once and then transpiling it for both modern and legacy browsers.