Using the npm library
npm is the package manager for Node.js. It was created in 2009 as an open source project to help JavaScript developers easily share packaged modules of code.
The npm Registry is a public collection of packages of open-source code for Node.js, front-end web apps, mobile apps, robots, routers, and countless other needs of the JavaScript community.

Advantage of npm

With Vev’s built-in dependency manager, you can effortlessly use packages from the npm library in your code. Simply add them as dependencies to your package, and import them as per their instructions, usually like this:
1
import React from 'react'
2
import "react-responsive-carousel/lib/styles/carousel.min.css"; // requires a loader
3
import { Carousel } from 'react-responsive-carousel';
4
const images = [...];
5
6
export default function MyResponsiveCarousel(props: Props) {
7
return (
8
<Carousel>
9
{
10
images.map((image, i) => <div>
11
<img src={image.url} />
12
<p className="legend">Legend {i}</p>
13
</div>)
14
}
15
16
</Carousel>;
17
);
18
};
19
Copied!
To get a carousel like this: (codesandbox: https://codesandbox.io/s/lp602ljjj7)
It’s not just for carousels and other fancy UI components. Npm has all the best helper tools such as lodash , date-fns and react-virtualized.

Add npm packages in Vev

To add and manage npm packages, go to the package.json file in your file tree.
With the package.json file opened, click on “Add dependency” to search through the npm library.