Update docs & install for referencing images in JS (#158)

* asset path should use / so it works on more than just the root routes

* update the image loading instructions so that files are marked  and skipped by sprockets

Author: tgaff

README.md

@@ -50,11 +50,13 @@ If you [import CSS](https://esbuild.github.io/content-types/#css-from-js) in you
 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 `package.json`, under `"scripts"` and `"build"`, add the additional arguments:
+    * `--loader:.png=file` This instructs esbuild to copy png files to the build directory.
+    * `--asset-names=[name]-[hash].digested` This tells esbuild to append `.digested` to the file name so that sprockets or propshaft will not append an additional digest hash to the file.
+1. When esbuild runs, it will copy the png file to something like `app/assets/builds/example-5SRKKTLZ.digested.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.
+1. The path of the image resolves to `/assets/example-5SRKKTLZ.digested.png`, which is served by the asset pipeline.
 
 ## License
 

lib/install/esbuild/install.rb

@@ -2,7 +2,7 @@
 run "yarn add esbuild"
 
 say "Add build script"
-build_script = "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds --public-path=assets"
+build_script = "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds --public-path=/assets"
 
 case `npx -v`.to_f
 when 7.1...8.0