use bob the bundler (#637)

* use bob the bundler

* somewhat works

* workssss lfg dima

* Update package.json

Co-authored-by: Dimitri POSTOLOV <[email protected]>

* remove more scripts

* remove unused deps

* Add changeset

* use bob check

* chore: upgrade bob to 3.0.5

* fix this shit

Co-authored-by: Dimitri POSTOLOV <[email protected]>
Co-authored-by: Laurin Quast <[email protected]>

.changeset/purple-lemons-yawn.md

@@ -0,0 +1,8 @@
+---
+"@guild-docs/algolia": minor
+"guild-docs": minor
+---
+
+Support TypeScript ESM modules (`"module": "node16"` and `"moduleResolution": "node16"`).
+
+ [More information on the TypeScript Release Notes.](https://devblogs.microsoft.com/typescript/announcing-typescript-4-7/#ecmascript-module-support-in-node-js)

.github/workflows/test.yaml

@@ -31,8 +31,8 @@ jobs:
       - name: Build
         run: yarn build
 
-      - name: Test ESM
-        run: node scripts/test-esm.mjs
+      - name: Test ESM & CJS integrity
+        run: yarn bob check
 
       - name: Lint
         run: yarn lint

.gitignore

@@ -4,3 +4,4 @@ node_modules
 dist
 .env
 /.idea/
+.bob/

.prettierignore

@@ -1,3 +1,4 @@
 .husky/
 dist/
 .next/
+.bob/

.vscode/settings.json

@@ -1,3 +1,5 @@
 {
-  "typescript.tsdk": "node_modules/typescript/lib"
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode"
 }

package.json

@@ -10,16 +10,13 @@
   },
   "license": "MIT",
   "scripts": {
+    "prerelease": "yarn build",
     "release": "changeset publish",
     "clean": "rimraf \"{,!(node_modules)/*/}node_modules/\"",
-    "dev": "concurrently -r yarn:dev:*",
-    "dev:website": "yarn workspace website dev",
-    "dev:docs": "yarn workspace guild-docs dev",
-    "build:algolia": "yarn workspace @guild-docs/algolia build",
-    "build:docs": "yarn workspace guild-docs build",
+    "prebuild": "rimraf packages/*/dist .bob/",
+    "build": "bob build",
     "lint": "eslint --ignore-path .gitignore .",
-    "build": "rimraf \"{,!(node_modules)/*/}dist/\" && concurrently -r \"bob-esbuild tsc\"",
-    "postbuild": "concurrently -r yarn:build:* && node scripts/copy-files.mjs && yarn workspace website build",
+    "postbuild": "node scripts/copy-files.mjs && yarn workspace website build",
     "postinstall": "husky install",
     "prettier": "prettier --write --list-different .",
     "release:canary": "(node scripts/canary-release.mjs && yarn build && changeset publish --tag alpha) || echo Skipping Canary..."
@@ -35,21 +32,15 @@
     "@types/react": "18.0.15",
     "@typescript-eslint/eslint-plugin": "5.31.0",
     "@typescript-eslint/parser": "5.31.0",
-    "bob-esbuild": "4.0.3",
-    "bob-esbuild-cli": "4.0.0",
-    "bob-tsm": "1.1.1",
-    "chalk": "5.0.1",
-    "changesets-github-release": "0.1.0",
-    "concurrently": "7.3.0",
-    "esbuild": "0.14.50",
+    "bob-the-bundler": "3.1.0-canary-3696700.0",
     "eslint": "8.20.0",
     "eslint-config-prettier": "8.5.0",
     "eslint-plugin-import": "2.26.0",
     "eslint-plugin-jsx-a11y": "6.6.1",
     "eslint-plugin-react": "7.30.1",
     "eslint-plugin-react-hooks": "4.6.0",
-    "globby": "13.1.2",
     "husky": "8.0.1",
+    "patch-package": "6.4.7",
     "prettier": "2.7.1",
     "rimraf": "3.0.2",
     "typescript": "4.7.4"

packages/algolia/package.json

@@ -6,18 +6,6 @@
     "url": "git+https://github.com/the-guild-org/the-guild-docs.git"
   },
   "license": "MIT",
-  "type": "module",
-  "exports": "./dist/index.js",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
-  "files": [
-    "dist"
-  ],
-  "scripts": {
-    "dev": "bob-esbuild watch",
-    "build": "bob-esbuild build",
-    "postpublish": "gh-release"
-  },
   "dependencies": {
     "algoliasearch": "^4.13.1",
     "github-slugger": "^1.4.0",
@@ -30,5 +18,50 @@
     "@types/github-slugger": "1.3.0",
     "@types/glob": "7.2.0",
     "@types/remove-markdown": "0.3.1"
-  }
+  },
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
+  "typings": "dist/typings/index.d.ts",
+  "typescript": {
+    "definition": "dist/typings/index.d.ts"
+  },
+  "exports": {
+    ".": {
+      "require": {
+        "types": "./dist/typings/index.d.ts",
+        "default": "./dist/cjs/index.js"
+      },
+      "import": {
+        "types": "./dist/typings/index.d.ts",
+        "default": "./dist/esm/index.js"
+      },
+      "default": {
+        "types": "./dist/typings/index.d.ts",
+        "default": "./dist/esm/index.js"
+      }
+    },
+    "./*": {
+      "require": {
+        "types": "./dist/typings/*.d.ts",
+        "default": "./dist/cjs/*.js"
+      },
+      "import": {
+        "types": "./dist/typings/*.d.ts",
+        "default": "./dist/esm/*.js"
+      },
+      "default": {
+        "types": "./dist/typings/*.d.ts",
+        "default": "./dist/esm/*.js"
+      }
+    },
+    "./package.json": "./package.json"
+  },
+  "buildOptions": {
+    "input": "./src/index.ts"
+  },
+  "publishConfig": {
+    "directory": "dist",
+    "access": "public"
+  },
+  "type": "module"
 }

