jsbundling-rails 1.0.2 → 1.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 9005a58fceabb06503796890d306f26c1b57b95e98199f6e93c3a9be9656b320
-  data.tar.gz: defe5a30a7543ed3ff40b5d97a493c123fb565bedac270ba2c3a80ee360f58d0
+  metadata.gz: d5a44be3ec3ce6c70cdea6a949eb1161de8d93fc862fea729d6c69fd75507540
+  data.tar.gz: 8ac2566fb564e1b0f7c705c923bdd4cf19db68559d2549690ce388057aa56100
 SHA512:
-  metadata.gz: 1537371737cd78411eacd67683eae126ad912d283bae982da54de5c79104d3c176ebaa4275f5d487d81837c12434b63f9edbcefeacad496c705f9d0bdb9e1f38
-  data.tar.gz: 6da1db4850966e8a74f5be4526ff43b2b9dfbe7839848d091b24062c738168a5fc97875c84c406216b4140a45aec7e7c31c9a5e919f8c971b7e89669d0df0a1e
+  metadata.gz: a1fc1a7e5b48df676886d33b078a44b261312867ab16257900881924908ff5a669d27859673ece993c194e923e9d8d085da2ac101ee29928f648941382b87be2
+  data.tar.gz: '059d18f58411a82e4e68f2b2484232bb4da9135e0dcbf00cd64fc239ade89ff7bdbaabe199bf1fd48fc69af57414d55e60912201fe004c23be4e928f16140d13'

data/README.md

@@ -24,9 +24,8 @@ If you want to use webpack features like [code splitting](https://webpack.js.org
 
 You must already have node and yarn installed on your system. You will also need npx version 7.1.0 or later. Then:
 
-1. Add `jsbundling-rails` to your Gemfile with `gem 'jsbundling-rails'`
-2. Run `./bin/bundle install`
-3. Run `./bin/rails javascript:install:[esbuild|rollup|webpack]`
+1. Run `./bin/bundle add jsbundling-rails`
+2. Run `./bin/rails javascript:install:[esbuild|rollup|webpack]`
 
 Or, in Rails 7+, you can preconfigure your new application to use a specific bundler with `rails new myapp -j [esbuild|rollup|webpack]`.
 
@@ -37,10 +36,20 @@ Or, in Rails 7+, you can preconfigure your new application to use a specific bun
 
 The default build script for esbuild relies on the `app/javascript/*.*` glob pattern to compile multiple entrypoints automatically. This glob pattern is not available by default on Windows, so you need to change the build script in `package.json` to manually list the entrypoints you wish to compile.
 
-## Why does esbuild overwrite my application.css?
+### Why does esbuild overwrite my application.css?
 
 If you [import CSS](https://esbuild.github.io/content-types/#css-from-js) in your application.js while using esbuild, you'll be creating both an `app/assets/builds/application.js` _and_ `app/assets/builds/application.css` file when bundling. The latter can conflict with the `app/assets/builds/application.css` produced by [cssbundling-rails](https://github.com/rails/cssbundling-rails). The solution is to either change the output file for esbuild (and the references for that) or for cssbundling. Both are specified in `package.json`. 
 
+### How can I reference static assets in JavaScript code?
+
+Suppose you have an image `app/javascript/images/example.png` that you need to reference in frontend code built with esbuild.
+
+1. Create the image at `app/javascript/images/example.png`.
+1. In `package.json`, under `"scripts"` and `"build"`, add the option `--loader:.png=file` to the esbuild script, which instructs esbuild to copy png files to the build directory.
+1. When esbuild runs, it will copy the png file to something like `app/assets/builds/example-5SRKKTLZ.png`.
+1. In frontend code, the image is available for import by its original name: `import Example from "../images/example.png"`.
+1. The image itself can now be referenced by its imported name, e.g. in React, `<img src={Example} />`.
+1. The path of the image resolves to `/assets/example-5SRKKTLZ.png`, which is served by the asset pipeline.
 
 ## License
 

data/lib/install/dev

@@ -1,6 +1,6 @@
 #!/usr/bin/env bash
 
-if ! command -v foreman &> /dev/null
+if ! foreman version &> /dev/null
 then
   echo "Installing foreman..."
   gem install foreman

data/lib/install/esbuild/install.rb

@@ -2,7 +2,7 @@ say "Install esbuild"
 run "yarn add esbuild"
 
 say "Add build script"
-build_script = "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds"
+build_script = "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds --public-path=assets"
 
 if (`npx -v`.to_f < 7.1 rescue "Missing")
   say %(Add "scripts": { "build": "#{build_script}" } to your package.json), :green

data/lib/install/webpack/webpack.config.js

@@ -9,7 +9,7 @@ module.exports = {
   },
   output: {
     filename: "[name].js",
-    sourceMapFilename: "[name].js.map",
+    sourceMapFilename: "[file].map",
     path: path.resolve(__dirname, "app/assets/builds"),
   },
   plugins: [

data/lib/jsbundling/version.rb

@@ -1,3 +1,3 @@
 module Jsbundling
-  VERSION = "1.0.2"
+  VERSION = "1.0.3"
 end

data/lib/tasks/jsbundling/clobber.rake

@@ -1,7 +1,7 @@
 namespace :javascript do
   desc "Remove JavaScript builds"
   task :clobber do
-    rm_rf Dir["app/assets/builds/[^.]*.js"], verbose: false
+    rm_rf Dir["app/assets/builds/[^.]*.{js,js.map}"], verbose: false
   end
 end
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jsbundling-rails
 version: !ruby/object:Gem::Version
-  version: 1.0.2
+  version: 1.0.3
 platform: ruby
 authors:
 - David Heinemeier Hansson
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2022-02-26 00:00:00.000000000 Z
+date: 2022-06-19 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: railties
@@ -67,7 +67,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.2.32
+rubygems_version: 3.3.14
 signing_key:
 specification_version: 4
 summary: Bundle and transpile JavaScript in Rails with esbuild, rollup.js, or Webpack.