npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

ezmm

v0.5.0

Published

An easy ES Module Manager to use modern javascript

Downloads

14

Readme

EZMM

NPM Badge Licence Badge

An easy ES Module Manager to use modern javascript.

Table of Content

🚀 Getting Started

🏠 Prerequisites

📦 Installation

The installation is pretty simple, just install the package.

# NPM
npm install [-g] ezmm

# Yarn
yarn [global] add ezmm

🏄 Usage

EZMM is super simple to use, just use the link command to add a module to your modules directory and modules.json file. If the modules directory and the modules.json files do not exist they will be created.

ezmm link react

Then in your javascript you can import linked modules from the modules directory.

import react from 'modules/react.js';

Note: Be sure to link your javascript in your html with type="module".

You can overwrite the provider and/or the version you are using with the link command.

ezmm link react -p esm.sh -t 16.10
# React will now use the version 16.10 provided by esm.sh

Afterward, if you want to remove a module that you don't use anymore, use the unlink command.

ezmm unlink react

Once a module is linked you will see it in the modules.json file that is automatically created on the first link command (given you used the name argument). This file has a simple structure and is made to help with maintenance.

{
  "react": {
    "provider": "skypack",
    "tag": "16.10"
  },
  "darken": {
    "url": "https://unpkg.com/darken@latest/dist/darken.mjs"
  }
}

You can modify everything in this file and use the link command without arguments to update your links.

ezmm link
# Given the example above, 
# will link react 16.10 from skypack and darken from custom url

⌨️ Commands

link [name]

  • -p, --provider : Defines the CDN provider. (default: "skypack")
  • -u, --url : If used, uses this value as the CDN url.
  • -t, --tag : Specifies a version/dist tag to the module (only if the provider is compatible).
  • -nc, --no-check : If used, do not check the status of the CDN provider.
  • -nd, --no-default : If used do not try to import the export named "default".

The link command will link a module <name> in your modules directory and create an entry for the module in the modules.json file (will create new ones if they do not exist).

# Using the default provider
ezmm link react

# Using a custom CDN url
ezmm link react -u https://unpkg.com/react@16/umd/react.development.js 

You can also use the link command without argument to link all the modules in you modules.json file.

ezmm link

unlink <name>

The unlink command will delete a module <name> of your modules directory.

ezmm unlink react

help [command]

The help command will display the program help or the [command] help if specified.

# Program help
ezmm help

# Link command help
ezmm help link

You can also use the -h or --help option on any command to display the help.

ezmm link -h

⚙️ Configuration

📫 Providers

You can configure the providers of EZMM by editing the provider.json file in the package directory.

The default file will look like this:

{
  "default": "skypack",
  "providers": {
    "skypack": "https://cdn.skypack.dev/%n@%t",
    "jspm": "https://jspm.dev/%n@%t",
    "esm.sh": "https://esm.sh/%n@%t"
  }
}

On any provider you add you will probably need to give the module's name with %n and/or the module's version/dist tag with %t.

Do not hesitate to do a pull request to add providers to ezmm default provider.json.

📜 License

EZMM is distributed under the MIT License. See LICENSE for more information.

✉️ Contact

I am Colin Espinas you can contact me using my

Website Website Website Website

This project source's are at https://github.com/ColinEspinas/ezmm.