npm is the package manager for Node.js, a back-end JavaScript runtime environment.
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.
Advantages 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:
import React from 'react'
import "react-responsive-carousel/lib/styles/carousel.min.css"; // requires a loader
import { Carousel } from 'react-responsive-carousel';
const images = [...];
export default function MyResponsiveCarousel(props: Props) {
return (
<Carousel>
{
images.map((image, i) => <div>
<img src={image.url} />
<p className="legend">Legend {i}</p>
</div>)
}
</Carousel>;
);
};
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.