Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including esm-iso with all npm packages installed. Try it out:

var esmIso = require("esm-iso")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

esm-iso v0.0.6

Isomorphic ESM Loader

esm-iso

An esm companion for isomorphic JS modules.

node -r esm -r esm-iso server.js

Examples

Try out the live demo with its example code.

The summary is explained in here:

import path from 'path';
import express from 'express';

// used to redirect client calls
const redirect = Object.assign(
  Object.create(null),
  {
    // import * from '/m/generic';
    // =>
    // import * from '/m/detailed/path/esm/index.js';
    'generic': 'detailed/path/esm/index.js'
  }
);

const app = express();
app.use('/m/', (req, res, next) => {
  const mod = req.url.replace(/\?[\S\s]*$/, '').replace(/^\/|\/$/g, '');
  if (mod in redirect) res.redirect('/m/' + redirect[mod]);
  else next();
});
app.use('/m/', express.static(
  // that's it: your browser can now load any module
  path.join(__dirname, 'node_modules')
));

import module from '/m/generic';
module.log('🎉');

You can use similar approach to also load any other module file:

<script src="/m/generic/min.js"></script>

Alternatives

If you want a more explicit version that uses /node_modules/ instead of /m/ as both client and server loader, you can check slash-node-modules-loader out: same loader, but with a more semantic absolute path.

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free