Inline babel-plugin-unpkg-rewrite

server/middleware/serveFile.js

@@ -2,10 +2,10 @@ const fs = require("fs")
 const path = require("path")
 const etag = require("etag")
 const babel = require("babel-core")
-const unpkgRewrite = require("babel-plugin-unpkg-rewrite")
 const getMetadata = require("./utils/getMetadata")
 const getFileContentType = require("./utils/getFileContentType")
 const getIndexHTML = require("./utils/getIndexHTML")
+const unpkgRewrite = require("./utils/unpkgRewriteBabelPlugin")
 
 /**
  * Automatically generate HTML pages that show package contents.
@@ -37,6 +37,7 @@ function serveFile(req, res) {
     getMetadata(req.packageDir, req.filename, req.stats, MaximumDepth, (error, metadata) => {
       if (error) {
         console.error(error)
+
         res
           .status(500)
           .type("text")
@@ -64,12 +65,14 @@ function serveFile(req, res) {
       rewriteBareModuleIdentifiers(file, req.packageConfig, (error, code) => {
         if (error) {
           console.error(error)
+
           const debugInfo =
             error.constructor.name +
             ": " +
             error.message.replace(/^.*?\/unpkg-.+?\//, `/${req.packageSpec}/`) +
             "\n\n" +
             error.codeFrame
+
           res
             .status(500)
             .type("text")
@@ -129,6 +132,7 @@ function serveFile(req, res) {
       },
       error => {
         console.error(error)
+
         res
           .status(500)
           .type("text")

server/middleware/utils/__tests__/unpkgRewriteBabelPlugin-test.js

@@ -0,0 +1,76 @@
+const babel = require("babel-core")
+const unpkgRewrite = require("../unpkgRewriteBabelPlugin")
+
+const testCases = [
+  {
+    before: "import React from 'react';",
+    after: "import React from 'https://unpkg.com/react@15.6.1?module';"
+  },
+  {
+    before: "import router from '@angular/router';",
+    after: "import router from 'https://unpkg.com/@angular/router@4.3.5?module';"
+  },
+  {
+    before: "import map from 'lodash.map';",
+    after: "import map from 'https://unpkg.com/lodash.map@4.6.0?module';"
+  },
+  {
+    before: "import fs from 'pn/fs';",
+    after: "import fs from 'https://unpkg.com/pn@1.0.0/fs?module';"
+  },
+  {
+    before: "import cupcakes from './cupcakes';",
+    after: "import cupcakes from './cupcakes?module';"
+  },
+  {
+    before: "import shoelaces from '/shoelaces';",
+    after: "import shoelaces from '/shoelaces?module';"
+  },
+  {
+    before: "import something from '//something.com/whatevs';",
+    after: "import something from '//something.com/whatevs';"
+  },
+  {
+    before: "import something from 'http://something.com/whatevs';",
+    after: "import something from 'http://something.com/whatevs';"
+  },
+  {
+    before: "let ReactDOM = require('react-dom');",
+    after: "let ReactDOM = require('react-dom');"
+  },
+  {
+    before: "export React from 'react';",
+    after: "export React from 'https://unpkg.com/react@15.6.1?module';"
+  },
+  {
+    before: "export { Component } from 'react';",
+    after: "export { Component } from 'https://unpkg.com/react@15.6.1?module';"
+  },
+  {
+    before: "export * from 'react';",
+    after: "export * from 'https://unpkg.com/react@15.6.1?module';"
+  },
+  {
+    before: "export var message = 'hello';",
+    after: "export var message = 'hello';"
+  }
+]
+
+const dependencies = {
+  react: "15.6.1",
+  "@angular/router": "4.3.5",
+  "lodash.map": "4.6.0",
+  pn: "1.0.0"
+}
+
+describe("Rewriting imports/exports", () => {
+  testCases.forEach(testCase => {
+    it(`successfully rewrites "${testCase.before}"`, () => {
+      const result = babel.transform(testCase.before, {
+        plugins: [unpkgRewrite(dependencies)]
+      })
+
+      expect(result.code).toEqual(testCase.after)
+    })
+  })
+})

server/middleware/utils/unpkgRewriteBabelPlugin.js

@@ -0,0 +1,44 @@
+const URL = require("whatwg-url")
+const warning = require("warning")
+
+const BareIdentifierFormat = /^((?:@[^\/]+\/)?[^\/]+)(\/.*)?$/
+
+function unpkgRewriteBabelPlugin(dependencies = {}) {
+  return {
+    inherits: require("babel-plugin-syntax-export-extensions"),
+
+    visitor: {
+      "ImportDeclaration|ExportNamedDeclaration|ExportAllDeclaration"(path) {
+        if (!path.node.source) return // probably a variable declaration
+
+        if (
+          URL.parseURL(path.node.source.value) != null ||
+          path.node.source.value.substr(0, 2) === "//"
+        )
+          return // valid URL or URL w/o protocol, leave it alone
+
+        if ([".", "/"].indexOf(path.node.source.value.charAt(0)) >= 0) {
+          // local path
+          path.node.source.value = `${path.node.source.value}?module`
+        } else {
+          // "bare" identifier
+          const match = BareIdentifierFormat.exec(path.node.source.value)
+          const packageName = match[1]
+          const file = match[2] || ""
+
+          warning(
+            dependencies[packageName],
+            'Missing version info for package "%s" in dependencies; falling back to "latest"',
+            packageName
+          )
+
+          const version = dependencies[packageName] || "latest"
+
+          path.node.source.value = `https://unpkg.com/${packageName}@${version}${file}?module`
+        }
+      }
+    }
+  }
+}
+
+module.exports = unpkgRewriteBabelPlugin