packages/docs/package.json

@@ -7,23 +7,6 @@
   },
   "license": "MIT",
   "sideEffects": false,
-  "type": "module",
-  "exports": {
-    ".": "./dist/index.js",
-    "./style.css": "./dist/style.css",
-    "./*": "./dist/*.js"
-  },
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
-  "files": [
-    "dist"
-  ],
-  "scripts": {
-    "dev": "bob-esbuild watch",
-    "build": "bob-esbuild build",
-    "postpublish": "gh-release",
-    "test:npm": "bob-tsm test-npm.ts"
-  },
   "dependencies": {
     "@chakra-ui/react": "2.2.4",
     "@emotion/react": "11.9.3",
@@ -53,8 +36,48 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
+  "bob": {
+    "commonjs": false,
+    "build": {
+      "copy": [
+        "./src/style.css"
+      ]
+    },
+    "check": false
+  },
+  "main": "dist/esm/index.js",
+  "module": "dist/esm/index.js",
+  "typings": "dist/typings/index.d.ts",
+  "typescript": {
+    "definition": "dist/typings/index.d.ts"
+  },
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/typings/index.d.ts",
+        "default": "./dist/esm/index.js"
+      },
+      "default": {
+        "types": "./dist/typings/index.d.ts",
+        "default": "./dist/esm/index.js"
+      }
+    },
+    "./*": {
+      "import": {
+        "types": "./dist/typings/*.d.ts",
+        "default": "./dist/esm/*.js"
+      },
+      "default": {
+        "types": "./dist/typings/*.d.ts",
+        "default": "./dist/esm/*.js"
+      }
+    },
+    "./package.json": "./package.json",
+    "./style.css": "./dist/style.css"
+  },
   "publishConfig": {
-    "access": "public",
-    "directory": "dist"
-  }
+    "directory": "dist",
+    "access": "public"
+  },
+  "type": "module"
 }

packages/docs/src/copy-to-clipboard.tsx

@@ -3,7 +3,7 @@ import { MdContentCopy } from 'react-icons/md/index.js';
 import { TiTickOutline } from 'react-icons/ti/index.js';
 import useCopyToClipboardImport from 'react-use/lib/useCopyToClipboard.js';
 import { IconButton, useToast, IconButtonProps } from '@chakra-ui/react';
-import { getDefault } from './utils';
+import { getDefault } from './utils.js';
 
 const useCopyToClipboard = getDefault(useCopyToClipboardImport);
 

packages/docs/src/giscus.tsx

@@ -2,7 +2,7 @@ import { useColorModeValue } from '@chakra-ui/react';
 import { useRouter } from 'next/router.js';
 import ScriptImport from 'next/script.js';
 import React, { ReactElement, useEffect, useMemo, useState } from 'react';
-import { getDefault } from './utils';
+import { getDefault } from './utils.js';
 
 const Script = getDefault(ScriptImport);
 

packages/docs/src/index.ts

@@ -1,2 +1,2 @@
-export * from './google-analytics';
-export * from './utils';
+export * from './google-analytics.js';
+export * from './utils.js';

packages/docs/src/next-nprogress.tsx

@@ -4,7 +4,7 @@ import { css, Global } from '@emotion/react';
 import RouterImport from 'next/router.js';
 import NProgress from 'nprogress';
 import React, { memo, useEffect, useMemo } from 'react';
-import { getDefault } from './utils';
+import { getDefault } from './utils.js';
 import { useLatestRef } from '@chakra-ui/react';
 
 const Router = getDefault(RouterImport);

packages/docs/src/next.config.ts

@@ -1,7 +1,7 @@
 import type { NextConfig } from 'next';
 import nextBundleAnalyzer from '@next/bundle-analyzer';
 import nextra from 'nextra';
-import { remarkMermaid } from './remark-mermaid';
+import { remarkMermaid } from './remark-mermaid.js';
 
 export const withGuildDocs = ({
   themeConfig = './theme.config.tsx',

packages/docs/src/npm.ts

@@ -1,7 +1,7 @@
 import { promises } from 'fs';
 import { request } from 'undici';
 import Lru from 'tiny-lru';
-import { withoutStartingSlash, withoutTrailingSlash, withStartingSlash } from './utils';
+import { withoutStartingSlash, withoutTrailingSlash, withStartingSlash } from './utils.js';
 
 export interface PackageInfo {
   name: string;

tsconfig.json

@@ -1,10 +1,11 @@
 {
   "compilerOptions": {
-    "rootDir": ".",
+    "rootDir": "packages",
     "baseUrl": ".",
     "outDir": "dist",
     "paths": {
-      "@guild-docs/*": ["packages/*/src/index.ts"]
+      "@guild-docs/algolia": ["packages/algolia/src/index.ts"],
+      "guild-docs": ["packages/docs/src/index.ts"]
     },
     "declaration": true,
     "target": "es2019" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */,
@@ -18,7 +19,7 @@
     "moduleResolution": "node",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "preserve",
+    "jsx": "react",
     "incremental": true,
     "noUnusedLocals": true,
     "importsNotUsedAsValues": "error"

website/package.json

@@ -3,6 +3,7 @@
   "version": "0.0.0",
   "private": true,
   "license": "MIT",
+  "bob": false,
   "scripts": {
     "analyze": "cross-env ANALYZE=true next build",
     "build": "next build",