[cubing.js issue] unable to build with vue3+vite

Westlifers commented 9 months ago

Steps to reproduce the issue

create a demo by npm create vue@latest, with typescript and other options you like chosen. then install dependencies
install cubing.js by npm install cubing --save
in any component used, write import {randomScrambleForEvent} from "cubing/scramble" in <script> tag
build this demo. the build process will fail and you shall get errors

Observed behaviour

Unexpected early exit. This happens when Promises returned by plugins cannot resolve. Unfinished hook action(s) on exit:
(commonjs--resolver) resolveId "../chunks/chunk-NDY3DEEE.js" "F:/learn/scucawebvite/node_modules/cubing/dist/lib/cubing/scramble/index.js"
(vite:worker-import-meta-url) transform "F:/learn/scucawebvite/node_modules/cubing/dist/lib/cubing/chunks/chunk-NDY3DEEE.js"
(commonjs--resolver) resolveId "./chunk-NDY3DEEE.js" "F:/learn/scucawebvite/node_modules/cubing/dist/lib/cubing/chunks/search-dynamic-solve-4x4x4-JQRNWKAG.js"
error during build:
Error: Unexpected early exit. This happens when Promises returned by plugins cannot resolve. Unfinished hook action(s) on exit:
(commonjs--resolver) resolveId "../chunks/chunk-NDY3DEEE.js" "F:/learn/scucawebvite/node_modules/cubing/dist/lib/cubing/scramble/index.js"
(vite:worker-import-meta-url) transform "F:/learn/scucawebvite/node_modules/cubing/dist/lib/cubing/chunks/chunk-NDY3DEEE.js"
(commonjs--resolver) resolveId "./chunk-NDY3DEEE.js" "F:/learn/scucawebvite/node_modules/cubing/dist/lib/cubing/chunks/search-dynamic-solve-4x4x4-JQRNWKAG.js"
    at process.handleBeforeExit (file:///F:/learn/scucawebvite/node_modules/rollup/dist/es/shared/node-entry.js:25897:28)
    at Object.onceWrapper (node:events:627:26)
    at process.emit (node:events:512:28)

🖼 Screenshots

No response

Expected behaviour

build should success without error

Environment

"dependencies": {
  "cubing": "^0.43.4",
  "vue": "^3.3.4",
  "vue-router": "^4.2.4"
},
"devDependencies": {
  "@tsconfig/node18": "^18.2.2",
  "@types/node": "^18.17.17",
  "@vitejs/plugin-vue": "^4.3.4",
  "@vue/tsconfig": "^0.4.0",
  "npm-run-all2": "^6.0.6",
  "typescript": "~5.2.0",
  "vite": "^4.4.9",
  "vue-tsc": "^1.8.11"
}

on windows 10

Additional info

only 'cubing/scramble' will cause this error, whild twisty don't, it worked well. btw, npm run dev works without error, only build fails.

lgarron commented 9 months ago

Could you share a project code with a repro case?

Vite should work just fine, since it's using esbuild, but bundlers do all sorts of shenanigans with some code. commonjs--resolver is particularly suspicious, since we don't publish any CommonJS files.

lgarron commented 9 months ago

I'm also able to confirm that the following works with npm create vue using TypeScript:

import { randomScrambleForEvent } from "cubing/scramble";
(await randomScrambleForEvent("333")).log();

Westlifers commented 9 months ago

@lgarron https://github.com/Westlifers/build-failure-example/tree/master here is a demo I just created following the 4 steps I mentioned. I added a line

import {randomScrambleForEvent} from "cubing/scramble"

in `src/components/HelloWorld.vue

run git clone -b master https://github.com/Westlifers/build-failure-example/

then npm install and npm run build, it should throw an error. at least on my computer it was the case. idk if that will happen on yours?

Westlifers commented 9 months ago

btw I found this in console when I'm running npm run dev browsing a page using randomScrambleForEvent: the last two is normal warning while the first three is not.

how I use it:

const scramble:Ref<string> = ref((await randomScrambleForEvent(translateEventForScramble(event.value))).toString())

this code run fine when using webpack...

not sure if this will help... (the scramble was generated correctly even though there are these warnings)

lgarron commented 9 months ago

Interesting, it looks like this is because npx vite serve bundler things significantly differently from npx vite build.

Specifically, it's failing to handle the direct worker instantiation correctly:

https://github.com/cubing/cubing.js/blob/4afc6d727549aadc1e82abf52d531565953e7a9a/src/cubing/search/worker-workarounds/index.ts#L29-L31

This is 100% valid unambiguous standardized vanilla JS code, so I'll have to follow up with Vite about what's going on.

lgarron commented 9 months ago

Filed an issue at: https://github.com/vitejs/vite/issues/14499

lgarron commented 9 months ago

@Westlifers: The Vite config at https://github.com/vitejs/vite/issues/14499#issuecomment-1740267849 might work for you.

Westlifers commented 9 months ago

@lgarron Thanks a lot, that solved the problem!

cubing / cubing.js