WIP: Getting r3f to work with create-react-app

* Temporarily disabled ESM bundles because the current setup confuses webpack4 (but not parceljs). Since create-react-app uses webpack4, not doing this would make theatre incompatible with CRA.

packages/plugin-r3f/devEnv/build.ts

@@ -0,0 +1,75 @@
+import path from 'path'
+import {build} from 'esbuild'
+import type {Plugin} from 'esbuild'
+import {writeFileSync} from 'fs'
+
+const externalPlugin = (patterns: RegExp[]): Plugin => {
+  return {
+    name: `external`,
+
+    setup(build) {
+      build.onResolve({filter: /.*/}, (args) => {
+        const external = patterns.some((p) => {
+          return p.test(args.path)
+        })
+
+        if (external) {
+          return {path: args.path, external}
+        }
+      })
+    },
+  }
+}
+
+const definedGlobals = {
+  global: 'window',
+}
+
+function createBundles(watch: boolean) {
+  const pathToPackage = path.join(__dirname, '../')
+  const esbuildConfig: Parameters<typeof build>[0] = {
+    entryPoints: [path.join(pathToPackage, 'src/index.tsx')],
+    bundle: true,
+    sourcemap: true,
+    define: definedGlobals,
+    watch,
+    platform: 'neutral',
+    mainFields: ['browser', 'module', 'main'],
+    target: ['firefox57', 'chrome58'],
+    conditions: ['browser', 'node'],
+    // every dependency is considered external
+    plugins: [externalPlugin([/^[\@a-zA-Z]+/])],
+  }
+
+  build({
+    ...esbuildConfig,
+    define: {...definedGlobals, 'process.env.NODE_ENV': '"production"'},
+    outfile: path.join(pathToPackage, 'dist/index.production.cjs'),
+    format: 'cjs',
+    treeShaking: true,
+  })
+
+  build({
+    ...esbuildConfig,
+    define: {...definedGlobals, 'process.env.NODE_ENV': '"development"'},
+    outfile: path.join(pathToPackage, 'dist/index.development.cjs'),
+    format: 'cjs',
+  })
+
+  writeFileSync(
+    path.join(pathToPackage, 'dist/index.cjs'),
+    `module.exports =
+  process.env.NODE_ENV === "production"
+    ? require("./index.production.cjs")
+    : require("./index.development.cjs")`,
+    {encoding: 'utf-8'},
+  )
+
+  build({
+    ...esbuildConfig,
+    outfile: path.join(pathToPackage, 'dist/index.mjs'),
+    format: 'esm',
+  })
+}
+
+createBundles(false)

packages/plugin-r3f/devEnv/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  
+}