mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-12 06:06:37 +03:00
Add Bun bundler for frontend JavaScript
- Bundle all frontend JS with Bun.build() (82KB minified) - Dependencies (motion, lenis, three) are now bundled instead of CDN - Remove import map from index.html (no longer needed) - Output to public/dist/app.bundle.js with source map - Add public/dist/ to .gitignore (generated during build) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 4.5
parent
31aa3f2127
commit
2fb61defca
@@ -4,6 +4,7 @@ node_modules/
|
||||
# Generated files
|
||||
dist/*.zip
|
||||
public/css/styles.css
|
||||
public/dist/
|
||||
|
||||
# Build artifacts
|
||||
*.log
|
||||
|
||||
+2
-12
@@ -9,17 +9,7 @@
|
||||
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;0,700;1,300;1,400&family=Instrument+Sans:wght@400;500;600;700&family=Inter:wght@400;500;600&family=Space+Grotesk:wght@400;500;600&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="./css/styles.css">
|
||||
|
||||
<!-- Import Maps for ES Module dependencies -->
|
||||
<script type="importmap">
|
||||
{
|
||||
"imports": {
|
||||
"lenis": "https://cdn.jsdelivr.net/npm/lenis@1.3.16/+esm",
|
||||
"motion": "https://cdn.jsdelivr.net/npm/motion@12.23.26/+esm",
|
||||
"three": "https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.module.js"
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
</head>
|
||||
<body class="min-h-screen overflow-x-hidden leading-relaxed">
|
||||
<!-- Skip to main content link for keyboard users -->
|
||||
<a href="#main-content" class="skip-link">Skip to main content</a>
|
||||
@@ -324,6 +314,6 @@
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script type="module" src="./app.js"></script>
|
||||
<script type="module" src="./dist/app.bundle.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
+45
-1
@@ -67,14 +67,58 @@ function buildTailwindCSS() {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Build frontend JavaScript bundle using Bun's bundler
|
||||
*/
|
||||
async function buildFrontendJS() {
|
||||
const entrypoint = path.join(ROOT_DIR, 'public', 'app.js');
|
||||
const outdir = path.join(ROOT_DIR, 'public', 'dist');
|
||||
|
||||
console.log('📦 Bundling frontend JavaScript...');
|
||||
|
||||
try {
|
||||
const result = await Bun.build({
|
||||
entrypoints: [entrypoint],
|
||||
outdir: outdir,
|
||||
target: 'browser',
|
||||
format: 'esm',
|
||||
minify: true,
|
||||
sourcemap: 'linked',
|
||||
naming: '[name].bundle.[ext]',
|
||||
});
|
||||
|
||||
if (!result.success) {
|
||||
console.error('Bundle failed:');
|
||||
for (const log of result.logs) {
|
||||
console.error(log);
|
||||
}
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
// Find the main bundle output
|
||||
const mainBundle = result.outputs.find(o => o.kind === 'entry-point');
|
||||
if (mainBundle) {
|
||||
const bundleName = path.basename(mainBundle.path);
|
||||
const bundleSize = (mainBundle.size / 1024).toFixed(1);
|
||||
console.log(`✓ Frontend JS bundled to public/dist/${bundleName} (${bundleSize} KB)\n`);
|
||||
}
|
||||
|
||||
return result;
|
||||
} catch (error) {
|
||||
console.error('Failed to bundle frontend JS:', error.message);
|
||||
process.exit(1);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Main build process
|
||||
*/
|
||||
async function build() {
|
||||
console.log('🔨 Building cross-provider design plugins...\n');
|
||||
|
||||
// Build Tailwind CSS first
|
||||
// Build frontend assets
|
||||
buildTailwindCSS();
|
||||
await buildFrontendJS();
|
||||
|
||||
// Read source files
|
||||
const { commands, skills } = readSourceFiles(ROOT_DIR);
|
||||
|
||||
Reference in New Issue
Block a user