🔨 improve(none): reuse ink instance

config/tsconfig.json

@@ -11,7 +11,7 @@
     "forceConsistentCasingInFileNames": true,
     "importHelpers": true,
     "incremental": true,
-    "jsx": "react-jsxdev",
+    "jsx": "react-jsx",
     "jsxImportSource": "@roots/bud-support",
     "lib": ["ES2022", "DOM", "DOM.Iterable"],
     "module": "NodeNext",
@@ -73,23 +73,15 @@
     {"path": "../sources/@roots/bud-wordpress-externals/tsconfig.json"},
     {"path": "../sources/@roots/bud-wordpress-theme-json/tsconfig.json"},
     {"path": "../sources/@roots/container/tsconfig.json"},
-    {
-      "path": "../sources/@roots/critical-css-webpack-plugin/tsconfig.json"
-    },
+    {"path": "../sources/@roots/critical-css-webpack-plugin/tsconfig.json"},
     {"path": "../sources/@roots/dependencies/tsconfig.json"},
     {"path": "../sources/@roots/entrypoints-webpack-plugin/tsconfig.json"},
     {"path": "../sources/@roots/filesystem/tsconfig.json"},
     {"path": "../sources/@roots/sage/tsconfig.json"},
-    {
-      "path": "../sources/@roots/wordpress-dependencies-webpack-plugin/tsconfig.json"
-    },
-    {
-      "path": "../sources/@roots/wordpress-externals-webpack-plugin/tsconfig.json"
-    },
+    {"path": "../sources/@roots/wordpress-dependencies-webpack-plugin/tsconfig.json"},
+    { "path": "../sources/@roots/wordpress-externals-webpack-plugin/tsconfig.json"},
     {"path": "../sources/@roots/wordpress-hmr/tsconfig.json"},
-    {
-      "path": "../sources/@roots/wordpress-theme-json-webpack-plugin/tsconfig.json"
-    },
+    {"path": "../sources/@roots/wordpress-theme-json-webpack-plugin/tsconfig.json"},
     {"path": "../sources/@roots/wordpress-transforms/tsconfig.json"},
     {"path": "../sources/create-bud-app/tsconfig.json"}
   ]

examples/node-api/node-script.js

@@ -1,4 +1,4 @@
-import { factory } from '@roots/bud'
+import {factory} from '@roots/bud'
 
 /**
  * Run this example with:

examples/node-api/package.json

@@ -10,6 +10,7 @@
     "@roots/bud": "workspace:*",
     "@roots/bud-swc": "workspace:*",
     "webpack": "5.91.0",
-    "webpack-cli": "5.1.4"
+    "webpack-cli": "5.1.4",
+    "webpack-dev-server": "5.0.4"
   }
 }

examples/node-api/webpack.config.js

@@ -1,4 +1,4 @@
-import { factory } from '@roots/bud'
+import {factory} from '@roots/bud'
 
 /**
  * Run this example with:
@@ -13,23 +13,25 @@ import { factory } from '@roots/bud'
  */
 const bud = await factory({
   clean: false,
-  dashboard: false,
 })
 
 /**
  * Configure bud as you would in your project.
  */
-bud.setPath(`@dist`, `dist/build-b`)
+bud.setPath(`@dist`, `dist/build-b`).html()
+
+const config = await bud.build.make()
 
 /**
  * Export the final config for webpack to consume.
  *
- * - You probably want to set `stats`, since bud.js doesn't use this interface.
- * - You'll also want to set up `watch` and `server` options as
+ * You'll want to set up `watch` and `devServer` options as
  * bud.js doesn't use these either.
  */
 export default {
-  ...(await bud.build.make()),
-  stats: true,
-  watch: bud.isDevelopment,
+  ...config,
+  devServer: {
+    host: 'localhost',
+    port: 3010,
+  },
 }

examples/s3/bud.config.ts

@@ -1,16 +1,15 @@
 import {bud} from '@roots/bud'
 
-bud
-  .html()
-  .when(bud.isProduction, bud =>
-    bud.setPublicPath(
+bud.html().when(bud.isProduction, bud =>
+  bud
+    .setPublicPath(
       `https://bud-js-tests.s3.us-west-2.amazonaws.com/examples/s3/`,
-    ),
-  )
-  .fs.setCredentials({
-    accessKeyId: bud.env.get(`AWS_ACCESS_KEY_ID`),
-    secretAccessKey: bud.env.get(`AWS_SECRET_ACCESS_KEY`),
-  })
-  .setRegion(`us-west-2`)
-  .setBucket(`bud-js-tests`)
-  .upload({destination: `examples/s3`})
+    )
+    .fs.setCredentials({
+      accessKeyId: bud.env.get(`AWS_ACCESS_KEY_ID`),
+      secretAccessKey: bud.env.get(`AWS_SECRET_ACCESS_KEY`),
+    })
+    .setRegion(`us-west-2`)
+    .setBucket(`bud-js-tests`)
+    .upload({destination: `examples/s3`}),
+)

examples/sage/bud.config.js

@@ -1,4 +1,4 @@
-import { bud } from '@roots/bud'
+import {bud} from '@roots/bud'
 
 bud
   .entry({

examples/typescript/package.json

@@ -10,6 +10,10 @@
     "@roots/bud": "workspace:*",
     "@roots/bud-babel": "workspace:*",
     "@roots/bud-typescript": "workspace:*",
+    "@types/node": "20.14.2",
     "ts-node": "10.9.2"
+  },
+  "dependencies": {
+    "typescript": "5.4.5"
   }
 }

