Need help with import-cost?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

1.0K Stars 59 Forks MIT License 258 Commits 97 Opened issues


displays the import size of the package you are importing inside the code editor

Services available


Need anything else?

Contributors list

Import Cost Build Status Build status

This extension will display inline in the editor the size of the imported package. The extension utilizes webpack in order to detect the imported size.

Example Image

This project includes implementation of: * Import Cost VSCode extension - install it from VSCode Marketplace * Import Cost Node module - use freely to implement extensions for other IDE (or contribute them to this repository)


Third-Party Editor Plugin Links

Why & How

I detail the Why and How in this blog post:

Developer guidelines

In this project we use lerna for managing the multiple packages.

Getting started

In order to start working all you need to do is:

$ git clone [email protected]:wix/import-cost.git
$ npm install
$ code packages/import-cost
$ code packages/vscode-import-cost

Once VSCode workspaces are open: * Hit

to run tests in
* Hit
to run the
extension in debug mode

Applying changes

Thanks to lerna, we have a symbolic link in the

node modules folder to the local
, which makes applying changes very easy. You can verify that link exists by running the following command:
$ ls -la packages/vscode-import-cost/node_modules | grep import-cost
lrwxr-xr-x    1 shahart  staff    17 Aug  6 09:38 import-cost -> ../../import-cost

If anything goes wrong and link does not exist, just run the following commands at the root of this project and lerna will sort it out:

$ git clean -xdf
$ npm install

After you make any changes to the

node module, don't forget to trigger transpilation in order to see those changes when running the
$ npm test

Publishing changes

When you are ready to publish a new version of the extension, you first need to publish a new version of

(unless nothing changed there). This is done by first commiting all your changes, then simply run the following commands:
$ cd packages/import-cost
$ npm version patch | minor | major
$ git commit -a -m "releasing version X.X.X"
$ git push
$ npm publish

Then go ahead and release the extension with almost same steps (except for last one):

$ cd packages/vscode-import-cost
$ npm version patch | minor | major
$ git commit -a -m "releasing version X.X.X"
$ git push
$ git clean -xdf && npm install && vsce publish

See how in the last step we had to clean everything and do a clean

npm install
in the extension folder? This is an important step so that
vsce publish
will bundle everything correctly when publishing the extension. After that's done, you'll need to run following command so that lerna will sort everything out again:
$ cd ../..
$ git clean -xdf
$ npm install

Don't forget to update with details of what is new in the released version...

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.