Skip to content

Commit 5035eda

Browse files
justaleverjustalever
authored
Add importmap support for Rails 7+ (#11)
* Add importmap support for Rails 7+ This adds full importmap support while maintaining backward compatibility with npm/bundler workflows. ## Changes ### New Build System - Add `esbuild.importmap.js` for unbundled ESM builds - Add `build-importmap` script to package.json - Create `dist/importmap/` with 14 unbundled component files - Keep dependencies external for importmap usage ### Package Updates - Add `exports` field to package.json for modern resolution - Update build command to include all three outputs - Maintain existing bundled ESM/CJS builds ### Documentation - Add BUILD.md - Complete NPM/bundler setup guide - Add IMPORTMAP.md - Complete Rails 7+ importmap guide - Add PUBLISHING.md - Publishing and CDN deployment guide - Update README.md with both installation options - Update CLAUDE.md with dual build system documentation - Add importmap.json with CDN reference URLs ## Benefits - ✅ Native Rails 7+ importmap support - ✅ No breaking changes for existing users - ✅ Dual distribution (bundled + unbundled) - ✅ Comprehensive documentation for both methods - ✅ Automatic CDN availability via npm ## Build Outputs - Bundled ESM: 102KB (for npm/bundler users) - Bundled CJS: 102KB (for CommonJS users) - Importmap: 30KB total (14 unbundled files) Co-Authored-By: Claude <noreply@anthropic.com> * Add automated tests and CI workflow - Add comprehensive build tests (66 test cases) - Test bundled builds include dependencies - Test importmap builds keep dependencies external - Test all 14 components are built correctly - Test documentation files exist and are linked - Add GitHub Actions workflow for CI - Test on Node 18 and 20 - Add test status badge to README All tests passing ✅ * Fix deprecated upload-artifact action Update from v3 to v4 to fix CI build failures * Improve CI test debugging and file counting - Add step to verify build outputs exist - Improve file counting logic to handle whitespace - Add better error messages with file listings - Use find instead of ls for more reliable counting * Simplify CI to run once on Node 20 - Remove matrix build (was running 4 times) - Only run on Node 20.x (latest LTS) - Only trigger on PR and main branch pushes - Reduces CI runs from 4 to 1 per push * Update demo to use unbundled importmap build - Switch from bundled to importmap distribution - Add all required dependencies to importmap - Add explanatory comment about dual build system - Demo now showcases the Rails 7+ importmap approach * Update dependencies to latest versions - Update esbuild 0.20.0 → 0.25.10 - Update hotkeys-js 3.13.7 → 3.13.15 - Rebuild all outputs with updated dependencies - Update all documentation with new versions - All 66 tests passing
1 parent 536f3f0 commit 5035eda

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

47 files changed

+2342
-25
lines changed

‎.claude/settings.local.json‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"permissions": {
3+
"allow": [
4+
"Bash(bun run:*)"
5+
],
6+
"deny": [],
7+
"ask": []
8+
}
9+
}

‎.github/workflows/test.yml‎

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
name: Test Build Outputs
2+
3+
on:
4+
pull_request:
5+
branches: [ main ]
6+
push:
7+
branches: [ main ]
8+
9+
jobs:
10+
test:
11+
runs-on: ubuntu-latest
12+
13+
steps:
14+
- name: Checkout code
15+
uses: actions/checkout@v4
16+
17+
- name: Setup Bun
18+
uses: oven-sh/setup-bun@v1
19+
with:
20+
bun-version: latest
21+
22+
- name: Setup Node.js
23+
uses: actions/setup-node@v4
24+
with:
25+
node-version: '20.x'
26+
27+
- name: Install dependencies
28+
run: bun install
29+
30+
- name: Build all outputs
31+
run: bun run build
32+
33+
- name: Verify build outputs exist
34+
run: |
35+
echo "Checking for build outputs..."
36+
ls -la dist/
37+
test -f dist/railsui-stimulus.module.js || (echo "ESM bundle missing!" && exit 1)
38+
test -f dist/railsui-stimulus.cjs || (echo "CJS bundle missing!" && exit 1)
39+
test -d dist/importmap || (echo "Importmap directory missing!" && exit 1)
40+
echo "✓ All build outputs present"
41+
42+
- name: Run tests
43+
run: bun run test
44+
45+
- name: Check bundled ESM file size
46+
run: |
47+
SIZE=$(wc -c < dist/railsui-stimulus.module.js)
48+
echo "Bundled ESM size: $SIZE bytes"
49+
if [ $SIZE -lt 50000 ]; then
50+
echo "Error: Bundled ESM file is too small (< 50KB)"
51+
exit 1
52+
fi
53+
54+
- name: Check bundled CJS file size
55+
run: |
56+
SIZE=$(wc -c < dist/railsui-stimulus.cjs)
57+
echo "Bundled CJS size: $SIZE bytes"
58+
if [ $SIZE -lt 50000 ]; then
59+
echo "Error: Bundled CJS file is too small (< 50KB)"
60+
exit 1
61+
fi
62+
63+
- name: Count importmap files
64+
run: |
65+
echo "Checking dist/importmap directory..."
66+
ls -la dist/importmap/ || echo "Directory does not exist!"
67+
echo "Counting JS files (excluding .map files)..."
68+
COUNT=$(find dist/importmap -name "*.js" -not -name "*.map" | wc -l | tr -d ' ')
69+
echo "Importmap JS files: $COUNT"
70+
if [ "$COUNT" != "15" ]; then
71+
echo "Error: Expected 15 importmap JS files, found $COUNT"
72+
echo "Files found:"
73+
find dist/importmap -name "*.js" -not -name "*.map" || true
74+
exit 1
75+
fi
76+
77+
- name: Verify importmap dependencies are external
78+
run: |
79+
if ! grep -q 'import tippy from "tippy.js"' dist/importmap/railsui_tooltip.js; then
80+
echo "Error: tippy.js should be external in importmap build"
81+
exit 1
82+
fi
83+
if ! grep -q 'import flatpickr from "flatpickr"' dist/importmap/railsui_date_range_picker.js; then
84+
echo "Error: flatpickr should be external in importmap build"
85+
exit 1
86+
fi
87+
echo "✓ Dependencies are correctly external in importmap build"
88+
89+
- name: Verify bundled build includes dependencies
90+
run: |
91+
if grep -q 'import tippy from "tippy.js"' dist/railsui-stimulus.module.js; then
92+
echo "Error: tippy.js should be bundled, not external"
93+
exit 1
94+
fi
95+
if grep -q 'import flatpickr from "flatpickr"' dist/railsui-stimulus.module.js; then
96+
echo "Error: flatpickr should be bundled, not external"
97+
exit 1
98+
fi
99+
echo "✓ Dependencies are correctly bundled in ESM build"
100+
101+
- name: Upload build artifacts
102+
uses: actions/upload-artifact@v4
103+
if: success()
104+
with:
105+
name: build-outputs
106+
path: |
107+
dist/
108+
!dist/**/*.map
109+
retention-days: 7

0 commit comments

Comments
 (0)