Support importing files as dataurl

cmd/esbuild/main.go

@@ -45,7 +45,7 @@ Options:
   --jsx-factory=...     What to use instead of React.createElement
   --jsx-fragment=...    What to use instead of React.Fragment
   --loader:X=L          Use loader L to load file extension X, where L is
-                        one of: js, jsx, ts, tsx, json, text, base64
+                        one of: js, jsx, ts, tsx, json, text, base64, dataurl
 
 Advanced options:
   --version             Print the current version and exit (` + esbuildVersion + `)
@@ -159,6 +159,8 @@ func (args *argsObject) parseLoader(text string) bundler.Loader {
 		return bundler.LoaderText
 	case "base64":
 		return bundler.LoaderBase64
+	case "dataurl":
+		return bundler.LoaderDataURL
 	default:
 		return bundler.LoaderNone
 	}

internal/bundler/bundler.go

@@ -5,6 +5,8 @@ import (
 	"encoding/base64"
 	"fmt"
 	"io/ioutil"
+	"mime"
+	"net/http"
 	"os"
 	"sort"
 	"strings"
@@ -147,6 +149,18 @@ func parseFile(
 		ast := parser.ModuleExportsAST(log, source, parseOptions, expr)
 		results <- parseResult{source, ast, true}
 
+	case LoaderDataURL:
+		mimeType := mime.TypeByExtension(extension)
+
+		if mimeType == "" {
+			mimeType = http.DetectContentType([]byte(source.Contents))
+		}
+		encoded := base64.StdEncoding.EncodeToString([]byte(source.Contents))
+		url := "data:" + mimeType + ";base64," + encoded
+		expr := ast.Expr{ast.Loc{0}, &ast.EString{lexer.StringToUTF16(url)}}
+		ast := parser.ModuleExportsAST(log, source, parseOptions, expr)
+		results <- parseResult{source, ast, true}
+
 	default:
 		log.AddRangeError(importSource, pathRange, fmt.Sprintf("File extension not supported: %s", path))
 		results <- parseResult{}
@@ -281,6 +295,7 @@ const (
 	LoaderJSON
 	LoaderText
 	LoaderBase64
+	LoaderDataURL
 )
 
 func DefaultExtensionToLoaderMap() map[string]Loader {

internal/bundler/bundler_test.go

@@ -2413,6 +2413,80 @@ func TestRequireCustomExtensionBase64(t *testing.T) {
 	})
 }
 
+func TestRequireCustomExtensionDataURL(t *testing.T) {
+	expectBundled(t, bundled{
+		files: map[string]string{
+			"/entry.js": `
+				console.log(require('./test.custom'))
+			`,
+			"/test.custom": "a\x00b\x80c\xFFd",
+		},
+		entryPaths: []string{"/entry.js"},
+		parseOptions: parser.ParseOptions{
+			IsBundling: true,
+		},
+		bundleOptions: BundleOptions{
+			IsBundling:    true,
+			AbsOutputFile: "/out.js",
+			ExtensionToLoader: map[string]Loader{
+				".js":     LoaderJS,
+				".custom": LoaderDataURL,
+			},
+		},
+		expected: map[string]string{
+			"/out.js": `bootstrap({
+  1(exports, module) {
+    // /test.custom
+    module.exports = "data:application/octet-stream;base64,YQBigGP/ZA==";
+  },
+
+  0() {
+    // /entry.js
+    console.log(__require(1 /* ./test.custom */));
+  }
+}, 0);
+`,
+		},
+	})
+}
+
+func testAutoDetectMimeTypeFromExtension(t *testing.T) {
+	expectBundled(t, bundled{
+		files: map[string]string{
+			"/entry.js": `
+				console.log(require('./test.svg'))
+			`,
+			"/test.svg": "a\x00b\x80c\xFFd",
+		},
+		entryPaths: []string{"/entry.js"},
+		parseOptions: parser.ParseOptions{
+			IsBundling: true,
+		},
+		bundleOptions: BundleOptions{
+			IsBundling:    true,
+			AbsOutputFile: "/out.js",
+			ExtensionToLoader: map[string]Loader{
+				".js":  LoaderJS,
+				".svg": LoaderDataURL,
+			},
+		},
+		expected: map[string]string{
+			"/out.js": `bootstrap({
+  1(exports, module) {
+    // /test.svg
+    module.exports = "data:image/svg+xml;base64,YQBigGP/ZA==";
+  },
+
+  0() {
+    // /entry.js
+    console.log(__require(1 /* ./test.svg */));
+  }
+}, 0);
+`,
+		},
+	})
+}
+
 func TestRequireBadExtension(t *testing.T) {
 	expectBundled(t, bundled{
 		files: map[string]string{

npm/esbuild/lib/main.d.ts

@@ -1,7 +1,7 @@
 export declare type Target = 'esnext' | 'es6' | 'es2015' | 'es2016' | 'es2017' | 'es2018' | 'es2019' | 'es2020';
 export declare type Platform = 'browser' | 'node';
 export declare type Format = 'iife' | 'cjs';
-export declare type Loader = 'js' | 'jsx' | 'ts' | 'tsx' | 'json' | 'text' | 'base64';
+export declare type Loader = 'js' | 'jsx' | 'ts' | 'tsx' | 'json' | 'text' | 'base64' | 'dataurl';
 
 interface CommonOptions {
   sourcemap?: boolean | 'inline' | 'external';

scripts/js-api-tests.js

@@ -61,6 +61,11 @@ let tests = {
     assert.strictEqual(js, `module.exports = "AAEC";\n`)
   },
 
+  async dataurl({ service }) {
+    const { js } = await service.transform(`\x00\x01\x02`, { loader: 'dataurl' })
+    assert.strictEqual(js, `module.exports = "data:application/octet-stream;base64,AAEC";\n`)
+  },
+
   async sourceMap({ service }) {
     const { js, jsSourceMap } = await service.transform(`let       x`, { sourcemap: true })
     assert.strictEqual(js, `let x;\n`)