Add eslint import plugin and fix import ordering

.eslintrc.json

@@ -1,6 +1,11 @@
 {
-  "extends": ["eslint:recommended", "plugin:@typescript-eslint/recommended", "plugin:prettier/recommended"],
-  "plugins": ["@typescript-eslint"],
+  "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:import/recommended",
+    "plugin:prettier/recommended"
+  ],
+  "plugins": ["@typescript-eslint", "import"],
   "parser": "@typescript-eslint/parser",
   "parserOptions": {
     "ecmaVersion": 2020,
@@ -17,12 +22,30 @@
     "@typescript-eslint/no-explicit-any": 0,
     "@typescript-eslint/no-this-alias": 0,
     "@typescript-eslint/no-unused-vars": ["error", {"ignoreRestSiblings": true}],
+    "import/first": "warn",
+    "import/newline-after-import": "warn",
+    "import/no-import-module-exports": "warn",
+    "import/no-namespace": "error",
+    "import/no-relative-packages": "warn",
+    "import/no-unresolved": "off",
+    "import/no-unused-modules": "error",
+    "import/order": [
+      "warn",
+      {
+        "groups": ["builtin", "external", "parent", "sibling", "index"],
+        "alphabetize": {
+          "order": "asc",
+          "caseInsensitive": true
+        }
+      }
+    ],
     "no-cond-assign": 0,
     "no-constant-condition": 0,
     "no-sparse-arrays": 0,
     "no-unexpected-multiline": 0,
     "object-shorthand": ["warn", "always"],
-    "prettier/prettier": ["warn"]
+    "prettier/prettier": ["warn"],
+    "sort-imports": ["warn", {"ignoreDeclarationSort": true}]
   },
   "overrides": [
     {

package.json

@@ -56,6 +56,7 @@
     "d3-array": "^3.2.4",
     "eslint": "^8.50.0",
     "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-import": "^2.29.0",
     "eslint-plugin-prettier": "^5.0.0",
     "mocha": "^10.2.0",
     "prettier": "^3.0.3",

public/client.js

@@ -1,4 +1,4 @@
-import {Runtime, Library, Inspector} from "/_observablehq/runtime.js";
+import {Inspector, Library, Runtime} from "/_observablehq/runtime.js";
 
 const library = Object.assign(new Library(), {width, Mutable, ...recommendedLibraries()});
 const runtime = new Runtime(library);

src/files.ts

@@ -1,4 +1,4 @@
-import {accessSync, constants, statSync, type Stats} from "node:fs";
+import {type Stats, accessSync, constants, statSync} from "node:fs";
 import {mkdir, readdir, stat} from "node:fs/promises";
 import {dirname, extname, join, normalize, relative} from "node:path";
 import {isNodeError} from "./error.js";

src/javascript.ts

@@ -1,4 +1,4 @@
-import {Parser, tokTypes, type Node, type Options} from "acorn";
+import {type Node, type Options, Parser, tokTypes} from "acorn";
 import mime from "mime";
 import {findAwaits} from "./javascript/awaits.js";
 import {findDeclarations} from "./javascript/declarations.js";

src/javascript/imports.ts

@@ -1,8 +1,8 @@
-import {Parser, type Node} from "acorn";
-import {simple} from "acorn-walk";
 import {readFileSync} from "node:fs";
 import {dirname, join, normalize} from "node:path";
-import {parseOptions, type ImportReference, type JavaScriptNode} from "../javascript.js";
+import {type Node, Parser} from "acorn";
+import {simple} from "acorn-walk";
+import {type ImportReference, type JavaScriptNode, parseOptions} from "../javascript.js";
 import {getStringLiteralValue, isStringLiteral} from "./features.js";
 
 export function findImports(body: Node, root: string, sourcePath: string) {

src/markdown.ts

@@ -1,20 +1,20 @@
-import {getPatch, type Patch, type PatchItem} from "fast-array-diff";
+import {readFile} from "node:fs/promises";
+import {dirname, join} from "node:path";
+import {type Patch, type PatchItem, getPatch} from "fast-array-diff";
 import equal from "fast-deep-equal";
 import matter from "gray-matter";
 import hljs from "highlight.js";
 import {parseHTML} from "linkedom";
 import MarkdownIt from "markdown-it";
-import MarkdownItAnchor from "markdown-it-anchor";
 import {type RuleCore} from "markdown-it/lib/parser_core.js";
 import {type RuleInline} from "markdown-it/lib/parser_inline.js";
-import {type default as Renderer, type RenderRule} from "markdown-it/lib/renderer.js";
+import {type RenderRule, type default as Renderer} from "markdown-it/lib/renderer.js";
+import MarkdownItAnchor from "markdown-it-anchor";
 import mime from "mime";
-import {readFile} from "node:fs/promises";
 import {isLocalFile, pathFromRoot} from "./files.js";
 import {computeHash} from "./hash.js";
-import {transpileJavaScript, type FileReference, type ImportReference, type Transpile} from "./javascript.js";
+import {type FileReference, type ImportReference, type Transpile, transpileJavaScript} from "./javascript.js";
 import {transpileTag} from "./tag.js";
-import {dirname, join} from "node:path";
 
 export interface ReadMarkdownResult {
   contents: string;

src/navigation.ts

@@ -3,7 +3,7 @@ import {basename, dirname, extname, join} from "node:path";
 import {readConfig} from "./config.js";
 import {isNodeError} from "./error.js";
 import {visitFiles} from "./files.js";
-import {parseMarkdown, type ParseResult} from "./markdown.js";
+import {type ParseResult, parseMarkdown} from "./markdown.js";
 import {type RenderOptions} from "./render.js";
 
 export async function readPages(root: string): Promise<NonNullable<RenderOptions["pages"]>> {

src/preview.ts

@@ -1,18 +1,18 @@
-import {existsSync, watch, type FSWatcher, type WatchListener} from "node:fs";
+import {type FSWatcher, type WatchListener, existsSync, watch} from "node:fs";
 import {access, constants, readFile, stat} from "node:fs/promises";
-import {createServer, type IncomingMessage, type RequestListener} from "node:http";
+import {type IncomingMessage, type RequestListener, createServer} from "node:http";
 import {basename, dirname, extname, join, normalize} from "node:path";
 import {fileURLToPath} from "node:url";
 import {parseArgs} from "node:util";
 import send from "send";
-import {WebSocketServer, type WebSocket} from "ws";
+import {type WebSocket, WebSocketServer} from "ws";
 import {Loader} from "./dataloader.js";
 import {HttpError, isHttpError, isNodeError} from "./error.js";
 import {maybeStat} from "./files.js";
-import {diffMarkdown, readMarkdown, type ParseResult} from "./markdown.js";
+import {type ParseResult, diffMarkdown, readMarkdown} from "./markdown.js";
 import {readPages} from "./navigation.js";
 import {renderPreview} from "./render.js";
-import {makeCLIResolver, type CellResolver} from "./resolver.js";
+import {type CellResolver, makeCLIResolver} from "./resolver.js";
 
 const publicRoot = join(dirname(fileURLToPath(import.meta.url)), "..", "public");
 

src/render.ts

@@ -1,8 +1,8 @@
 import {dirname, join} from "node:path";
 import {computeHash} from "./hash.js";
-import {type FileReference, type ImportReference} from "./javascript.js";
 import {resolveImport} from "./javascript/imports.js";
-import {parseMarkdown, type CellPiece, type ParseResult} from "./markdown.js";
+import {type FileReference, type ImportReference} from "./javascript.js";
+import {type CellPiece, type ParseResult, parseMarkdown} from "./markdown.js";
 
 export interface Render {
   html: string;

test/build-test.ts

@@ -1,8 +1,8 @@
-import {difference} from "d3-array";
 import assert from "node:assert";
 import {existsSync, readdirSync, statSync} from "node:fs";
 import {readFile, rm} from "node:fs/promises";
 import {join, normalize, relative} from "node:path";
+import {difference} from "d3-array";
 import {build} from "../src/build.js";
 
 describe("build", async () => {

test/hash-test.ts

@@ -1,5 +1,5 @@
-import {computeHash} from "../src/hash.js";
 import assert from "node:assert";
+import {computeHash} from "../src/hash.js";
 
 describe("computeHash(content)", () => {
   it("returns the expected result", () => {

test/markdown-test.ts

@@ -2,9 +2,9 @@ import assert from "node:assert";
 import {readdirSync, statSync} from "node:fs";
 import {mkdir, readFile, unlink, writeFile} from "node:fs/promises";
 import {basename, join, resolve} from "node:path";
+import deepEqual from "fast-deep-equal";
 import {isNodeError} from "../src/error.js";
 import {type ParseResult, parseMarkdown} from "../src/markdown.js";
-import deepEqual from "fast-deep-equal";
 
 describe("parseMarkdown(input)", () => {
   const inputRoot = "test/input";