chore(esm): convert @redwoodjs/project-config to ESM (redwoodjs#9870)

I'm still working through a few things.

The motivation for tackling `@redwoodjs/project-config` first was 1)
most of our other package's depend on it 2) it's small 3) it would make
merging the PR that converts the CLI's Jest tests to Vitest easier
because Vitest can't mock require (see
redwoodjs#9863).

I used
[`arethetypeswrong/cli`](https://github.com/arethetypeswrong/arethetypeswrong.github.io)
extensively. Right now I'm deeming the "Masquerading as ESM" error it
emits acceptable. The code between the ESM and CJS files doesn't differ
in functionality, only syntax; shipping two declaration copies of all
the declaration files is shipping extra code. Mark Erikson did something
similar at first at least here:

> Unfortunately, no build tool that I knew of at that time did this by
default, and the idea of shipping 99%-duplicate typedefs bothered me.
So, I opted to not try to fix this "FalseCJS" issue for our packages (at
least for the time being).

(Source:
https://blog.isquaredsoftware.com/2023/08/esm-modernization-lessons/#typescript-declarations.)

Note that FalseCJS's fancier name is "Masquerading as CJS". We have
"Masquerading as ESM", not CJS. I'm not sure if it's an issue that it's
flipped yet.

```
$ attw ./redwoodjs-project-config.tgz 

@redwoodjs/project-config v6.0.7

Build tools:
- [email protected]
- [email protected]

👺 Import resolved to an ESM type declaration file, but a CommonJS JavaScript file. https://github.com/arethetypeswrong/arethetypeswrong.github.io/blob/main/docs/problems/FalseESM.md


┌───────────────────┬─────────────────────────────┐
│                   │ "@redwoodjs/project-config" │
├───────────────────┼─────────────────────────────┤
│ node10            │ 🟢                          │
├───────────────────┼─────────────────────────────┤
│ node16 (from CJS) │ 👺 Masquerading as ESM      │
├───────────────────┼─────────────────────────────┤
│ node16 (from ESM) │ 🟢 (ESM)                    │
├───────────────────┼─────────────────────────────┤
│ bundler           │ 🟢                          │
└───────────────────┴─────────────────────────────┘
```

Regarding the `.js` extensions (which are necessary for relative imports
in ESM) in TS code, see redwoodjs#8456.

Author: jtoar

packages/project-config/build.js

@@ -0,0 +1,28 @@
+/* eslint-disable import/no-extraneous-dependencies */
+
+import * as esbuild from 'esbuild'
+
+const options = {
+  entryPoints: ['./src/index.ts'],
+  outdir: 'dist',
+
+  platform: 'node',
+  target: ['node20'],
+  bundle: true,
+  packages: 'external',
+
+  logLevel: 'info',
+  metafile: true,
+}
+
+await esbuild.build({
+  ...options,
+  format: 'esm',
+  outExtension: { '.js': '.mjs' },
+})
+
+await esbuild.build({
+  ...options,
+  format: 'cjs',
+  outExtension: { '.js': '.cjs' },
+})

packages/project-config/build.mjs

@@ -7,15 +7,18 @@
     "directory": "packages/project-config"
   },
   "license": "MIT",
+  "type": "module",
   "exports": {
-    ".": "./dist/index.js"
+    "types": "./dist/index.d.ts",
+    "import": "./dist/index.mjs",
+    "default": "./dist/index.cjs"
   },
   "types": "./dist/index.d.ts",
   "files": [
     "dist"
   ],
   "scripts": {
-    "build": "yarn node ./build.mjs && run build:types",
+    "build": "yarn node ./build.js && run build:types",
     "build:pack": "yarn pack -o redwoodjs-project-config.tgz",
     "build:types": "tsc --build --verbose",
     "build:watch": "nodemon --watch src --ext \"js,ts,tsx\" --ignore dist --exec \"yarn build\"",

packages/project-config/package.json

@@ -4,7 +4,7 @@ import toml from '@iarna/toml'
 import merge from 'deepmerge'
 import { env as envInterpolation } from 'string-env-interpolation'
 
-import { getConfigPath } from './configPath'
+import { getConfigPath } from './configPath.js'
 
 export enum TargetEnum {
   NODE = 'node',

packages/project-config/src/config.ts

@@ -1,4 +1,4 @@
-import { findUp } from './findUp'
+import { findUp } from './findUp.js'
 
 const CONFIG_FILE_NAME = 'redwood.toml'
 

packages/project-config/src/configPath.ts

@@ -1,4 +1,4 @@
-export * from './config'
-export * from './configPath'
-export * from './paths'
-export * from './findUp'
+export * from './config.js'
+export * from './configPath.js'
+export * from './paths.js'
+export * from './findUp.js'

packages/project-config/src/index.ts

@@ -3,8 +3,8 @@ import path from 'path'
 
 import fg from 'fast-glob'
 
-import { getConfig } from './config'
-import { getConfigPath } from './configPath'
+import { getConfig } from './config.js'
+import { getConfigPath } from './configPath.js'
 
 export interface NodeTargetPaths {
   base: string

packages/project-config/src/paths.ts

@@ -1,6 +1,8 @@
 {
   "extends": "../../tsconfig.compilerOption.json",
   "compilerOptions": {
+    "moduleResolution": "NodeNext",
+    "module": "NodeNext",
     "baseUrl": ".",
     "rootDir": "src",
     "outDir": "dist",

packages/project-config/tsconfig.json

@@ -2,9 +2,9 @@
 import { createServer } from 'vite'
 import yargsParser from 'yargs-parser'
 
-import projectConfig from '@redwoodjs/project-config'
+import { getPaths } from '@redwoodjs/project-config'
 
-const rwPaths = projectConfig.getPaths()
+const rwPaths = getPaths()
 
 const startDevServer = async () => {
   const configFile = rwPaths.web.viteConfig

packages/vite/bins/rw-vite-dev.mjs

@@ -6,7 +6,7 @@ import { transformWithEsbuild } from 'vite'
 import { test, describe, beforeEach, afterAll, beforeAll, it, expect, vi } from 'vitest'
 
 import * as babel from '@babel/core'
-import projectConfig from '@redwoodjs/project-config'
+import { getPaths } from '@redwoodjs/project-config'
 
 import {
   Flags,
@@ -41,7 +41,6 @@ async function transform(srcPath: string) {
 const __filename = fileURLToPath(import.meta.url)
 const __dirname = path.dirname(__filename)
 const FIXTURE_PATH = path.join(__dirname, 'fixtures/nestedPages')
-const { getPaths } = projectConfig
 
 test('transform', async () => {
   vi.spyOn(fs, 'readFileSync').mockImplementationOnce(() => {