Separate builds for production and development/test

[dorianmariecom]

e.g. I would like to have:

esbuild app/javascript/*.* --bundle --outdir=app/assets/builds '--define:process.env.NODE_ENV=\"production\"' --minify

for production. (this is necessary to have the production build of react that is like 3-5x smaller)

And:

esbuild app/javascript/*.* --bundle --outdir=app/assets/builds

for development/test.

seems like there should be yarn build:production hooked into rake assets:prepare instead of yarn build

[dorianmariecom]

my temporary solution:

bin/build

#!/usr/bin/env node

require('dotenv').config()

const { exec } = require("child_process")

const logAndExec = (command) => {
  command = `${command} ${process.argv[2]}`
  console.log(command)
  exec(command)
}

if (process.env.NODE_ENV === "production") {
  logAndExec("esbuild app/javascript/*.* --bundle --outdir=app/assets/builds '--define:process.env.NODE_ENV=\"production\"' --minify")
} else {
  logAndExec("esbuild app/javascript/*.* --bundle --outdir=app/assets/builds")
}

and in package.json:

    "build": "./bin/build",

[dhh]

I think that's a fine solution. But I don't think it's something we need/want to add as defaults here. These shims should be just enough to get started and going, and then you can specialize from there.

[spaquet]

I agree that this should not be in the product, but a good snippet should be mentioned in the documentation so that those of us who are in need of this can quickly get something up and running.

[dorianmariecom]

ok

a better script for reference:

#!/usr/bin/env ruby

def log_and_exec(*args)
  args += ARGV
  puts args.join(" ")
  system(args.join(" "))
end

if ENV["NODE_ENV"] == "production"
  log_and_exec(
    "esbuild",
    "app/javascript/*.*",
    "--bundle",
    "--outdir=app/assets/builds",
    "'--define:process.env.NODE_ENV=\"production\"'",
    "--minify"
  )
else
  log_and_exec(
    "esbuild",
    "app/javascript/*.*",
    "--bundle",
    "--outdir=app/assets/builds",
  )
end

[dhh]

I could see us adding something like this to a wiki here?

[dorianmariecom]

I added it to the wiki, the script isn't perfect but it works https://github.com/rails/jsbundling-rails/wiki

[betorina]

Is this solution too easy?

package.json

"scripts": {
  "build": "esbuild app/javascript/*.* --bundle --outdir=app/assets/builds --minify",
  "build-dev": "esbuild app/javascript/*.* --bundle --outdir=app/assets/builds"
}

Procfile.dev

web: bin/rails server -p 3000
js: yarn build-dev --watch

[dorianmariecom]

I've updated the wiki, thanks