UNPKG

vite-awesome-svg-loader

Version:

A universal Vite SVG loader. Imports SVGs as source code, base64 and data URI. Preserves stroke width. Replaces colors with currentColor or custom colors. Creates SVG sprites. Optimizes SVGs.

4 lines (3 loc) 7.4 kB
"use strict";const q=require("node:fs/promises"),V=require("path"),fe=require("svgo"),se=require("svgo/lib/xast.js"),pe=require("imurmurhash"),K=require("../common-utils/index-Bp2I1MnI.cjs"),me=require("css-tree");function he(e){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(s,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return s.default=e,Object.freeze(s)}const g=he(me);function Y(e){return e=e.replaceAll("\\","/"),e.endsWith("/")&&(e=e.substring(0,e.length-1)),e}function Z(e){const s=String.fromCodePoint(...new TextEncoder().encode(e));return btoa(s)}function ee(e){return e.replaceAll("`","\\`")}function de(e){return ne(e.queryValue)||N(e)}function ne(e){return!!e&&e.toLowerCase()!=="false"}function N(e){const s=[V.basename(e.relativePath),e.relativePath],t=K.i(e.matchers);return t.length?t.some(o=>{switch(typeof o){case"string":return s.some(a=>a===o);case"function":return o({fullPath:e.fullPath,relativePath:e.relativePath})}return s.some(a=>o.test(a))}):!1}function te(e){return e.replaceAll(/\s+/g," ").trim()}function ge(e){const s=K.i(e.selectors),t=[];for(const o of s){if(typeof o=="string"){t.push(te(o));continue}if(N({...e,matchers:o.files}))for(const a of o.selectors)t.push(te(a))}return t}const oe=se.matches;function T(e,s){for(const t of s)if(oe(e,t))return!0;return!1}function G(e,s){return e?s.replacements[e.toLowerCase()]||s.default||e:s.default||""}function _e(e){return Array.isArray(e?.files)}const be={circle:!0,ellipse:!0,foreignObject:!0,image:!0,line:!0,path:!0,polygon:!0,polyline:!0,rect:!0,text:!0,textPath:!0,tspan:!0,use:!0};function ve(e,s){if(!be[e.name])return;const t=e.attributes["vector-effect"];t&&t!=="non-scaling-stroke"?console.warn(`"${s}": Element "${e.name}" already contains "vector-effect" property. Please remove it, so it can scale correctly. This element will not be transformed.`):e.attributes["vector-effect"]="non-scaling-stroke"}const ie={fill:!0,stroke:!0,"stop-color":!0},F={none:!0,transparent:!0,currentColor:!0},ye=["url","source","source-data-uri","base64","base64-data-uri"];function re(e,s,t,o=!1){if(!e||typeof e!="string")return"";let a="stylesheet";o&&(e=`{${e}}`,a="block");const i=!o&&t.length;let c=[],p=[],b=!1;const S=g.parse(e,{context:a});return g.walk(S,{visit:i?void 0:"Declaration",enter:function(u){if(u.__SKIP_SVG_LOADER__||this.rule?.__SKIP_SVG_LOADER__)return;if(i){if(u.type==="SelectorList"){c=[],p=[],b=!1;return}if(u.type==="Selector"){const m=g.generate(u);let n=!1;for(const f of t)if(oe(f,m)){n=!0,u.__ORIG_COLOR__=!0;break}(n?c:p).push(m);return}}if(u.type!=="Declaration"||!ie[u.property])return;const C=u.value?.children?.first,P=C?.value||C?.name;if(!(!P||F[P])){if(i&&!b&&this.rule?.prelude.type==="SelectorList"){const m=g.clone(this.rule);m.__SKIP_SVG_LOADER__=!0;const n=new g.List,f=this.rule.prelude.children;f.forEach((y,h)=>{y.__ORIG_COLOR__&&(f.remove(h),n.push(y))}),m.prelude.children=n;const v=this.atrule?.block?.children||this.stylesheet?.children;let l;v?.some((y,h)=>y===this.rule?(l=h,!0):!1),l?v?.insertData(m,l):v?.push(m),b=!0}u.value=g.parse(G(g.generate(u.value),s),{context:"value"})}}}),g.generate(S)}const we={circle:!0,ellipse:!0,path:!0,polygon:!0,polyline:!0,rect:!0,text:!0,textPath:!0,tref:!0,tspan:!0},le={...ie};delete le.fill;function xe(e,s,t,o){if(e.name==="style"){const c=e.children[0],p=re(c?.value,t,o,!1);p&&(c.value=p)}else{const c=re(e.attributes.style,t,o,!0);c&&(e.attributes.style=c)}const a=e.name==="svg",i=e.attributes.fill;a&&i&&(s=!0),(a&&s||!a&&!s&&we[e.name])&&!F[i]&&(e.attributes.fill=G(i,t));for(const c in le){const p=e.attributes[c];p&&!F[p]&&(e.attributes[c]=G(p,t))}return s}function Le(e={}){const{urlImportsInLibraryMode:s="source-data-uri"}=e;let t=e.tempDir||".temp";if(t.startsWith("/")||t.startsWith("./")||t.indexOf(":/")!==-1)throw new Error(`"tempDir" option must be in format "path/to/temp/dir",i.e. it shouldn't be an absolute path, or start with "./".It'll be resolved to the project's root by the plugin.`);t.endsWith("/")&&(t=t.substring(0,t.length-1)),t="/"+t;let o=!1,a=!1,i="",c="";const p=K.i(e.replaceColorsList||[]),b=[],S=[],u={files:/.*/,replacements:{},default:""};let C=!1;const P=n=>{switch(typeof n){case"string":case"function":return!0}return n instanceof RegExp};for(const n of p){if(_e(n)){b.push(n);continue}if(P(n)){S.push({files:n,replacements:{},default:"currentColor"});continue}for(const f in n)C=!0,u.replacements[f]=n[f]}const m=[...b,...S];return C&&m.push(u),{name:"vite-awesome-svg-loader",enforce:"pre",config(n,{command:f}){o=f==="build"},configResolved(n){a=!!n.build.lib,i=Y(n.root),c=Y(n.base)},configureServer(n){n.httpServer?.on("close",async()=>{o||await q.rm(i+t,{force:!0,recursive:!0})})},async load(n){const f=".svg",v=n.indexOf(f);if(v===-1)return null;let l=n.substring(0,v+f.length).replaceAll("\\","/");l.startsWith(i)&&(l=l.substring(i.length)),l.startsWith("/")||(l="/"+l);const y=(n.split("?",2)[1]||"").split("&"),h={};for(const r of y){const[L,$]=r.split("=");h[L.toLowerCase()]=$||"1"}const R={fullPath:(i.endsWith("/")?i.substring(i.length):i)+l,relativePath:l},O=r=>de({...R,matchers:r.matchers||[],queryValue:h[r.param]}),D=r=>ge({...R,selectors:r||[]});if(O({param:"skip-awesome-svg-loader",matchers:e.skipFilesList}))return null;const k=O({param:"skip-transforms",matchers:e.skipTransformsList}),j=!k&&O({param:"preserve-line-width",matchers:e.preserveLineWidthList})&&!O({matchers:e.skipPreserveLineWidthList}),U=j?D(e.skipPreserveLineWidthSelectors):[];let w=!1;const _={replacements:{},default:void 0};if(!k&&!O({matchers:e.skipReplaceColorsList})){if(ne(h["set-current-color"]))_.default="currentColor",w=!0;else for(const r of m)if(N({...R,matchers:r.files})){w=!0,_.default===void 0&&r.default!==void 0&&(_.default=r.default);for(const L in r.replacements)_.replacements[L]||=r.replacements[L]}}_.default??="currentColor";const E=w?D(e.skipReplaceColorsSelectors):[],W=k?[]:D(e.skipTransformsSelectors),I=[l];for(const r of[U,E,W])I.push(r.join(","));for(const r of[k,j,w])I.push(r?"1":"0");w&&I.push(JSON.stringify(_));const ae=new pe(I.join("__")).result(),z=`${V.basename(l).split(".")[0]}-${ae}`,M=z+".svg",ce=V.dirname(l)+"/"+M,J=i+l;let d=(await q.readFile(J)).toString(),B=!1;const H=[],Q=z+"__";let X=!1;d=fe.optimize(d,{multipass:!0,plugins:[{name:"prefixIds",params:{prefixIds:!0,prefixClassNames:!0,prefix:Q,delim:""}},{name:"awesome-svg-loader",fn:()=>X?null:(X=!0,{root:{enter:r=>{for(const L of[E,W])for(const $ of L)H.push(...se.querySelectorAll(r,$))}},element:{enter:r=>{T(r,W)||(j&&!T(r,U)&&ve(r,J),w&&!T(r,E)&&(B=xe(r,B,_,H)))}}})}]}).data;let A=e.defaultImport||"source";for(const r of ye)h[r]&&(A=r);a&&A==="url"&&s!=="emit-files"&&(A=s);const x=r=>[`export const src = ${r};`,`export const prefix = "${Q}"`,"export default src"].join(` `);switch(A){case"source":return x("`"+ee(d)+"`");case"source-data-uri":return x("`data:image/svg+xml,"+encodeURIComponent(d)+"`");case"base64":return x("`"+ee(Z(d))+"`");case"base64-data-uri":return x("`data:image/svg+xml;base64,"+encodeURIComponent(Z(d))+"`")}if(!o){const r=t+ce;return await q.writeFile(i+r,d),x(`"${c+r}"`)}const ue=this.emitFile({type:"asset",name:M,source:d});return x(`"__VITE_ASSET__${ue}__"`)}}}exports.Ae=Le; //# sourceMappingURL=index-DTOezOEK.cjs.map