• Stars
    star
    136
  • Rank 267,670 (Top 6 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 5 years ago
  • Updated over 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Use URLs in your Rollup imports

rollup-plugin-url-resolve

The goal of this plugin is to avoid the need to use npm or yarn clients to explicitly install your dependencies from the registry before you bundle. Instead of specifying your dependencies in package.json, you specify them in your source code as URLs in import statements. Then Rollup dynamically fetches and includes those dependencies when you bundle.

For example, you could put the following in your rollup.config.js:

import urlResolve from 'rollup-plugin-url-resolve';

export default {
  // ...
  plugins: [urlResolve()]
};

Then, in your source files, you can do stuff like this:

import * as d3 from 'https://unpkg.com/d3?module';

Run rollup, and you're done. No more npm install! :) Well, at least not for your app's dependencies.

Currently, the following URL protocols are supported:

  • https: and http:
  • file:
  • data:

It might help to think about this plugin as an alternative to rollup-plugin-node-resolve, but for any URL, not just stuff you've already installed in node_modules.

Options

The urlResolve function accepts all the same options as make-fetch-happen. They are used when we need to fetch a module from a remote URL. One option that is particularly useful is cacheManager, which can be used to cache the results of fetch operations on disk. This can make your builds a lot faster if many of your URLs point to remote servers.

import urlResolve from 'rollup-plugin-url-resolve';

export default {
  // ...
  plugins: [
    urlResolve({
      // Caches the results of all fetch operations
      // in a local directory named ".cache"
      cacheManager: '.cache'
    })
  ]
};

There are various other options as well, including support for retrying failed requests and proxy servers. Please see the list of options for more information.

Using CommonJS

You could also try using a URL that returns CommonJS, though you won't get the benefit of tree-shaking that using JavaScript modules provides. Still, it can be a useful stopgap until a package you need starts publishing JavaScript modules.

If you do this, you'll probably want to use rollup-plugin-commonjs on those URLs in your Rollup config, just like you would normally do for stuff in node_modules:

import commonjs from 'rollup-plugin-commonjs';
import urlResolve from 'rollup-plugin-url-resolve';

export default {
  // ...
  plugins: [
    urlResolve(),
    commonjs({
      // Treat unpkg URLs as CommonJS
      include: /^https:\/\/unpkg\.com/,
      // ...except for unpkg ?module URLs
      exclude: /^https:\/\/unpkg\.com.*?\?.*?\bmodule\b/
    })
  ]
};

License

MIT

More Repositories

1

unpkg

The CDN for everything on npm
JavaScript
2,989
star
2

expect

Write better assertions
JavaScript
2,291
star
3

mach

HTTP for JavaScript
JavaScript
812
star
4

http-client

Compose HTTP clients using JavaScript's fetch API
JavaScript
506
star
5

web-starter

Build and deploy a React website quickly on Heroku
JavaScript
417
star
6

citrus

Parsing Expressions for Ruby
Ruby
403
star
7

strata

A modular, streaming HTTP server for node.js
JavaScript
365
star
8

then-redis

A fast, promise-based Redis client for node.js
JavaScript
315
star
9

shadowbox

A beautiful, versatile lightbox for photos and videos
JavaScript
296
star
10

react-loop-2019

Notes and code examples from my React Loop 2019 Keynote
JavaScript
116
star
11

resolve-pathname

Resolve URL pathnames using JavaScript
JavaScript
63
star
12

expect-element

Write better assertions for DOM nodes
JavaScript
61
star
13

my-react

An experimental drop-in replacement for React without ES6 classes or "this"
JavaScript
58
star
14

dotfiles

My dotfiles
Vim Script
57
star
15

unpkg-demos

Experiments in how to use unpkg
HTML
54
star
16

history-server

An HTTP server for single-page apps that use the HTML5 history API
JavaScript
52
star
17

rack-accept

HTTP Accept* for Ruby/Rack
Ruby
46
star
18

mint

A small, fast documentation generator for literate-style programming
JavaScript
41
star
19

sinatra-session

Simple, secure sessions for Sinatra
Ruby
38
star
20

firework

A distributed, fault-tolerant work queue for Firebase
JavaScript
38
star
21

s3-thumb-server

Serve thumbnails of images stored on S3 over HTTP
JavaScript
35
star
22

ember-firebase

Firebase bindings for Ember.js
JavaScript
32
star
23

value-equal

Are these two JavaScript values equal?
JavaScript
31
star
24

monterey

Minimal OOP for JavaScript
JavaScript
31
star
25

optionparser

Command-line option parser for PHP
PHP
29
star
26

bufferedstream

A robust stream implementation for node.js and the browser
JavaScript
27
star
27

tree-shaking-react-router

Tree-shaking React Router with webpack 4
JavaScript
25
star
28

icare

A badge to promote empathy in software design, craftsmanship, and maintenance
HTML
25
star
29

react-style

Declarative styling for React components
JavaScript
21
star
30

remix-ssg-example

Small example of how to statically generate a Remix site using wget
TypeScript
19
star
31

dropbox-client

Dropbox API v2 client for JavaScript
JavaScript
17
star
32

bencode

Bencode library for PHP
PHP
15
star
33

reactjsday-2018

Demo + slides from my ReactJS Day 2018 keynote in Verona, Italy
JavaScript
14
star
34

symboltable

A Symbols-only Hash for Ruby
Ruby
13
star
35

broccoli-rev

A Broccoli plugin for adding revision checksums to file names
JavaScript
13
star
36

Fullscreen

A fullscreen sample app for Cocoa with MacRuby
Ruby
12
star
37

yuicompressor

A YUI JavaScript and CSS compressor wrapper for Ruby and JRuby
Ruby
12
star
38

react-router-examples

Code examples for React Router v6
TypeScript
12
star
39

usererror

A base class for JavaScript errors
JavaScript
12
star
40

plural

Pluralization library for PHP
PHP
12
star
41

grand

Generate random data in JavaScript
JavaScript
12
star
42

babel-plugin-import-visitor

Visit all import sources in Babel
JavaScript
10
star
43

then-couchdb

A promise-based CouchDB client for node.js
JavaScript
9
star
44

mwrc2012

Sample code from my talk at MWRC 2012
Ruby
8
star
45

multipart-web-stream

A streaming parser for multipart fetch streams
TypeScript
8
star
46

chatter

A little chat server for #CodeClass
JavaScript
6
star
47

markdown

Markdown as a Service
Ruby
5
star
48

http-client-cookie-jar

Cookie jar middleware for http-client
JavaScript
5
star
49

stratajs.org

The web site for the Strata web framework
JavaScript
5
star
50

form-data-parser

A request.formData() wrapper with pluggable file upload handling
TypeScript
5
star
51

maker

Small library for quickly constructing large segments of HTML in JavaScript
JavaScript
5
star
52

fetch-super-headers

A suite of tools that make it a little more fun to work with Headers
TypeScript
4
star
53

sinatra-spec

Simple specs for Sinatra apps using MiniTest
Ruby
3
star
54

broccoli-select

A Broccoli plugin for selecting files based on glob patterns
JavaScript
3
star
55

jview

A subclass of jQuery.fn for creating views in JavaScript
JavaScript
3
star
56

sequel-factory

Simple, powerful factories for Sequel models
Ruby
3
star
57

describe-property

Define JavaScript object properties quickly with ES5 defaults
JavaScript
3
star
58

mwrc2010

Rack For Web Developers - My presentation from MountainWest RubyConf 2010
Ruby
2
star
59

esbuild-node-builtins-sideeffects

JavaScript
2
star
60

rollup-watch-dir

JavaScript
2
star
61

html5-devconf-may2014

The slides and examples from my presentation at HTML5 DevConf on May 22, 2014
JavaScript
2
star
62

react-router-monorepo-stub

JavaScript
2
star
63

esbuild-empty-file-test

JavaScript
2
star
64

rollup-plugin-babel-bug

JavaScript
2
star
65

rubyconf2010

Grammars, Parsers, and Interpreters. In Ruby. ~ My presentation from RubyConf 2010
Ruby
2
star
66

lazy-file

Lazy, streaming files for JavaScript
TypeScript
2
star
67

jquery-pop

Painless views as models for jQuery
1
star
68

jdrag

Simple drag and drop for jQuery
JavaScript
1
star
69

redemption-from-callback-hell

JavaScript
1
star
70

mjackson.me

JavaScript
1
star
71

file-system

A simple filesystem for JavaScript, based on the File and Streams APIs
TypeScript
1
star
72

JavaScriptObjectsAndPatterns

Some code examples for a class I did for Twitter's HackWeek Q4 2012
JavaScript
1
star
73

mwrc2011

My presentation from MWRC 2011
1
star
74

hoedown2010

My presentation & code for the Ruby Hoedown 2010
1
star