From 10ea2928a4a5f6dd313dd8dba85645d13b6abad8 Mon Sep 17 00:00:00 2001
From: Gleb Tv <glebtv@gmail.com>
Date: Wed, 24 Sep 2025 14:21:06 +0300
Subject: [PATCH] docs: Add complete esbuild.config.js with critical alias
 configuration
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Include the full esbuild.config.js from dummy app
- Emphasize the critical 'alias' configuration for resolving gem's JS
- Show how to get gem path dynamically using 'bundle show'
- Add proper error handling and watch mode setup

The alias configuration is CRITICAL for properly importing the gem's
JavaScript file from vendor/assets/javascripts/

🤖 Generated with Claude Code

Co-Authored-By: Claude <noreply@anthropic.com>
---
 docs/update-quill.md | 39 ++++++++++++++++++++++++++++++++++++---
 1 file changed, 36 insertions(+), 3 deletions(-)

diff --git a/docs/update-quill.md b/docs/update-quill.md
index 38f8ffe..a65222d 100644
--- a/docs/update-quill.md
+++ b/docs/update-quill.md
@@ -102,9 +102,18 @@ In `app/assets/stylesheets/active_admin.scss`:
 
 #### esbuild.config.js
 ```javascript
+#!/usr/bin/env node
 const esbuild = require('esbuild');
 const path = require('path');
 
+// IMPORTANT: Set up the alias to resolve the gem's JavaScript file
+// For production apps, you can get the gem path dynamically:
+const { execSync } = require('child_process');
+const gemPath = execSync('bundle show activeadmin_quill_editor', { encoding: 'utf-8' }).trim();
+// Or for development/testing with a local gem:
+// const gemPath = path.resolve(__dirname, '../..'); // Adjust based on your setup
+
+// Configuration for esbuild with proper module resolution
 const config = {
   entryPoints: ['app/javascript/active_admin.js'],
   bundle: true,
@@ -112,15 +121,39 @@ const config = {
   format: 'iife',
   outdir: 'app/assets/builds',
   publicPath: '/assets',
+  loader: {
+    '.js': 'js',
+  },
+  // Define global Quill for the initialization script
+  define: {
+    'global': 'window'
+  },
+  // CRITICAL: Use alias to import the gem's JavaScript from vendor/assets
+  alias: {
+    'activeadmin_quill_editor': path.join(gemPath, 'vendor/assets/javascripts/activeadmin_quill_editor.js')
+  }
 };
 
-// Build or watch
-if (process.argv.includes('--watch')) {
+// Check if we're in watch mode
+const watchMode = process.argv.includes('--watch');
+
+if (watchMode) {
+  // Start the build with watch mode
   esbuild.context(config).then(ctx => {
     ctx.watch();
+    console.log('Watching for changes...');
+  }).catch(error => {
+    console.error('Build failed:', error);
+    process.exit(1);
   });
 } else {
-  esbuild.build(config);
+  // Single build
+  esbuild.build(config).then(() => {
+    console.log('Build completed');
+  }).catch(error => {
+    console.error('Build failed:', error);
+    process.exit(1);
+  });
 }
 ```