@webmate-studio/builder 0.2.13 → 0.2.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/bundler.js +21 -5
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webmate-studio/builder",
3
- "version": "0.2.13",
3
+ "version": "0.2.14",
4
4
  "type": "module",
5
5
  "description": "Webmate Studio Component Builder",
6
6
  "keywords": [
package/src/bundler.js CHANGED
@@ -43,9 +43,8 @@ export async function bundleIsland(islandPath, outputPath, options = {}) {
43
43
  outfile: outputPath,
44
44
  platform: 'browser',
45
45
  // Loaders for different file types
46
- // NOTE: SVG uses 'base64' loader instead of 'dataurl' because CSS background-image
47
- // doesn't accept unescaped XML in data URLs (data:image/svg+xml,<?xml...)
48
- // but works with base64 (data:image/svg+xml;base64,PHN2Zy4uLg==)
46
+ // NOTE: SVG is handled by custom plugin above (svg-base64-dataurl)
47
+ // to generate proper data:image/svg+xml;base64,... URLs for CSS compatibility
49
48
  loader: useJsxLoader ? {
50
49
  '.jsx': 'jsx',
51
50
  '.ts': 'tsx',
@@ -54,7 +53,7 @@ export async function bundleIsland(islandPath, outputPath, options = {}) {
54
53
  '.jpeg': 'dataurl',
55
54
  '.png': 'dataurl',
56
55
  '.gif': 'dataurl',
57
- '.svg': 'base64', // Changed from 'dataurl' to 'base64' for CSS compatibility
56
+ // '.svg': handled by custom plugin
58
57
  '.webp': 'dataurl'
59
58
  } : {
60
59
  '.ts': 'tsx',
@@ -63,7 +62,7 @@ export async function bundleIsland(islandPath, outputPath, options = {}) {
63
62
  '.jpeg': 'dataurl',
64
63
  '.png': 'dataurl',
65
64
  '.gif': 'dataurl',
66
- '.svg': 'base64', // Changed from 'dataurl' to 'base64' for CSS compatibility
65
+ // '.svg': handled by custom plugin
67
66
  '.webp': 'dataurl'
68
67
  },
69
68
  // Use automatic JSX runtime (React 17+) only for JSX files
@@ -81,6 +80,23 @@ export async function bundleIsland(islandPath, outputPath, options = {}) {
81
80
  '__VUE_PROD_HYDRATION_MISMATCH_DETAILS__': 'false'
82
81
  },
83
82
  plugins: [
83
+ // SVG to base64 data URL loader
84
+ // esbuild's built-in 'base64' loader only returns the base64 string without the data URL prefix
85
+ // We need the full data:image/svg+xml;base64,... format for CSS background-image
86
+ {
87
+ name: 'svg-base64-dataurl',
88
+ setup(build) {
89
+ build.onLoad({ filter: /\.svg$/ }, async (args) => {
90
+ const svgContent = await fs.readFile(args.path, 'utf8');
91
+ const base64 = Buffer.from(svgContent).toString('base64');
92
+ const dataUrl = `data:image/svg+xml;base64,${base64}`;
93
+ return {
94
+ contents: `export default ${JSON.stringify(dataUrl)}`,
95
+ loader: 'js'
96
+ };
97
+ });
98
+ }
99
+ },
84
100
  // CSS imports from node_modules (e.g., import "swiper/swiper-bundle.css")
85
101
  // Convert to inline text that can be injected as <style> tag
86
102
  {