Add support for es module and browser-only environment

Makefile

@@ -53,7 +53,16 @@ EMFLAGS_WASM = \
 EMFLAGS_OPTIMIZED= \
 	-Oz \
 	-flto \
-	--closure 1
+	--closure 1 \
+	--closure-args=--externs=./src/externs.js
+
+EMFLAGS_ESMODULE= \
+	-s EXPORT_ES6=1 \
+	-s MODULARIZE=1 \
+	-s EXPORT_NAME=loadWASM \
+
+EMFLAGS_WEB= \
+	-s ENVIRONMENT=web
 
 EMFLAGS_DEBUG = \
 	-s ASSERTIONS=1 \
@@ -88,7 +97,7 @@ dist/sql-wasm-debug.js: $(BITCODE_FILES) $(OUTPUT_WRAPPER_FILES) $(SOURCE_API_FI
 	rm out/tmp-raw.js
 
 .PHONY: optimized
-optimized: dist/sql-asm.js dist/sql-wasm.js dist/sql-asm-memory-growth.js
+optimized: dist/sql-asm.js dist/sql-wasm.js dist/sql-asm-memory-growth.js dist/sql-wasm-module.js dist/sql-wasm-module-web.js
 
 dist/sql-asm.js: $(BITCODE_FILES) $(OUTPUT_WRAPPER_FILES) $(SOURCE_API_FILES) $(EXPORTED_METHODS_JSON_FILES)
 	$(EMCC) $(EMFLAGS) $(EMFLAGS_OPTIMIZED) $(EMFLAGS_ASM) $(BITCODE_FILES) $(EMFLAGS_PRE_JS_FILES) -o $@
@@ -102,6 +111,12 @@ dist/sql-wasm.js: $(BITCODE_FILES) $(OUTPUT_WRAPPER_FILES) $(SOURCE_API_FILES) $
 	cat src/shell-pre.js out/tmp-raw.js src/shell-post.js > $@
 	rm out/tmp-raw.js
 
+dist/sql-wasm-module.js: $(BITCODE_FILES) $(OUTPUT_WRAPPER_FILES) $(SOURCE_API_FILES) $(EXPORTED_METHODS_JSON_FILES)
+	$(EMCC) $(EMFLAGS) $(EMFLAGS_OPTIMIZED) $(EMFLAGS_ESMODULE) $(EMFLAGS_WASM) $(BITCODE_FILES) $(EMFLAGS_PRE_JS_FILES) -o $@
+
+dist/sql-wasm-module-web.js: $(BITCODE_FILES) $(OUTPUT_WRAPPER_FILES) $(SOURCE_API_FILES) $(EXPORTED_METHODS_JSON_FILES)
+	$(EMCC) $(EMFLAGS) $(EMFLAGS_OPTIMIZED) $(EMFLAGS_ESMODULE) $(EMFLAGS_WEB) $(EMFLAGS_WASM) $(BITCODE_FILES) $(EMFLAGS_PRE_JS_FILES) -o $@
+
 dist/sql-asm-memory-growth.js: $(BITCODE_FILES) $(OUTPUT_WRAPPER_FILES) $(SOURCE_API_FILES) $(EXPORTED_METHODS_JSON_FILES)
 	$(EMCC) $(EMFLAGS) $(EMFLAGS_OPTIMIZED) $(EMFLAGS_ASM_MEMORY_GROWTH) $(BITCODE_FILES) $(EMFLAGS_PRE_JS_FILES) -o $@
 	mv $@ out/tmp-raw.js

README.md

@@ -112,6 +112,18 @@ There are a few examples [available here](https://sql-js.github.io/sql.js/index.
 ## Examples
 The test files provide up to date example of the use of the api.
 ### Inside the browser
+
+#### Using ES Modules
+This package supports exports an es module that works with bundlers like webpack:
+```js
+const SQL = await import("sql.js");
+
+const db = new SQL.Database();
+console.log(db.exec("select 1"));
+```
+
+You may need to enable features in your bundler, e.g. `asyncWebassembly` and `topLevelAwait` in [Webpack 5](https://webpack.js.org/configuration/experiments/).
+
 #### Example **HTML** file:
 ```html
 <meta charset="utf8" />

module-web.js

@@ -0,0 +1,5 @@
+import * as wasm from "./dist/sql-wasm-module-web"
+
+const def = await wasm.default();
+
+export const Database = def.Database;

module.js

@@ -0,0 +1,5 @@
+import * as wasm from "./dist/sql-wasm-module"
+
+const def = await wasm.default();
+
+export const Database = def.Database;

package.json

@@ -18,6 +18,10 @@
 	],
 	"license": "MIT",
 	"main": "./dist/sql-wasm.js",
+	"module": "./module.js",
+	"browser": {
+		"./module.js": "./module-web.js"
+	},
 	"scripts": {
 		"build": "make",
 		"rebuild": "npm run clean && npm run build",

src/externs.js

@@ -0,0 +1,49 @@
+
+Module.Database = class Database {
+  constructor(data) {}
+  run(sql, params) {}
+  exec(sql, params, config) {}
+  each(sql, params, callback, done, config) {}
+  prepare(sql, params) {}
+  iterateStatements(sql) {}
+  export() {}
+  close() {}
+  handleError(returnCode) {}
+  getRowsModified() {}
+  create_function() {}
+  create_aggregate() {}
+}
+
+Module.Statement = class Statement {
+  constructor(stmt, db) {}
+  bind(values) {}
+  step() {}
+  getNumber(pos) {}
+  getBigInt(pos) {}
+  getString(pos) {}
+  getBlob(pos) {}
+  get(params, config) {}
+  getColumnNames() {}
+  getAsObject() {}
+  getSQL() {}
+  getNormalizedSQL() {}
+  run(values) {}
+  bindString(string, pos) {}
+  bindBlob(array, pos) {}
+  bindNumber(num, pos) {}
+  bindNull(pos) {}
+  bindVlaue(val, pos) {}
+  bindFromObject(valuesObj) {}
+  bindFromArray(values) {}
+  reset() {}
+  freemem() {}
+  free() {}
+}
+
+Module.StatementItearator = class StatementIterator {
+  constructor(sql, obj) {}
+  next() {}
+  finalize() {}
+  getRemainingSQL() {}
+  // [Symbol.iterator]() {} // XXX: Causes closure compiler error? com.google.javascript.rhino.Node cannot be cast to com.google.javascript.rhino.Node$StringNode
+}