sources/@repo/test-kit/integration-test.ts

@@ -9,6 +9,7 @@ import stripAnsi from 'strip-ansi'
 interface Options {
   buildCommand?: [string, Array<string>?]
   dist?: string
+  integrationBuildCommand?: [string, Array<string>?]
   label: string
   projectDir?: string
 }
@@ -58,7 +59,7 @@ class Project {
 
     let results: ExecaReturnValue
 
-    if (this.options.buildCommand) {
+    if (globalThis.__INTEGRATION__) {
       await execa(
         `node`,
         [this.getPath(`node_modules`, `.bin`, `bud`), `clean`],
@@ -68,23 +69,18 @@ class Project {
         },
       )
 
-      results = await execa(...this.options.buildCommand, {
-        cwd: this.directory,
-        reject: false,
-      })
-    } else if (globalThis.__INTEGRATION__) {
-      results = await execa(
+      const command = this.options.integrationBuildCommand ?? [
         `node`,
         [
           this.getPath(`node_modules`, `.bin`, `bud`),
           `build`,
           `--no-cache`,
         ],
-        {
-          cwd: this.directory,
-          reject: false,
-        },
-      )
+      ]
+      results = await execa(...command, {
+        cwd: this.directory,
+        reject: false,
+      })
     } else {
       await execa(
         `yarn`,
@@ -100,7 +96,7 @@ class Project {
         },
       )
 
-      results = await execa(
+      const command = this.options.buildCommand ?? [
         `yarn`,
         [
           `bud`,
@@ -109,11 +105,11 @@ class Project {
           `build`,
           `--no-cache`,
         ],
-        {
-          cwd: this.directory,
-          reject: false,
-        },
-      )
+      ]
+      results = await execa(...command, {
+        cwd: this.directory,
+        reject: false,
+      })
     }
 
     results.stdout &&

sources/@roots/bud-build/src/config/stats.ts

@@ -1,4 +1,4 @@
 import type {Factory} from '@roots/bud-build/config'
 
 export const stats: Factory<`stats`> = async app =>
-  app.hooks.filter(`build.stats`, {preset: `none`})
+  app.hooks.filter(`build.stats`, {preset: `normal`})

sources/@roots/bud-compiler/src/service/index.ts

@@ -3,7 +3,6 @@ import type {Compiler as BudCompiler} from '@roots/bud-framework'
 import type {
   MultiCompiler,
   MultiStats,
-  StatsError,
   Webpack,
 } from '@roots/bud-framework/config'
 
@@ -50,16 +49,18 @@ class Compiler extends Service implements BudCompiler {
   @bind
   public onStats(stats: MultiStats) {
     this.stats = stats.toJson(statsOptions)
-    this.app.context.render(this.app.dashboard.render(stats))
+    this.app.dashboard.render(stats)
 
     if (stats.hasErrors()) {
       process.exitCode = 1
 
+      const format = makeErrorFormatter(this.stats)
       this.stats.children = this.stats.children?.map(child => ({
         ...child,
-        errors: child.errors
-          ? this.formatErrors(child.errors)
-          : child.errors ?? [],
+        errors:
+          (child.errors
+            ? child.errors?.map(format).filter(Boolean)
+            : child.errors) ?? [],
       }))
 
       this.stats.children
@@ -147,15 +148,6 @@ class Compiler extends Service implements BudCompiler {
         throw BudError.normalize(error)
       })
   }
-
-  @bind
-  public formatErrors(
-    errors: Array<StatsError> | undefined,
-  ): Array<({file: string} & Error) | StatsError> {
-    return (
-      errors?.map(makeErrorFormatter(this.stats)).filter(Boolean) ?? []
-    )
-  }
 }
 
 const statsOptions = {

sources/@roots/bud-compiler/test/compiler.test.ts

@@ -28,10 +28,6 @@ describe(`@roots/bud-compiler`, function () {
     expect(compiler.onStats).toBeInstanceOf(Function)
   })
 
-  it(`should have formatErrors transformer`, () => {
-    expect(compiler.formatErrors).toBeInstanceOf(Function)
-  })
-
   it(`should call logger.log`, async () => {
     expect(logSpy).toHaveBeenCalled()
   })

sources/@roots/bud-dashboard/src/components/error.tsx

@@ -1,13 +1,10 @@
 /* eslint-disable n/no-process-env */
 import {BudError} from '@roots/bud-support/errors'
 import figures from '@roots/bud-support/figures'
-import {
-  Box,
-  render as inkRender,
-  type ReactNode,
-  Static,
-  Text,
-} from '@roots/bud-support/ink'
+import {Box, type ReactNode, Static, Text} from '@roots/bud-support/ink'
+import {render} from '@roots/bud-support/ink/instance'
+import isObject from '@roots/bud-support/isObject'
+import logger from '@roots/bud-support/logger'
 
 type RawError = BudError | Error | string | undefined
 
@@ -152,6 +149,17 @@ export const Display = ({error: input}: {error: RawError}) => {
   )
 }
 
-export const render = (error: BudError | Error) => {
-  return inkRender(<Error error={error} />)
+export const renderError = (error: BudError | Error) => {
+  try {
+    render(<Error error={error} />)
+  } catch (inkError) {
+    logger.error(
+      typeof inkError === `string`
+        ? inkError
+        : isObject(inkError) && `message` in inkError
+          ? inkError.message
+          : `There was an error rendering the error component.`,
+    )
+    logger.error(error.message)
+  }
 }