| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950 |
- import { readFileSync, readdirSync } from 'fs'
- let idPerfix = ''
- const svgTitle = /<svg([^>+].*?)>/
- const clearHeightWidth = /(width|height)="([^>+].*?)"/g
- const hasViewBox = /(viewBox="[^>+].*?")/g
- const clearReturn = /(\r)|(\n)/g
- // Find the svg file
- function svgFind(e) {
- const arr = []
- const dirents = readdirSync(e, { withFileTypes: true })
- for (const dirent of dirents) {
- if (dirent.isDirectory()) arr.push(...svgFind(e + dirent.name + '/'))
- else {
- const svg = readFileSync(e + dirent.name)
- .toString()
- .replace(clearReturn, '')
- .replace(svgTitle, ($1, $2) => {
- let width = 0
- let height = 0
- let content = $2.replace(clearHeightWidth, (s1, s2, s3) => {
- if (s2 === 'width') width = s3
- else if (s2 === 'height') height = s3
- return ''
- })
- if (!hasViewBox.test($2)) content += `viewBox="0 0 ${width} ${height}"`
- return `<symbol id="${idPerfix}-${dirent.name.replace('.svg', '')}" ${content}>`
- }).replace('</svg>', '</symbol>')
- arr.push(svg)
- }
- }
- return arr
- }
- export const svgBuilder = (path: any, perfix = 'icon') => {
- if (path === '') return
- idPerfix = perfix
- const res = svgFind(path)
- console.log(res)
- return {
- name: 'svg-transform',
- transformIndexHtml (dom: String) {
- return dom.replace(
- '<body>',
- `<body><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="position: absolute; width: 0; height: 0" version="1.1">${res.join('')}</svg>`
- )
- }
- }
- }
|
