jsbundling-rails: Command build failed, ensure yarn is installed and `yarn build` runs without errors

[Konstrukteur]

I am trying to deploy through Capistrano.

I have

• Rails 7 App
• React 18.2.0
• jsbundling 2.11.5
• esbuild 0.17.8
• node v19.8.1
• yarn 3.5.0

I get random errors on deployment related to the case of the component filenames during ~/.rvm/bin/rvm 3.2.1 do bundle exec rake assets:precompile.

✘ [ERROR] Could not read from file: /home/amazingUser/apps/amazingApp/releases/20230318103234/app/javascript/components/App.jsx
    app/javascript/components/index.jsx:3:16:
      3 │ import App from "./App";
        ╵                 ~~~~~~~
1 warning and 1 error
node:child_process:924
    throw err;
    ^
Error: Command failed: /home/amazingUser/apps/amazingApp/releases/20230318103234/node_modules/@esbuild/linux-x64/bin/esbuild app/javascript/application.js --bundle --sourcemap --outdir=app/assets/builds --public-path=assets
    at checkExecSyncError (node:child_process:885:11)
    at Object.execFileSync (node:child_process:921:15)
    at Object.<anonymous> (/home/amazingUser/apps/amazingApp/releases/20230318103234/node_modules/esbuild/bin/esbuild:220:28)
    at Module._compile (node:internal/modules/cjs/loader:1275:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1329:10)
    at Module.load (node:internal/modules/cjs/loader:1133:32)
    at Module._load (node:internal/modules/cjs/loader:972:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:83:12)
    at node:internal/main/run_main_module:23:47 {
  status: 1,
  signal: null,
  output: [ null, null, null ],
  pid: 22185,
  stdout: null,
  stderr: null
}

Node.js v19.6.1
rake aborted!
jsbundling-rails: Command build failed, ensure yarn is installed and `yarn build` runs without errors
/home/amazingUser/apps/amazingApp/shared/bundle/ruby/3.2.0/gems/jsbundling-rails-1.1.1/lib/tasks/jsbundling/build.rake:5:in `block (2 levels) in <main>'
/home/amazingUser/apps/amazingApp/shared/bundle/ruby/3.2.0/gems/rake-13.0.6/exe/rake:27:in `<top (required)>'
/home/amazingUser/.rvm/rubies/ruby-3.2.1/bin/ruby_executable_hooks:22:in `eval'
/home/amazingUser/.rvm/rubies/ruby-3.2.1/bin/ruby_executable_hooks:22:in `<main>'
Tasks: TOP => assets:precompile => javascript:build
(See full trace by running task with --trace)
rake stderr: Nothing written

In order to being able to deploy I have to name some components with lower case letters, while others have to have capital letters or can have capital letters. The production system is case sensitive, I have yarn 3.5 and Node 19.8.1 installed through nvm on it.

[saviokmua]

faced a similar issue.... do you have any updates?

[Konstrukteur]

No. I used for the project another framework. I still need to figure this out. In case you get through it. Please share!

[dhh]

The underlying error here as you paste. esbuild couldn't compile your JS. Looks like maybe because you're using case sensitive file names. I'd try stop doing that.

[Konstrukteur]

Thanks for the feedback.

I was following React's "best practices", which suggest PascalCase component and filenames. Usually I stay away from mixed case filenames, but followed the official line here.

When you build through React, this quirk does not pop up and everything works in production, but when you try to bundle it, you end up with this problem.