diff --git a/lib/build-esbuild/index.js b/lib/build-esbuild/index.js index e46f868..636726a 100644 --- a/lib/build-esbuild/index.js +++ b/lib/build-esbuild/index.js @@ -204,7 +204,22 @@ async function assembleBuildOpts (src, dest, siteData, opts, modeOpts = {}) { entryNames: watch ? '[dir]/[name]' : '[dir]/[name]-[hash]', chunkNames: 'chunks/[ext]/[name]-[hash]', jsx: 'automatic', - jsxImportSource: 'preact' + jsxImportSource: 'preact', + loader: { + '.png': 'dataurl', + '.jpg': 'dataurl', + '.jpeg': 'dataurl', + '.gif': 'dataurl', + '.svg': 'dataurl', + '.webp': 'dataurl', + '.avif': 'dataurl', + '.ico': 'file', + '.woff': 'file', + '.woff2': 'file', + '.ttf': 'file', + '.eot': 'file', + '.otf': 'file', + } } const esbuildSettingsExtends = siteData.esbuildSettings diff --git a/test-cases/general-features/index.test.js b/test-cases/general-features/index.test.js index f876b3d..931b89b 100644 --- a/test-cases/general-features/index.test.js +++ b/test-cases/general-features/index.test.js @@ -103,6 +103,21 @@ test.describe('general-features', () => { const jsChunkFiles = files.filter(f => f.relname.match(/chunks\/js\/chunk-.+\.js$/)) assert.ok(jsChunkFiles.length > 0, 'at least one shared JS chunk was produced with a hashed name') + // Verify that CSS asset loaders work: images inline as data URLs, fonts are emitted as files + const globalCssFile = files.find(f => f.relname.match(/global-([A-Z0-9])\w+\.css$/)) + if (globalCssFile) { + const cssContent = await readFile(path.join(dest, globalCssFile.relname), 'utf8') + assert.ok( + cssContent.includes('data:image/gif;base64,'), + 'global CSS inlines GIF image as a base64 data URL' + ) + } else { + assert.fail('Could not find global CSS output file to verify asset loaders') + } + + const woff2Files = files.filter(f => f.relname.endsWith('.woff2')) + assert.ok(woff2Files.length > 0, 'woff2 font file was emitted to the output directory') + // Special test for global.data.js blogPostsHtml const indexPath = path.join(dest, 'index.html') try { diff --git a/test-cases/general-features/src/globals/global.css b/test-cases/general-features/src/globals/global.css index ccb97b2..45e5274 100644 --- a/test-cases/general-features/src/globals/global.css +++ b/test-cases/general-features/src/globals/global.css @@ -1,2 +1,5 @@ @import 'mine.css/dist/mine.css'; @import 'mine.css/dist/layout.css'; + +.test-asset-icon { background-image: url('./test-icon.gif'); } +@font-face { font-family: 'TestFont'; src: url('./test-font.woff2'); } diff --git a/test-cases/general-features/src/globals/test-font.woff2 b/test-cases/general-features/src/globals/test-font.woff2 new file mode 100644 index 0000000..db76e17 --- /dev/null +++ b/test-cases/general-features/src/globals/test-font.woff2 @@ -0,0 +1 @@ +wOF2placeholder \ No newline at end of file diff --git a/test-cases/general-features/src/globals/test-icon.gif b/test-cases/general-features/src/globals/test-icon.gif new file mode 100644 index 0000000..09e3508 Binary files /dev/null and b/test-cases/general-features/src/globals/test-icon.gif differ