Expo Import Cost VSCode Extension

Warning

This extension is unstable and might not work for your project.

This extension will display inline in the editor the size of the imported package and file. The extension utilizes expo-atlas in order to detect the imported size

This extension is based on expo-atlas and inspired by wix's import cost extension.

Installation

1. Go to the Releases and download the expo-import-cost.vsix file from Assets

2. Then go to VSCode > Extensions tab, click on the three dots and click on "install from VSIX..." and then select the downloaded expo-import-cost.vsix file.

Features

Calculates the size of imports and requires. Supports both Javascript and Typescript

Requirements

This extension require Expo Atlas to be enabled. Atlas is built into Expo starting from SDK 51, and enabled when defining the environment variable EXPO_UNSTABLE_ATLAS=true.

$ EXPO_UNSTABLE_ATLAS=true npx expo start

Tip

Expo start runs in development mode by default. If you want to see a production bundle of your app, you can start the local dev server in production mode: $ expo start --no-dev.

Follow the documentation for more guide: https://docs.expo.dev/guides/analyzing-bundles/#using-atlas-with-npx-expo-start

Then start your project for any platform $ expo start -p ios | android | web

Extension Settings

You can toggle this extension to show or hide by Shift+Cmd+P and Toggle Expo Import Cost

---

Enjoy!