npm + working bin

.github/workflows/build.yml

@@ -27,7 +27,7 @@ jobs:
             -e DIST_DIR="$MDX/out$BASE_PATH" \
             -e MDX \
             -e NEXT_PUBLIC_LIBNAME \
-            ghcr.io/pmndrs/docs:app-router yarn build
+            ghcr.io/pmndrs/docs:app-router npm run build
         env:
           BASE_PATH: ${{ steps.configurepages.outputs.base_path }}
           MDX: ${{ inputs.mdx }}

Dockerfile

@@ -3,7 +3,7 @@ FROM node:20-alpine
 RUN apk add --no-cache libc6-compat git && apk update
 WORKDIR /app
 
-COPY package.json yarn.lock ./
-RUN yarn
+COPY package.json package-lock.json ./
+RUN npm ci
 
 COPY . .

bin/build.mjs

@@ -2,39 +2,90 @@
 
 // $ node bin/build.mjs ~/code/pmndrs/react-three-fiber/docs
 
-import { spawn } from 'node:child_process'
+import { spawn, exec as execCb } from 'node:child_process'
+import { promisify } from 'node:util'
 import minimist from 'minimist'
 import { resolve, dirname } from 'node:path'
 import { fileURLToPath } from 'node:url'
+const exec = promisify(execCb)
 
+console.log('argv=', process.argv)
 var argv = minimist(process.argv.slice(2))
-console.log('argv=', argv)
+console.log('argv2=', argv)
 
+const help = argv.help || argv.h
+const man = `
+Usage: npm exec -y --package=@pmndrs/docs build -- MDX [ OUTDIR ] [ --libname=LIBNAME --basePath=BASE_PATH --help|-h ]
+
+Generate static, pmndrs-standardized documentation website from *.mdx folder.
+
+Example: npx @pmndrs/docs build ./docs
+         npx @pmndrs/docs build ~code/pmndrs/react-three-fiber/docs --libname="React Three Fiber" --basePath="/react-three-fiber" static-out
+
+Arguments:
+
+  MDX: Path to the folder containing the MDX files (absolute or relative to process.cwd())
+  OUT_DIR: Path to the output directory (absolute or relative to process.cwd()), default: "out"
+
+Options:
+
+  libname: Name of the library that documentation is for, eg: "React Three Fiber"
+  basePath: base path for the final URL, eg: "/react-three-fiber"
+  help, h: Show this help message
+`
+if (help) {
+  console.log(man)
+  process.exit(0)
+}
+
+const __filename = fileURLToPath(import.meta.url) // Converts the URL to a file path
+const __dirname = dirname(__filename) // Gets the directory name
+
+// Positional arguments
 const mdx = argv._[0]
+const outdir = argv._[1] || 'out'
 if (!mdx) {
   console.error('Please provide the mdx folder as the first argument.')
+  console.log(man)
   process.exit(1)
 }
 
-// const __filename = fileURLToPath(import.meta.url); // Converts the URL to a file path
-// const __dirname = dirname(__filename); // Gets the directory name
-// const viteConfigPath = resolve(__dirname, "../src/vite.config.build.ts");
-// // console.log("viteConfigPath=", viteConfigPath);
+const MDX = resolve(process.cwd(), mdx)
+const NEXT_PUBLIC_LIBNAME = argv.libname || process.env.LIBNAME
+const BASE_PATH = argv.basePath || process.env.BASE_PATH || ''
+const DIST_DIR = `out${BASE_PATH}`
+
+const outHostDirAbsolute = resolve(process.cwd(), outdir)
+const outLocalDirAbsolute = resolve(__dirname, '..', 'out')
+
+const env = {
+  MDX,
+  NEXT_PUBLIC_LIBNAME,
+  BASE_PATH,
+  DIST_DIR,
+}
+console.log('env=', env)
 
-const cmd = spawn('npx', ['next', 'build'], {
+await exec(`rm -rf ${outLocalDirAbsolute}`)
+
+const cmd = await spawn('npx', ['next', 'build'], {
   stdio: 'inherit',
+  cwd: resolve(__dirname, '..'),
   env: {
-    MDX: mdx,
-    NEXT_PUBLIC_LIBNAME: argv.libname,
     ...process.env,
+    ...env,
   },
 })
 
-cmd.on('exit', (code) => {
+cmd.on('exit', async (code) => {
   if (code !== 0) {
     console.error('Build failed with error')
     process.exit(1)
   }
-
   console.log('Build completed successfully.')
+
+  await exec(
+    `mkdir -p ${outHostDirAbsolute}; cp -rf ${outLocalDirAbsolute}/* ${outHostDirAbsolute}`
+  )
+  console.log(`Preview: \`npx -y serve ${outHostDirAbsolute}\``)
 })

next.config.mjs

@@ -61,5 +61,6 @@ const nextConfig = {
   //   ]
   // },
 }
+// console.log('nextConfig=', nextConfig)
 
 export default nextConfig

package.json

@@ -3,8 +3,11 @@
   "version": "0.1.0",
   "private": true,
   "type": "module",
-  "bin": "bin/build.mjs",
+  "bin": {
+    "build": "bin/build.mjs"
+  },
   "devDependencies": {
+    "@types/minimist": "^1.2.5",
     "@types/node": "^18.6.4",
     "@types/react": "^18.3.0",
     "@types/react-dom": "^18.3.0",
@@ -44,5 +47,5 @@
   "engines": {
     "node": ">=18"
   },
-  "packageManager": "yarn@1.22.19"
+  "packageManager": "npm@10.8.2"
 }

readme.md

@@ -3,7 +3,7 @@ $ MDX=~/code/pmndrs/react-three-fiber/docs \
   NEXT_PUBLIC_LIBNAME="React Three Fiber" \
   BASE_PATH= \
   DIST_DIR= \
-    yarn dev
+    npm run dev
 ```
 
 http://localhost:3000/getting-started/introduction
@@ -14,7 +14,7 @@ $ rm -rf out; \
   NEXT_PUBLIC_LIBNAME="React Three Fiber" \
   BASE_PATH= \
   DIST_DIR= \
-    yarn build && \
+    npm run build && \
   npx serve out
 ```
 
@@ -48,7 +48,7 @@ $ export BASE_PATH=/uikit; \
     -e DIST_DIR="$MDX/out$BASE_PATH" \
     -e MDX \
     -e NEXT_PUBLIC_LIBNAME \
-    pmndrs-docs yarn build; \
+    pmndrs-docs npm run build; \
   npx -y serve "$MDX/out"
 ```