build with esbuild; support Node 18+ (#963)

* build with esbuild

* fix import attributes

* semi-functional esbuild for mocha

* process.env.npm_package_version

* downgrade to Node16

* one more process.env.npm_package_version

* getClientPath fixes

* allow node 18+

* fix c8

* support observablehq.config.ts

* glob + build.js

* --sourcemap=linked

* logLevel: info

* logging

* logging?

* separate arguments?

* log positionals?

* log arguments

* double quotes?

* fix missing pathToFileURL

* remove extra logging

* prepublishOnly; shebang

* format=esm; fix bin

* Node 18+

Author: mbostock

.github/workflows/test.yml

@@ -21,7 +21,7 @@ jobs:
           node-version: ${{ matrix.version }}
           cache: yarn
       - run: yarn --frozen-lockfile
-      - run: yarn c8 --check-coverage -x src/**/*.d.ts -x src/preview.ts -x src/observableApiConfig.ts -x src/client -x src/convert.ts --lines 80 --per-file yarn test:mocha
+      - run: yarn test:coverage
       - run: yarn test:tsc
       - run: |
           echo ::add-matcher::.github/eslint.json

.gitignore

@@ -1,11 +1,13 @@
-.env
-.DS_Store
 **/.observablehq/cache/
-coverage/
-docs/themes.md
-docs/theme/*.md
-dist/
+.DS_Store
+.env
+/build.test/
+/build/
+/coverage/
+/dist/
+/docs/theme/*.md
+/docs/themes.md
+/test/output/**/*-changed.*
+/test/output/build/**/*-changed/
 node_modules/
-test/output/**/*-changed.*
-test/output/build/**/*-changed/
 yarn-error.log

bin/observable-init.js

@@ -0,0 +1,24 @@
+import {parseArgs} from "node:util";
+import {build} from "esbuild";
+import {glob} from "glob";
+
+const {values, positionals} = parseArgs({
+  allowPositionals: true,
+  options: {
+    outdir: {type: "string", default: "build"},
+    outbase: {type: "string"},
+    ignore: {type: "string", multiple: true},
+    sourcemap: {type: "boolean"}
+  }
+});
+
+await build({
+  entryPoints: await glob(positionals, {ignore: values.ignore}),
+  define: {"process.env.npm_package_version": `"${process.env.npm_package_version}"`},
+  outdir: values.outdir,
+  outbase: values.outbase,
+  platform: "node",
+  sourcemap: values.sourcemap ? "linked" : false,
+  format: "esm",
+  logLevel: "info"
+});

build.js

@@ -84,7 +84,7 @@ These are just first steps. You can continue to develop projects after publishin
 Framework includes a helper script (`observable create`) for creating new projects. After a few quick prompts — where to create the project, your preferred package manager, *etc.* — it will stamp out a fresh project from a template.
 
 <div class="tip">
-  <p>Framework is a <a href="https://nodejs.org/">Node.js</a> application published to npm. You must have <a href="https://nodejs.org/en/download">Node.js 20.6 or later</a> installed before you can install Framework. Framework is a command-line interface (CLI) and runs in the terminal.</p>
+  <p>Framework is a <a href="https://nodejs.org/">Node.js</a> application published to npm. You must have <a href="https://nodejs.org/en/download">Node.js 18 or later</a> installed before you can install Framework. Framework is a command-line interface (CLI) and runs in the terminal.</p>
   <p>If you run into difficulty following this tutorial, we’re happy to help! Please visit the <a href="https://talk.observablehq.com">Observable forum</a> or our <a href="https://github.com/observablehq/framework/discussions">GitHub discussions</a>.</p>
 </div>
 

docs/getting-started.md

@@ -3,12 +3,12 @@
   "scripts": {
     "dev": "observable preview",
     "build": "rm -rf dist && observable build",
-    "postinstall": "ln -sf ../../../../bin/observable-init.js node_modules/.bin/observable"
+    "postinstall": "ln -sf ../../../../build/bin/observable.js node_modules/.bin/observable"
   },
   "dependencies": {
     "@observablehq/framework": "link:../.."
   },
   "engines": {
-    "node": ">=20.6"
+    "node": ">=18"
   }
 }

examples/api/package.json

@@ -3,7 +3,7 @@
   "scripts": {
     "dev": "observable preview",
     "build": "rm -rf dist && observable build",
-    "postinstall": "ln -sf ../../../../bin/observable-init.js node_modules/.bin/observable"
+    "postinstall": "ln -sf ../../../../build/bin/observable.js node_modules/.bin/observable"
   },
   "dependencies": {
     "@observablehq/framework": "link:../..",
@@ -12,6 +12,6 @@
     "jszip": "^3.10.1"
   },
   "engines": {
-    "node": ">=20.6"
+    "node": ">=18"
   }
 }

examples/chess/package.json

@@ -3,7 +3,7 @@
   "scripts": {
     "dev": "observable preview",
     "build": "rm -rf dist && observable build",
-    "postinstall": "ln -sf ../../../../bin/observable-init.js node_modules/.bin/observable"
+    "postinstall": "ln -sf ../../../../build/bin/observable.js node_modules/.bin/observable"
   },
   "dependencies": {
     "@observablehq/framework": "link:../..",
@@ -13,6 +13,6 @@
     "topojson-simplify": "^3.0.3"
   },
   "engines": {
-    "node": ">=20.6"
+    "node": ">=18"
   }
 }

examples/eia/package.json

@@ -3,15 +3,15 @@
   "scripts": {
     "dev": "observable preview",
     "build": "rm -rf dist && observable build",
-    "postinstall": "ln -sf ../../../../bin/observable-init.js node_modules/.bin/observable"
+    "postinstall": "ln -sf ../../../../build/bin/observable.js node_modules/.bin/observable"
   },
   "dependencies": {
     "@google-analytics/data": "^4.3.0",
     "@observablehq/framework": "link:../..",
     "dotenv": "^16.3.1"
   },
   "engines": {
-    "node": ">=20.6"
+    "node": ">=18"
   },
   "devDependencies": {
     "@types/node": "^20.10.6"

examples/google-analytics/package.json

@@ -3,12 +3,12 @@
   "scripts": {
     "dev": "observable preview",
     "build": "rm -rf dist && observable build",
-    "postinstall": "ln -sf ../../../../bin/observable-init.js node_modules/.bin/observable"
+    "postinstall": "ln -sf ../../../../build/bin/observable.js node_modules/.bin/observable"
   },
   "dependencies": {
     "@observablehq/framework": "link:../.."
   },
   "engines": {
-    "node": ">=20.6"
+    "node": ">=18"
   }
 }