Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

esBuild issue when building Nuxt on ARM and hosting on x86 #11

Closed
vanling opened this issue Jan 5, 2024 · 1 comment
Closed

esBuild issue when building Nuxt on ARM and hosting on x86 #11

vanling opened this issue Jan 5, 2024 · 1 comment

Comments

@vanling
Copy link

vanling commented Jan 5, 2024

This issue was a debug in progress, i'm jotting down notes here while testing/debugging, might even close this later tonight when I discover I'm just doing something wrong here 馃憖 updates are below


So I build multiple Nuxt websites via Jenkins on a M1 Mac Mini.. and from there only deploy the .output folder from Nuxt, this is why i love nuxt, keeps is small and deploys fast.

But, and i don't know if i'm at the correct place at thuis moment to share this...
it turns out building on an ARM machine and hosting the .output on a x86 machine breaks the useCompiler in Nuxt with the following error from ESBuild.

this issue goes away when i run nuxt locally or build and run on server.

Error loading component Error:
You installed esbuild for another platform than the one you're currently using.
This won't work because esbuild is written with native code and needs to
install a platform-specific binary executable.

Specifically the "esbuild-linux-arm64" package is present but this platform
needs the "esbuild-linux-64" package instead. People often get into this
situation by installing esbuild on Windows or macOS and copying "node_modules"
into a Docker image that runs Linux, or by copying "node_modules" between
Windows and WSL environments.

If you are installing with npm, you can try not copying the "node_modules"
directory when you copy the files over, and running "npm ci" or "npm install"
on the destination platform after the copy. Or you could consider using yarn
instead of npm which has built-in support for installing a package on multiple
platforms simultaneously.

If you are installing with yarn, you can try listing both this platform and the
other platform in your ".yarnrc.yml" file using the "supportedArchitectures"
feature: https://yarnpkg.com/configuration/yarnrc/#supportedArchitectures
Keep in mind that this means multiple copies of esbuild will be present.

Another alternative is to use the "esbuild-wasm" package instead, which works
the same way on all platforms. But it comes with a heavy performance cost and
can sometimes be 10x slower than the "esbuild" package, so you may also not
want to do that.

Unable to find the email template file

Error: Error rendering template Droppingsoon: Error: Component Droppingsoon not found
    at templateRender (file:///home/xxxxx/xxxxx/.output/server/node_modules/@vue-email/compiler/dist/index.mjs:57013:11)
    at useCompiler (file:///home/xxxxx/xxxxx/.output/server/chunks/sendMail.post.mjs:31:20)
    at file:///home/xxxxx/xxxxx/.output/server/chunks/sendMail.post.mjs:47:22
    at Object.handler (file:///home/xxxxx/xxxxx/.output/server/chunks/nitro/node-server.mjs:2378:19)
    at toNodeHandle (file:///home/xxxxx/xxxxx/.output/server/chunks/nitro/node-server.mjs:2567:7)
    at ufetch (file:///home/xxxxx/xxxxx/.output/server/chunks/nitro/node-server.mjs:2933:17)
    at $fetchRaw2 (file:///home/xxxxx/xxxxx/.output/server/chunks/nitro/node-server.mjs:2805:26)
    at $fetch2 (file:///home/xxxxx/xxxxx/.output/server/chunks/nitro/node-server.mjs:2847:15)
    at file:///home/xxxxx/xxxxx/server/api/droppingsoon/index.post.js:76:1
    at Object.handler (file:///home/xxxxx/xxxxx/.output/server/chunks/nitro/node-server.mjs:2378:19)
    at Server.toNodeHandle (file:///home/xxxxx/xxxxx/.output/server/chunks/nitro/node-server.mjs:2567:7)

update1: Tried with yarn, no bueno. Almost sure this isn't because of vue-mail, but could be a vite thing when dynamicly trying to load the template.

update2: -Trying to force esbuild to esbuild-wasm dirty aliassing trick-. that was dumb.

update3: wasm thingy failed, i'm a bit more sure about vue-mail. When removing vue-mail, there is no esbuild included in /.output/server/package.json and when i add vue-mail again its back "esbuild": "0.15.18",

ok it is 100% pinpointed to the following dependancy.

/@vue-email/compiler@0.8.5
 - import-string
 -- module-from-string
 --- esbuild: 0.15.18

Conclusion

Building Nuxt projects on an ARM-based machine (Machine A) and deploying the .output folder to an Intel/x86-based machine (Machine B) leads to compatibility issues with the email compiler in Nuxt. This problem arises because the compiler uses import-string, which seems to depend on esbuild?, a tool not compatible across different architectures. The presence of esbuild within the .output/server/modules appears to be the core issue. Attempts to resolve this through methods such as using yarn were unsuccessful, underscoring the problem's specificity to the @vue-email/compiler dependency and its use of esbuild. Furthermore, this situation suggests that Nuxt is not designed to handle architecture-dependent dependencies within its build output, as their presence can lead to such cross-architecture deployment issues.

@vanling
Copy link
Author

vanling commented Jan 9, 2024

Will close this :). I think this is too specific for my usecase. Not so many people deploy nuxt on Ubuntu(x86) via Jenkins on a MAC os(arm).

For others who might end up here. For the same issue. You can not deploy the .output folder on a secondary system when this module is installed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant