import { readFileSync, readdirSync } from 'fs' let idPerfix = '' const svgTitle = /+].*?)>/ const clearHeightWidth = /(width|height)="([^>+].*?)"/g const hasViewBox = /(viewBox="[^>+].*?")/g const clearReturn = /(\r)|(\n)/g function findSvgFile(dir: string):string[] { const svgRes = [] const dirents = readdirSync(dir, { withFileTypes: true }) for (const dirent of dirents) { if (dirent.isDirectory()) { svgRes.push(...findSvgFile(dir + dirent.name + '/')) } else { const svg = readFileSync(dir + dirent.name) .toString() .replace(clearReturn, '') .replace(svgTitle, (_, $2: string) => { let width: string = '0' let height: string = '0' let content = $2.replace(clearHeightWidth, (_: string, s2: string, s3: string) => { if (s2 === 'width') { width = s3 } else if (s2 === 'height') { height = s3 } return '' }) if (!hasViewBox.test($2)) { content += `viewBox="0 0 ${width} ${height}"` } return `` }) .replace('', '') svgRes.push(svg) } } return svgRes } export const svgLoader = (path: string, perfix = 'icon') => { if (path === '') return idPerfix = perfix console.log('svgLoader'); const res = findSvgFile(path) return { name: 'svg-transform', transformIndexHtml(html: any) { return html.replace( '', ` ${res.join('')} ` ) } } }