@tamagui/build 1.0.1-beta.21 → 1.0.1-beta.210

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/build",
-  "version": "1.0.1-beta.21",
+  "version": "1.0.1-beta.210",
   "bin": {
     "tamagui-build": "tamagui-build.js"
   },
@@ -13,12 +13,12 @@
   },
   "dependencies": {
     "chokidar": "^3.5.2",
-    "esbuild": "^0.14.36",
+    "esbuild": "^0.15.11",
     "execa": "^5.0.0",
-    "fast-glob": "^3.2.7",
-    "fs-extra": "^9.1.0",
-    "json5": "^2.2.0",
-    "typescript": "^4.5.2"
+    "fast-glob": "^3.2.11",
+    "fs-extra": "^10.1.0",
+    "lodash.debounce": "^4.0.8",
+    "typescript": "^4.7.4"
   },
   "devDependencies": {
     "@types/fs-extra": "^9.0.13"

package/tamagui-build.js

@@ -1,195 +1,246 @@
 #!/usr/bin/env node
+/* eslint-disable no-console */
 
 const exec = require('execa')
 const fs = require('fs-extra')
-const json5 = require('json5')
 const esbuild = require('esbuild')
 const fg = require('fast-glob')
 const createExternalPlugin = require('./externalNodePlugin')
+const debounce = require('lodash.debounce')
+const { dirname } = require('path')
 
 const jsOnly = !!process.env.JS_ONLY
 const skipJS = !!(process.env.SKIP_JS || false)
-const shouldSkipTypes = !!(process.argv.includes('skip-types') || process.env.SKIP_TYPES)
+const shouldSkipTypes = !!(process.argv.includes('--skip-types') || process.env.SKIP_TYPES)
+const shouldBundle = !!process.argv.includes('--bundle')
+const shouldBundleNodeModules = !!process.argv.includes('--bundle-modules')
 const shouldClean = !!process.argv.includes('clean')
 const shouldCleanBuildOnly = !!process.argv.includes('clean:build')
 const shouldWatch = process.argv.includes('--watch')
 
 const pkg = fs.readJSONSync('./package.json')
+let shouldSkipInitialTypes = !!process.env.SKIP_TYPES_INITIAL
+const pkgMain = pkg.main
+const pkgModule = pkg.module
+const pkgModuleJSX = pkg['module:jsx']
+const pkgTypes = Boolean(pkg['types'] || pkg['typings'])
+
+const flatOut = [pkgMain, pkgModule, pkgModuleJSX].filter(Boolean).length === 1
+
+async function clean() {
+  try {
+    await Promise.allSettled([
+      //
+      fs.remove('.turbo'),
+      fs.remove('.ultra.cache.json'),
+      fs.remove('types'),
+      fs.remove('dist'),
+    ])
+  } catch {
+    // ok
+  }
+  if (shouldCleanBuildOnly) {
+    console.log('🔹 cleaned', pkg.name)
+    process.exit(0)
+  }
+  try {
+    await Promise.allSettled([fs.remove('node_modules')])
+  } catch {
+    // ok
+  }
+  console.log('🔹 cleaned', pkg.name)
+  process.exit(0)
+}
 
 if (shouldClean || shouldCleanBuildOnly) {
-  ;(async () => {
-    try {
-      await Promise.allSettled([fs.remove('.turbo'), fs.remove('types'), fs.remove('dist')])
-    } catch {}
-    if (shouldCleanBuildOnly) {
-      console.log('» cleaned', pkg.name)
-      process.exit(0)
-    }
-    try {
-      await Promise.allSettled([fs.remove('node_modules')])
-    } catch {}
-    console.log('» cleaned', pkg.name)
+  clean().then(() => {
     process.exit(0)
-  })()
-} else {
-  let shouldSkipInitialTypes = !!process.env.SKIP_TYPES_INITIAL
-
-  const pkgMain = pkg.main
-  const pkgModule = pkg.module
-
-  async function build() {
-    console.log('»', pkg.name)
-    const x = Date.now()
-    let files = (await fg(['src/**/*.ts', 'src/**/*.tsx', 'src/**/*.css'])).filter(
-      (x) => !x.includes('.d.ts')
-    )
+  })
+  return
+}
 
-    if (process.env.NO_CLEAN) {
-      console.log('skip typecheck')
-    } else {
-      fs.existsSync('tsconfig.tsbuildinfo') && fs.rmSync('tsconfig.tsbuildinfo')
-    }
+if (shouldWatch) {
+  process.env.IS_WATCHING = true
+  process.env.DISABLE_AUTORUN = true
+  build().then(() => {
+    const rebuild = debounce(build, 100)
+    const chokidar = require('chokidar')
+    chokidar
+      // prevent infinite loop but cause race condition if you just build directly
+      .watch('src', {
+        persistent: true,
+        alwaysStat: true,
+        ignoreInitial: true,
+      })
+      .on('change', rebuild)
+      .on('add', rebuild)
+  })
+  return
+}
 
-    async function buildTsc() {
-      if (jsOnly || shouldSkipTypes) return
-      if (shouldSkipInitialTypes) {
-        shouldSkipInitialTypes = false
-        return
-      }
-
-      // NOTE:
-      // for Intellisense to work in monorepo you need baseUrl: "../.."
-      // but to build things nicely we need here to reset a few things:
-      //  baseUrl: ., outDir: types, rootDir: src
-      // now we can have the best of both worlds
-
-      // NOTE: to get intellisense to *not* suggest importing from the index file when it re-exports another package...
-      // (like tamagui does with @tamagui/core...)
-      // we add `exclude: ['src/index.ts']` to the tsconfig.json which fixes that
-      // but then it causes it to not export the types out from index... so....
-      // we do a stupid, stupid thing to re-write it temporarily without it before build. then restore it after
-      // honestly hate typescript config all around but this seems to work so fuck it
-      const tsConfOg = await fs.readFile('tsconfig.json')
-      const tsConfJSON = json5.parse(tsConfOg)
-      if (tsConfJSON.exclude && tsConfJSON.exclude.includes('src/index.ts')) {
-        tsConfJSON.exclude = tsConfJSON.exclude.filter((x) => x !== 'src/index.ts')
-        await fs.writeJSON('tsconfig.json', tsConfJSON)
-      }
-      try {
-        await exec('npx', [
-          'tsc',
-          '--baseUrl',
-          '.',
-          '--outDir',
-          'types',
-          '--rootDir',
-          'src',
-          '--declaration',
-          '--emitDeclarationOnly',
-          '--declarationMap',
-        ])
-      } finally {
-        // restore
-        await fs.writeFile('tsconfig.json', tsConfOg)
-      }
-    }
+build()
+
+async function build() {
+  if (process.env.DEBUG) console.log('🔹', pkg.name)
+  try {
+    const start = Date.now()
+    await Promise.all([
+      //
+      buildTsc(),
+      buildJs(),
+    ])
+    console.log('built', pkg.name, 'in', Date.now() - start, 'ms')
+  } catch (error) {
+    console.error(`Error building:`, error.message)
+  }
+}
+
+// const targetDir = `.types${Math.floor(Math.random() * 1_000_000)}`
+// const cleanup = () => {
+//   try {
+//     fs.removeSync(targetDir)
+//   } catch {
+//     // ok
+//   }
+// }
 
-    const externalPlugin = createExternalPlugin({
-      skipNodeModulesBundle: true,
-    })
+// process.once('beforeExit', cleanup)
+// process.once('SIGINT', cleanup)
+// process.once('SIGTERM', cleanup)
 
+async function buildTsc() {
+  if (!pkgTypes) return
+  if (jsOnly || shouldSkipTypes) return
+  if (shouldSkipInitialTypes) {
+    shouldSkipInitialTypes = false
+    return
+  }
+
+  async function buildThenCopy() {
+    if (!(await fs.pathExists(`tsconfig.json`))) {
+      throw new Error(`No tsconfig.json found`)
+    }
+    const targetDir = 'types'
     try {
-      await Promise.all([
-        buildTsc(),
-        ...(skipJS
-          ? []
-          : [
-              pkgMain
-                ? esbuild
-                    .build({
-                      entryPoints: files,
-                      outdir: 'dist/cjs',
-                      bundle: false,
-                      sourcemap: true,
-                      target: 'node14',
-                      keepNames: true,
-                      format: 'cjs',
-                      color: true,
-                      logLevel: 'error',
-                      plugins: [externalPlugin],
-                      minify: false,
-                      platform: 'node',
-                    })
-                    .then(() => {
-                      console.log(' >-> commonjs')
-                    })
-                : null,
-              // dont bundle for tree shaking
-              pkgModule
-                ? esbuild
-                    .build({
-                      entryPoints: files,
-                      outdir: 'dist/esm',
-                      sourcemap: true,
-                      target: 'es2019',
-                      keepNames: true,
-                      format: 'esm',
-                      color: true,
-                      logLevel: 'error',
-                      minify: false,
-                      platform: 'neutral',
-                    })
-                    .then(() => {
-                      console.log(' >-> esm')
-                    })
-                : null,
-              esbuild
-                .build({
-                  // only diff is jsx preserve and outdir
-                  jsx: 'preserve',
-                  outdir: 'dist/jsx',
-                  entryPoints: files,
-                  sourcemap: false,
-                  target: 'es2019',
-                  keepNames: true,
-                  format: 'esm',
-                  color: true,
-                  logLevel: 'error',
-                  minify: false,
-                  platform: 'neutral',
-                })
-                .then(() => {
-                  console.log(' >-> jsx')
-                }),
-            ]),
-      ])
-    } catch (error) {
-      console.log('error', error)
+      // typescripts build cache messes up when doing declarationOnly
+      await fs.remove('tsconfig.tsbuildinfo')
+      await fs.ensureDir(targetDir)
+      const cmd = `tsc --baseUrl . --outDir ${targetDir} --rootDir src --emitDeclarationOnly --declarationMap`
+      // console.log('\x1b[2m$', `npx ${cmd}`)
+      await exec('npx', cmd.split(' '))
     } finally {
-      console.log('built in', `${(Date.now() - x) / 1000}s`)
+      await fs.remove('tsconfig.tsbuildinfo')
     }
   }
 
-  if (shouldWatch) {
-    const path = require('path')
-    process.env.IS_WATCHING = true
-    process.env.DISABLE_AUTORUN = true
-    build().then(() => {
-      const finish = (_, path, stats) => {
-        build()
-      }
-      const chokidar = require('chokidar')
-      chokidar
-        // prevent infinite loop but cause race condition if you just build directly
-        .watch('src', {
-          persistent: true,
-          alwaysStat: true,
-          ignoreInitial: true,
+  // NOTE:
+  // for Intellisense to work in monorepo you need baseUrl: "../.."
+  // but to build things nicely we need here to reset a few things:
+  //  baseUrl: ., outDir: types, rootDir: src
+  // for best of both worlds
+
+  // there's a bug with typescript where outputting within the same dir just doesn't output for whatever reason
+  // i have a hunch it's some cache thing, because if i give a new outDir it works
+  // so fixing by always giving a random tmp outdir, and then copying
+  await buildThenCopy()
+}
+
+async function buildJs() {
+  if (skipJS) {
+    return
+  }
+  let files = (await fg(['src/**/*.(m)?[jt]s(x)?', 'src/**/*.css'])).filter(
+    (x) => !x.includes('.d.ts')
+  )
+  const externalPlugin = createExternalPlugin({
+    skipNodeModulesBundle: true,
+  })
+  const start = Date.now()
+  return await Promise.all([
+    pkgMain
+      ? esbuildWriteIfChanged({
+          entryPoints: files,
+          outdir: flatOut ? 'dist' : 'dist/cjs',
+          bundle: shouldBundle,
+          sourcemap: true,
+          target: 'node14',
+          keepNames: false,
+          format: 'cjs',
+          color: true,
+          allowOverwrite: true,
+          jsx: 'automatic',
+          logLevel: 'error',
+          plugins: shouldBundleNodeModules ? [] : [externalPlugin],
+          minify: false,
+          platform: 'node',
+        })
+      : null,
+    pkgModule
+      ? esbuildWriteIfChanged({
+          entryPoints: files,
+          outdir: flatOut ? 'dist' : 'dist/esm',
+          bundle: shouldBundle,
+          sourcemap: true,
+          target: 'node16',
+          keepNames: false,
+          jsx: 'automatic',
+          allowOverwrite: true,
+          format: 'esm',
+          color: true,
+          logLevel: 'error',
+          minify: false,
+          platform: shouldBundle ? 'node' : 'neutral',
         })
-        .on('change', finish)
-        .on('add', finish)
-    })
+      : null,
+    pkgModuleJSX
+      ? esbuildWriteIfChanged({
+          // only diff is jsx preserve and outdir
+          jsx: 'preserve',
+          outdir: flatOut ? 'dist' : 'dist/jsx',
+          entryPoints: files,
+          bundle: shouldBundle,
+          sourcemap: true,
+          allowOverwrite: true,
+          target: 'es2020',
+          keepNames: false,
+          format: 'esm',
+          color: true,
+          logLevel: 'error',
+          minify: false,
+          platform: 'neutral',
+        })
+      : null,
+  ]).then(() => {
+    if (process.env.DEBUG) console.log(`built js in ${Date.now() - start}ms`)
+  })
+}
+
+/**
+ * esbuild but avoids touching unchanged files to not freak out vite
+ * @param {esbuild.BuildOptions} opts
+ * @returns {Promise<void>}
+ */
+async function esbuildWriteIfChanged(opts) {
+  if (shouldWatch) {
+    const built = await esbuild.build({ ...opts, write: false })
+    if (!built.outputFiles) {
+      return
+    }
+    await Promise.all(
+      built.outputFiles.map(async (file) => {
+        const outDir = dirname(file.path)
+        await fs.ensureDir(outDir)
+        const outString = new TextDecoder().decode(file.contents)
+        if (
+          !(await fs.pathExists(file.path)) ||
+          (await fs.readFile(file.path, 'utf8')) !== outString
+        ) {
+          // console.log('write', file.path)
+          await fs.writeFile(file.path, outString)
+        }
+      })
+    )
   } else {
-    build()
+    await esbuild.build(opts)
   }
 }

package/.turbo/turbo-build.log

@@ -1 +0,0 @@
-@tamagui/build:build: cache hit, replaying output f080f7f6d7747555

package/tsconfig.json

@@ -1,9 +0,0 @@
-{
-  "extends": "../../tsconfig.json",
-  "include": [],
-  "files": [],
-  "compilerOptions": {
-    "composite": true,
-    "jsx": "preserve"
-  },
-}