How to migrate a create-react-app (CRA) from Webpack to Snowpack | Rangle.io

Why should I migrate my app?

Webpack has been the standard tool for bundling source code into deployable software for quite some time now, and as we move further into the development cycles, the bundle tools tend to become just one item of the list of supporting tools that help you on your day-to-day code experience. For instance, if you use create-react-app, that decision was already made for you, so you can focus on coding features for your fantastic products.

So, how do I migrate my app?

The current Snowpack documentation focuses on creating a new project so one can reap its benefits, but what if you already have an ongoing project, and want to have a faster HMR cycle?

Issue 1: redux logger

The way the project was using the logger before the migration was trying to create a new logger using import { createLogger } from "redux-logger". I just had to replace it to use the logger provided by redux-logger: import logger from "redux-logger".

Issue 2: process.env

In the Snowpack documentation, it mentions that the process can be accessed for packing the project ( https://www.snowpack.dev/reference/configuration#packageoptions.env) but that doesn’t work for the dev cycle. To solve this issue, I just replaced process.env with import.meta.env.

The latest in Javascript, design, and innovation.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store