ccm/btroops
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Tried importing svgs in an esbuild plugin

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc 2024-05-28 14:41:33 -07:00
parent e6fb0354e0
commit a34cd1a541
1 changed files with 75 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
esbuild-server.mjs
View File

@ -13,11 +13,79 @@ const colors = {
yellow: '\x1b[33m',
}
const regex = new RegExp('mapsheets\..+\.svg');
let version;
const importSvg = {
name: 'importSvg',
setup(build) {
const regex = new RegExp(/\.svg$/);
build.onResolve({ filter: /\*\.svg$/ }, args => {
console.log('onresolve', args);
return {
path: path.join('public', 'assets', args.path),
namespace: 'svg-stub'
}
});
build.onLoad({ filter: /\.svg$/, namespace: 'svg-stub' }, async (args) => {
console.log('onload', args);
const svgs = fs.readdirSync(path.resolve(path.dirname(args.path))).filter(fn => regex.test(fn));;
console.log(svgs);
console.log('resolved path', path.join(path.dirname(args.path), 'mapsheets.svg'));
console.log('cwd', process.cwd());
// const contents = `import mapsheets from ./${path.join(path.dirname(args.path), 'mapsheets.svg')};
// console.log('mapsheets', mapsheets);
// export default mapsheets;`;
// const contents = `
// import svg from '/usr/src/app/public/assets/images/scenario-side_show.svg';
// export default svg;
// `;
// const contents = `
// import svg from '/usr/src/app/public/assets/images/scenario-side_show.svg';
// export default svg;
// `;
// const contents = `
// export { default as scenario_sideShow } from '/usr/src/app/public/assets/images/scenario-side_show.svg';
// export { default as mapsheets } from '/usr/src/app/public/assets/images/mapsheets.svg';
// `;
const contents = `
// export { default as countorLines } from './contour-lines.svg';
export { default as mapsheets } from './mapsheets.svg';
`;
console.log('resolveDir', path.dirname(args.path));
console.log('contents', contents);
return {
contents: contents,
resolveDir: path.dirname(args.path) //'./public/assets/images'
}
});
// build.onLoad({ filter: /.*/, namespace: 'svg-stub' }, async (args) => ({
// contents: `import svg from ${JSON.stringify(args.path)}
// export default (imports) =>
// WebAssembly.instantiate(wasm, imports).then(
// result => result.instance.exports)`,
// }));
}
};
const svgUseCacheBust = {
name: 'svgUseCacheBust',
setup(build) {
const regex = new RegExp('mapsheets\..+\.svg');
build.onStart(() => {
console.log("BUILD START");
@ -38,7 +106,10 @@ const ctx = await esbuild.context({
entryPoints: ['src/*.js'],
bundle: true,
outdir: 'build',
plugins: [svgUseCacheBust],
plugins: [svgUseCacheBust, importSvg],
loader: {
'.svg': 'file'
},
});
await ctx.watch();
@ -92,6 +163,8 @@ http.createServer((req, res) => {
path.join(dir, url.pathname === '/' ? 'index.html' : url.pathname)
);
console.log('filepath', filePath);
for (const k in res.headers) {
res.setHeader(k, res.headers[k]);
}