> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Work with npm Packages in the Editor

## Article: Work with npm Packages in the Editor

## Article Link: https://dev.wix.com/docs/develop-websites-sdk/code-your-site/developer-environments/packages/npm/work-with-npm-packages-in-the-editor.md

## Article Content:

# Work with npm Packages in the Editor

Wix allows you to install [npm packages](https://dev.wix.com/docs/develop-websites-sdk/code-your-site/developer-environments/packages/npm/about-npm-packages.md) on a site. This article explains how to install, update, and uninstall npm packages when working in the editor (Wix Studio and Wix Editor) or Wix IDE. You can also use npm packages in your local IDE with the [Wix CLI](https://dev.wix.com/docs/develop-websites-sdk/code-your-site/developer-environments/packages/npm/work-with-npm-packages-with-the-cli.md).

> **Wix IDE:** You can't install or update npm packages directly from the Wix IDE, but you can use packages that were installed or updated using the editor. Follow the instructions below for installing and updating packages in the editor, then import and use the package in the Wix IDE.

<div style="text-align:center">
<iframe width="560" height="315" src="https://www.youtube.com/embed/BdRHzlR46Xg" title="How to install and use NPM package PDFKit on Wix Studio" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>

## Install an npm package

Before using an npm package, you need to install it.

<blockquote class="important">

**Important:**
By installing an npm package, you agree to the package's license agreement.

</blockquote>

To install an npm package in the editor:

1.  Navigate to **Packages & Apps** in the Code sidebar.

1.  Hover over **npm** in Packages & Apps, click the plus icon ![Plus icon](https://wixmp-833713b177cebf373f611808.wixmp.com/images/174671ebdfa1dffd306ef30c4c4d4af5.png), and select **Install npm package**.

    The Package Manager opens. Note that the 10 most popular npm packages used on Wix sites are displayed in the Package Manager.

        <div style="text-align:left">

               <img src="https://wixmp-833713b177cebf373f611808.wixmp.com/images/b05af4566d6c44838f0d5cfd41ed8b83.png" alt="Package Manager interface" style="max-width:50vw" />

     </div>

1.  In the npm section of the Package Manager, search for the package you want to add. Instructions for how to use the package are displayed on the right side of the Package Manager.

1.  Click **Install** next to the package of your choice. Once installed, you can find the package under npm in the Packages & Apps section of the Code sidebar.

1.  Learn how to use the installed package from its README file. There are several ways to view the README file:

    - In the **Packages & Apps** section of the Code sidebar, click the npm package to view the README file in the code editor.
      - Hover over the package, click the **More actions** ![More actions](https://wixmp-833713b177cebf373f611808.wixmp.com/images/0e583769d1305e30a5e8d6ca6ed59453.png) icon, and then select **View Documentation** to view the npm package documentation in a new browser.
    - Search for your package's README file at [npmjs.com](http://npmjs.com/).

## Change a package's version

In the editor, you can update an npm package to its latest version, or you can change it to a previous version.

<blockquote class="important">

**Important:**
After changing a package's version, make sure that your code is compatible with the updated version of the package.

</blockquote>

To change a package version in the editor:

1. Navigate to **Packages & Apps** in the Code sidebar.
1. Hover over **npm** in Packages & Apps, click the plus icon ![Plus icon](https://wixmp-833713b177cebf373f611808.wixmp.com/images/174671ebdfa1dffd306ef30c4c4d4af5.png), and select **Install npm package**.
1. In the Package Manager, select **Installed Packages**.
1. Hover over the package you want to update, click the **More Actions** ![More actions](https://wixmp-833713b177cebf373f611808.wixmp.com/images/0e583769d1305e30a5e8d6ca6ed59453.png) icon, and select **Choose a version**.

   ![Change version](https://wixmp-833713b177cebf373f611808.wixmp.com/images/3efd4b23b92dda69d0bf42d8ae95b491.png)

1. Find the version you want and click **Install**.

   ![npm versions](https://wixmp-833713b177cebf373f611808.wixmp.com/images/6122f99e11216c28784295483494b29e.png)

## Uninstall a package

You can uninstall npm packages that you no longer need.

<blockquote class="warning">

**Warning:**
When you uninstall a package, make sure to update any code that relies on that package.

</blockquote>

To uninstall a package in the editor:

1. Navigate to **Packages & Apps** in the Code sidebar.
2. In the npm section, hover over the package you want to uninstall, click the **More Actions** ![More actions](https://wixmp-833713b177cebf373f611808.wixmp.com/images/0e583769d1305e30a5e8d6ca6ed59453.png) icon, and select **Uninstall**.

## See also

- [About packages](https://dev.wix.com/docs/develop-websites-sdk/code-your-site/developer-environments/packages/about-packages.md)
- [About npm packages](https://dev.wix.com/docs/develop-websites-sdk/code-your-site/developer-environments/packages/npm/about-npm-packages.md)
- [Work with npm packages with the Wix CLI](https://dev.wix.com/docs/develop-websites-sdk/code-your-site/developer-environments/packages/npm/work-with-npm-packages-with-the-cli.md)