Test if yalc can be used in the CI for the build tests

[fulopkovacs]

Make sure that @theatre/core and @theatre/studio can be used with the most popular setups (parcel, vite, vanilla rollup, etc.).

Note: Our first approach was this PR which had to be closed due to the limitations of yarn workspaces.

[fulopkovacs]

Build setups

Here's a list of the build setups that I'm planning to test in this PR (feel free to add more):

Implement in this PR

• vite + r3f
• create-react-app + r3f

Implement in the future

NOTE: The following configs will be implemented in the future:

• ❌ NextJS 11 + r3f (see UPDATES)
• ❌ NextJS 12 + r3f (see UPDATES)
• ❌ Parcel 2 + r3f (locally I ran into this issue: Release 0.8, or 0.7.4? mozilla/source-map#452, need to look into it)
• ❌ Parcel 1 + r3f
• ❌ vanilla rollup + r3f (link to internal debugging notes)

TODO list

• Add the problematic projects to the builds, but make sure that the CI doesn't fail when these particular tests do
• Fix the CI
• Update build_tests/README.md with the build tests that are actually implemented (after the CI is fixed!)

Related tasks that should be handled in different PRs

• Troubleshooting guide for rollup configs (process is undefined) theatre-docs#8
• Set the value of process.env.NODE_ENV to "development" if process is undefined (eg.: vanilla rollup) #131

UPDATES

• Next.js v12 is currently not compatible with Theatre.js (check out this conversation on our Discord's #help channel). This issue is still being investigated.
• Next.js v11 has the same problem as v12
• we ran into some problems with yarn workspaces, so decided to not use them for the build tests. Currently I'm checking out yalc as our next best option.
• Fix various issues with the build system #129 might fix our build issues with the problematic projects
• I ran into this issue with the Parcel v2 setup after a rebase: Release 0.8, or 0.7.4? mozilla/source-map#452, so Parcel v2 has been moved to the Implement in the future section.
• When I tried to add the r3f extension to the parcel v1 and the rollup setup I had some issues, so I moved both of them to the "Implement in the future" section

[DennisSmolek]

@fulop how are you clearing vite?
I'm guessing you aren't using the r3f extension?

I'm getting:

✘ [ERROR] [plugin vite:dep-pre-bundle] Missing "./examples/js/libs/stats.min" export in "three" package

    node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:37698:7:
      37698 │   throw new Error(
            ╵         ^

    at bail (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:37698:8)
    at resolve (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:37775:10)
    at resolveExports (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:38441:12)
    at resolveDeepImport (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:38459:31)
    at tryNodeResolve (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:38232:20)
    at Context.resolveId (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:38040:28)
    at Object.resolveId (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:36609:55)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at async /Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:61261:27
    at async /Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:30513:34

  This error came from the "onResolve" callback registered here:

    node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:30492:18:
      30492 │             build.onResolve({ filter: /^[\w@][^:]/ }, async ({ path: id, importer, kind }) => {
            ╵                   ~~~~~~~~~

    at setup (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:30492:19)
    at handlePlugins (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:843:23)
    at Object.buildOrServe (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:1137:7)
    at /Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:2079:17
    at new Promise (<anonymous>)
    at Object.build (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:2078:14)
    at Object.build (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:1927:51)
    at runOptimizeDeps (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:37342:34)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)

  The plugin "vite:dep-pre-bundle" was triggered by this import

    node_modules/@theatre/r3f/node_modules/@react-three/drei/core/Stats.js:3:22:
      3 │ import StatsImpl from 'three/examples/js/libs/stats.min';
        ╵                       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

7:59:42 AM [vite] error while updating dependencies:
Error: Build failed with 1 error:
node_modules/vite/dist/node/chunks/dep-27bc1ab8.js:37698:7: ERROR: [plugin: vite:dep-pre-bundle] Missing "./examples/js/libs/stats.min" export in "three" package
    at failureErrorWithLog (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:1603:15)
    at /Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:1249:28
    at runOnEndCallbacks (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:1034:63)
    at buildResponseToResult (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:1247:7)
    at /Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:1356:14
    at /Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:666:9
    at handleIncomingPacket (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:763:9)
    at Socket.readFromStdout (/Users/Shared/sharedGit/r3f-theatre-fresh/node_modules/esbuild/lib/main.js:632:7)
    at Socket.emit (events.js:400:28)
    at addChunk (internal/streams/readable.js:293:12)

[fulopkovacs]

Hey, @DennisSmolek , sorry for the late response (holidays... ) ☺️!

The reason why vite and r3f are not included in this PR is because we're planning to build all the projects in packages/playground/src/shared using Netlify's build preview for every PR. These projects do use vite, and one of them uses r3f. Unfortunately the Build Previews currently have a bug (issue), so we have to wait until the fix we submitted (PR) gets merged.

I'm not really familiar with the error in your comment. Checked the playground project that uses the r3f extension, but it seems to be fine. Could you check it too to see if I'm missing something? Here's how you could do it:

1. Run this command in the cloned repo's root after you've installed the dependencies:

yarn playground

2. Visit http://localhost:8080/shared/r3f-rocket in the browser. (Replace the port with the the one that the playground server is using if necessary)
3. You should be presented with something like this:
   

I hope I was able to help you, please tell me if that's not the case ☺️.

EDIT: In the meantime I discovered that the playground loads the r3f extension from the repo itself, so it won't be that useful for you. I'll check if I can make the playground projects work with the latest published version of @theatre/r3f.

[AriaMinaei]

Did a first pass at this draft PR. Looks very good!

[AriaMinaei]

Could this be a mac issue?

[fulopkovacs]

Could this be a mac issue?

Note for the people looking at this PR: We talked with Aria and solved the issue by adding node-gyp to the project's dependencies (also had to run yarn rebuild before that if I remember correctly). This issue was macOS-specific, but houldn't come up again.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
theatre-playground	✅ Ready (Inspect)	Visit Preview	May 16, 2022 at 9:01AM (UTC)

[fulopkovacs]

This PR ran into a error in the CI and after a considerable amount of debugging we decided to restart it from scratch. See the new version of the PR here: #165