/uniroll

Opinionated universal frontend bundler in browser

Primary LanguageTypeScript

uniroll

Opinionated frontend compiler in browser.

  • Bundle in browser for rapid prototyping
  • Resolve modules by https://esm.sh
  • Transpile typescript

How it works

  • Create virtual fs by rollup-plugin-virtual-fs
  • Load npm modules via rollup-plugin-http-resolve
  • Compile with typescript
  • Compile with rollup

Run in browser

npm install uniroll typescript rollup --save
import { bundle } from "uniroll";
const files = {
  "/foo.tsx": "export default 1",
  "/index.tsx": "import foo from 'foo';\nconsole.log('hello', foo)",
};
const bundled = await bundle({
  files,
  input: "/index.tsx",
});
const out = await bundled.generate({ format: "esm" });
console.log(out.output[0]);

CLI

Run compiler with same logics.

$ npm install uniroll-tools -g
$ uniroll foo.js -o out.js

TODO: Options Documentation

How to develop

# If you are not on MacOS try running `yarn --ignore-platform` instead of `yarn install`.
yarn install
yarn build
yarn test

How to build your uniroll

yarn add uniroll typescript rollup
# If you want to use uniroll-svelte, add svelte

Add this wepback rules

module.exports = {
  // ...
  module: {
    rules: [
      // ...
      {
        test: /\.js$/,
        include: /pluginutils/, // for @rollup/pluginutils
        type: "javascript/auto",
      },
    ],
  },
};

ChangeLog

v3

  • Drop rollup-plugin-memfs and add new rollup-plugin-virtual-fs
  • Use https://esm.sh

v2

TODO

  • Documentation
  • CSS Loader / Optimizer
  • Svelte usages
  • include tslib

LICENSE

MIT