` |
+| svgo | `boolean` or `object` | `true` | Take an SVGO Options object. If `true`, it will use the [default SVGO preset](https://github.com/svg/svgo#default-preset), if `false`, it will disable SVGO optimization |
+
+### output
+
+| Options | Type | Default | Description |
+| -------- | --------- | ------------------------ | ------------------------------------------------------------------------------------------------------------------------------- |
+| filename | `string` | `[name].[hash][extname]` | The destination of the file. You can use [output filename like Rollup](https://www.rollupjs.org/guide/en/#outputassetfilenames) |
+| use | `boolean` | true | Insert `use` element in the spritemap |
+| view | `boolean` | true | Insert `view` element in the spritemap |
+
+### styles
+
+| Options | Type | Description |
+| -------- | ----------------------------------------- | -------------------------------------------------------------- |
+| filename | string | The destination of the stylesheet file like your source folder |
+| lang | `less`/`scss`/`styl`/`css` or `undefined` | |
+
+## 🏃 What's next
+
+- Add variable supports inspired by [svg-spritemap-webpack-plugin](https://github.com/cascornelissen/svg-spritemap-webpack-plugin/blob/master/docs/variables.md)
+- Add support for SVG import as Vue Component
+
+## 👨💼 Licence
+
+MIT
diff --git a/vite-plugins/svg-spritemap/demo/.gitignore b/vite-plugins/svg-spritemap/demo/.gitignore
new file mode 100644
index 0000000..a547bf3
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/vite-plugins/svg-spritemap/demo/favicon.svg b/vite-plugins/svg-spritemap/demo/favicon.svg
new file mode 100644
index 0000000..de4aedd
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/favicon.svg
@@ -0,0 +1,15 @@
+
diff --git a/vite-plugins/svg-spritemap/demo/index.html b/vite-plugins/svg-spritemap/demo/index.html
new file mode 100644
index 0000000..1a09db4
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/index.html
@@ -0,0 +1,56 @@
+
+
+
+
+
+
+ Vite Plugin SVG Spritemap Demo
+
+
+ Vite Plugin SVG Spritemap Demo
+
+ This is a demo of the Vite Plugin SVG Spritemap feature.
+
+
+
Spritemap with <use>
+
+
+
+
+
+
+
+
+
Spritemap with <img> (fragments)
+
+
+
+
+
+
+
+
+
Spritemap with background-image (fragments)
+
+
+
+
+
+
+
+
+
Spritemap with background-image data uri
+
+
+
+
+
+
+
+
+
+
diff --git a/vite-plugins/svg-spritemap/demo/package.json b/vite-plugins/svg-spritemap/demo/package.json
new file mode 100644
index 0000000..53b08c4
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/package.json
@@ -0,0 +1,18 @@
+{
+ "name": "demo",
+ "private": true,
+ "version": "0.0.0",
+ "scripts": {
+ "dev": "vite",
+ "build": "tsc && vite build",
+ "preview": "vite preview"
+ },
+ "devDependencies": {
+ "less": "^4.1.3",
+ "sass": "^1.58.3",
+ "stylus": "^0.59.0",
+ "typescript": "^4.9.5",
+ "vite": "^4.1.4",
+ "vite-plugin-inspect": "^0.7.15"
+ }
+}
diff --git a/vite-plugins/svg-spritemap/demo/pnpm-lock.yaml b/vite-plugins/svg-spritemap/demo/pnpm-lock.yaml
new file mode 100644
index 0000000..20918b6
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/pnpm-lock.yaml
@@ -0,0 +1,824 @@
+lockfileVersion: 5.4
+
+specifiers:
+ less: ^4.1.3
+ sass: ^1.58.3
+ stylus: ^0.59.0
+ typescript: ^4.9.5
+ vite: ^4.1.4
+ vite-plugin-inspect: ^0.7.15
+
+devDependencies:
+ less: 4.1.3
+ sass: 1.58.3
+ stylus: 0.59.0
+ typescript: 4.9.5
+ vite: 4.1.4_w7akx4qgh2oh637ou2wbfb5bgu
+ vite-plugin-inspect: 0.7.15_vite@4.1.4
+
+packages:
+
+ /@adobe/css-tools/4.0.1:
+ resolution: {integrity: sha512-+u76oB43nOHrF4DDWRLWDCtci7f3QJoEBigemIdIeTi1ODqjx6Tad9NCVnPRwewWlKkVab5PlK8DCtPTyX7S8g==}
+ dev: true
+
+ /@antfu/utils/0.7.2:
+ resolution: {integrity: sha512-vy9fM3pIxZmX07dL+VX1aZe7ynZ+YyB0jY+jE6r3hOK6GNY2t6W8rzpFC4tgpbXUYABkFQwgJq2XYXlxbXAI0g==}
+ dev: true
+
+ /@esbuild/android-arm/0.16.17:
+ resolution: {integrity: sha512-N9x1CMXVhtWEAMS7pNNONyA14f71VPQN9Cnavj1XQh6T7bskqiLLrSca4O0Vr8Wdcga943eThxnVp3JLnBMYtw==}
+ engines: {node: '>=12'}
+ cpu: [arm]
+ os: [android]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/android-arm64/0.16.17:
+ resolution: {integrity: sha512-MIGl6p5sc3RDTLLkYL1MyL8BMRN4tLMRCn+yRJJmEDvYZ2M7tmAf80hx1kbNEUX2KJ50RRtxZ4JHLvCfuB6kBg==}
+ engines: {node: '>=12'}
+ cpu: [arm64]
+ os: [android]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/android-x64/0.16.17:
+ resolution: {integrity: sha512-a3kTv3m0Ghh4z1DaFEuEDfz3OLONKuFvI4Xqczqx4BqLyuFaFkuaG4j2MtA6fuWEFeC5x9IvqnX7drmRq/fyAQ==}
+ engines: {node: '>=12'}
+ cpu: [x64]
+ os: [android]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/darwin-arm64/0.16.17:
+ resolution: {integrity: sha512-/2agbUEfmxWHi9ARTX6OQ/KgXnOWfsNlTeLcoV7HSuSTv63E4DqtAc+2XqGw1KHxKMHGZgbVCZge7HXWX9Vn+w==}
+ engines: {node: '>=12'}
+ cpu: [arm64]
+ os: [darwin]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/darwin-x64/0.16.17:
+ resolution: {integrity: sha512-2By45OBHulkd9Svy5IOCZt376Aa2oOkiE9QWUK9fe6Tb+WDr8hXL3dpqi+DeLiMed8tVXspzsTAvd0jUl96wmg==}
+ engines: {node: '>=12'}
+ cpu: [x64]
+ os: [darwin]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/freebsd-arm64/0.16.17:
+ resolution: {integrity: sha512-mt+cxZe1tVx489VTb4mBAOo2aKSnJ33L9fr25JXpqQqzbUIw/yzIzi+NHwAXK2qYV1lEFp4OoVeThGjUbmWmdw==}
+ engines: {node: '>=12'}
+ cpu: [arm64]
+ os: [freebsd]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/freebsd-x64/0.16.17:
+ resolution: {integrity: sha512-8ScTdNJl5idAKjH8zGAsN7RuWcyHG3BAvMNpKOBaqqR7EbUhhVHOqXRdL7oZvz8WNHL2pr5+eIT5c65kA6NHug==}
+ engines: {node: '>=12'}
+ cpu: [x64]
+ os: [freebsd]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/linux-arm/0.16.17:
+ resolution: {integrity: sha512-iihzrWbD4gIT7j3caMzKb/RsFFHCwqqbrbH9SqUSRrdXkXaygSZCZg1FybsZz57Ju7N/SHEgPyaR0LZ8Zbe9gQ==}
+ engines: {node: '>=12'}
+ cpu: [arm]
+ os: [linux]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/linux-arm64/0.16.17:
+ resolution: {integrity: sha512-7S8gJnSlqKGVJunnMCrXHU9Q8Q/tQIxk/xL8BqAP64wchPCTzuM6W3Ra8cIa1HIflAvDnNOt2jaL17vaW+1V0g==}
+ engines: {node: '>=12'}
+ cpu: [arm64]
+ os: [linux]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/linux-ia32/0.16.17:
+ resolution: {integrity: sha512-kiX69+wcPAdgl3Lonh1VI7MBr16nktEvOfViszBSxygRQqSpzv7BffMKRPMFwzeJGPxcio0pdD3kYQGpqQ2SSg==}
+ engines: {node: '>=12'}
+ cpu: [ia32]
+ os: [linux]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/linux-loong64/0.16.17:
+ resolution: {integrity: sha512-dTzNnQwembNDhd654cA4QhbS9uDdXC3TKqMJjgOWsC0yNCbpzfWoXdZvp0mY7HU6nzk5E0zpRGGx3qoQg8T2DQ==}
+ engines: {node: '>=12'}
+ cpu: [loong64]
+ os: [linux]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/linux-mips64el/0.16.17:
+ resolution: {integrity: sha512-ezbDkp2nDl0PfIUn0CsQ30kxfcLTlcx4Foz2kYv8qdC6ia2oX5Q3E/8m6lq84Dj/6b0FrkgD582fJMIfHhJfSw==}
+ engines: {node: '>=12'}
+ cpu: [mips64el]
+ os: [linux]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/linux-ppc64/0.16.17:
+ resolution: {integrity: sha512-dzS678gYD1lJsW73zrFhDApLVdM3cUF2MvAa1D8K8KtcSKdLBPP4zZSLy6LFZ0jYqQdQ29bjAHJDgz0rVbLB3g==}
+ engines: {node: '>=12'}
+ cpu: [ppc64]
+ os: [linux]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/linux-riscv64/0.16.17:
+ resolution: {integrity: sha512-ylNlVsxuFjZK8DQtNUwiMskh6nT0vI7kYl/4fZgV1llP5d6+HIeL/vmmm3jpuoo8+NuXjQVZxmKuhDApK0/cKw==}
+ engines: {node: '>=12'}
+ cpu: [riscv64]
+ os: [linux]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/linux-s390x/0.16.17:
+ resolution: {integrity: sha512-gzy7nUTO4UA4oZ2wAMXPNBGTzZFP7mss3aKR2hH+/4UUkCOyqmjXiKpzGrY2TlEUhbbejzXVKKGazYcQTZWA/w==}
+ engines: {node: '>=12'}
+ cpu: [s390x]
+ os: [linux]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/linux-x64/0.16.17:
+ resolution: {integrity: sha512-mdPjPxfnmoqhgpiEArqi4egmBAMYvaObgn4poorpUaqmvzzbvqbowRllQ+ZgzGVMGKaPkqUmPDOOFQRUFDmeUw==}
+ engines: {node: '>=12'}
+ cpu: [x64]
+ os: [linux]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/netbsd-x64/0.16.17:
+ resolution: {integrity: sha512-/PzmzD/zyAeTUsduZa32bn0ORug+Jd1EGGAUJvqfeixoEISYpGnAezN6lnJoskauoai0Jrs+XSyvDhppCPoKOA==}
+ engines: {node: '>=12'}
+ cpu: [x64]
+ os: [netbsd]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/openbsd-x64/0.16.17:
+ resolution: {integrity: sha512-2yaWJhvxGEz2RiftSk0UObqJa/b+rIAjnODJgv2GbGGpRwAfpgzyrg1WLK8rqA24mfZa9GvpjLcBBg8JHkoodg==}
+ engines: {node: '>=12'}
+ cpu: [x64]
+ os: [openbsd]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/sunos-x64/0.16.17:
+ resolution: {integrity: sha512-xtVUiev38tN0R3g8VhRfN7Zl42YCJvyBhRKw1RJjwE1d2emWTVToPLNEQj/5Qxc6lVFATDiy6LjVHYhIPrLxzw==}
+ engines: {node: '>=12'}
+ cpu: [x64]
+ os: [sunos]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/win32-arm64/0.16.17:
+ resolution: {integrity: sha512-ga8+JqBDHY4b6fQAmOgtJJue36scANy4l/rL97W+0wYmijhxKetzZdKOJI7olaBaMhWt8Pac2McJdZLxXWUEQw==}
+ engines: {node: '>=12'}
+ cpu: [arm64]
+ os: [win32]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/win32-ia32/0.16.17:
+ resolution: {integrity: sha512-WnsKaf46uSSF/sZhwnqE4L/F89AYNMiD4YtEcYekBt9Q7nj0DiId2XH2Ng2PHM54qi5oPrQ8luuzGszqi/veig==}
+ engines: {node: '>=12'}
+ cpu: [ia32]
+ os: [win32]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@esbuild/win32-x64/0.16.17:
+ resolution: {integrity: sha512-y+EHuSchhL7FjHgvQL/0fnnFmO4T1bhvWANX6gcnqTjtnKWbTvUMCpGnv2+t+31d7RzyEAYAd4u2fnIhHL6N/Q==}
+ engines: {node: '>=12'}
+ cpu: [x64]
+ os: [win32]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /@polka/url/1.0.0-next.21:
+ resolution: {integrity: sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==}
+ dev: true
+
+ /@rollup/pluginutils/5.0.2:
+ resolution: {integrity: sha512-pTd9rIsP92h+B6wWwFbW8RkZv4hiR/xKsqre4SIuAOaOEQRxi0lqLke9k2/7WegC85GgUs9pjmOjCUi3In4vwA==}
+ engines: {node: '>=14.0.0'}
+ peerDependencies:
+ rollup: ^1.20.0||^2.0.0||^3.0.0
+ peerDependenciesMeta:
+ rollup:
+ optional: true
+ dependencies:
+ '@types/estree': 1.0.0
+ estree-walker: 2.0.2
+ picomatch: 2.3.1
+ dev: true
+
+ /@types/estree/1.0.0:
+ resolution: {integrity: sha512-WulqXMDUTYAXCjZnk6JtIHPigp55cVtDgDrO2gHRwhyJto21+1zbVCtOYB2L1F9w4qCQ0rOGWBnBe0FNTiEJIQ==}
+ dev: true
+
+ /anymatch/3.1.3:
+ resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
+ engines: {node: '>= 8'}
+ dependencies:
+ normalize-path: 3.0.0
+ picomatch: 2.3.1
+ dev: true
+
+ /balanced-match/1.0.2:
+ resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
+ dev: true
+
+ /binary-extensions/2.2.0:
+ resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==}
+ engines: {node: '>=8'}
+ dev: true
+
+ /brace-expansion/1.1.11:
+ resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==}
+ dependencies:
+ balanced-match: 1.0.2
+ concat-map: 0.0.1
+ dev: true
+
+ /braces/3.0.2:
+ resolution: {integrity: sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==}
+ engines: {node: '>=8'}
+ dependencies:
+ fill-range: 7.0.1
+ dev: true
+
+ /chokidar/3.5.3:
+ resolution: {integrity: sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==}
+ engines: {node: '>= 8.10.0'}
+ dependencies:
+ anymatch: 3.1.3
+ braces: 3.0.2
+ glob-parent: 5.1.2
+ is-binary-path: 2.1.0
+ is-glob: 4.0.3
+ normalize-path: 3.0.0
+ readdirp: 3.6.0
+ optionalDependencies:
+ fsevents: 2.3.2
+ dev: true
+
+ /concat-map/0.0.1:
+ resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
+ dev: true
+
+ /copy-anything/2.0.6:
+ resolution: {integrity: sha512-1j20GZTsvKNkc4BY3NpMOM8tt///wY3FpIzozTOFO2ffuZcV61nojHXVKIy3WM+7ADCy5FVhdZYHYDdgTU0yJw==}
+ dependencies:
+ is-what: 3.14.1
+ dev: true
+
+ /debug/3.2.7:
+ resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==}
+ peerDependencies:
+ supports-color: '*'
+ peerDependenciesMeta:
+ supports-color:
+ optional: true
+ dependencies:
+ ms: 2.1.3
+ dev: true
+ optional: true
+
+ /debug/4.3.4:
+ resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
+ engines: {node: '>=6.0'}
+ peerDependencies:
+ supports-color: '*'
+ peerDependenciesMeta:
+ supports-color:
+ optional: true
+ dependencies:
+ ms: 2.1.2
+ dev: true
+
+ /errno/0.1.8:
+ resolution: {integrity: sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==}
+ hasBin: true
+ requiresBuild: true
+ dependencies:
+ prr: 1.0.1
+ dev: true
+ optional: true
+
+ /esbuild/0.16.17:
+ resolution: {integrity: sha512-G8LEkV0XzDMNwXKgM0Jwu3nY3lSTwSGY6XbxM9cr9+s0T/qSV1q1JVPBGzm3dcjhCic9+emZDmMffkwgPeOeLg==}
+ engines: {node: '>=12'}
+ hasBin: true
+ requiresBuild: true
+ optionalDependencies:
+ '@esbuild/android-arm': 0.16.17
+ '@esbuild/android-arm64': 0.16.17
+ '@esbuild/android-x64': 0.16.17
+ '@esbuild/darwin-arm64': 0.16.17
+ '@esbuild/darwin-x64': 0.16.17
+ '@esbuild/freebsd-arm64': 0.16.17
+ '@esbuild/freebsd-x64': 0.16.17
+ '@esbuild/linux-arm': 0.16.17
+ '@esbuild/linux-arm64': 0.16.17
+ '@esbuild/linux-ia32': 0.16.17
+ '@esbuild/linux-loong64': 0.16.17
+ '@esbuild/linux-mips64el': 0.16.17
+ '@esbuild/linux-ppc64': 0.16.17
+ '@esbuild/linux-riscv64': 0.16.17
+ '@esbuild/linux-s390x': 0.16.17
+ '@esbuild/linux-x64': 0.16.17
+ '@esbuild/netbsd-x64': 0.16.17
+ '@esbuild/openbsd-x64': 0.16.17
+ '@esbuild/sunos-x64': 0.16.17
+ '@esbuild/win32-arm64': 0.16.17
+ '@esbuild/win32-ia32': 0.16.17
+ '@esbuild/win32-x64': 0.16.17
+ dev: true
+
+ /estree-walker/2.0.2:
+ resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==}
+ dev: true
+
+ /fill-range/7.0.1:
+ resolution: {integrity: sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==}
+ engines: {node: '>=8'}
+ dependencies:
+ to-regex-range: 5.0.1
+ dev: true
+
+ /fs-extra/11.1.0:
+ resolution: {integrity: sha512-0rcTq621PD5jM/e0a3EJoGC/1TC5ZBCERW82LQuwfGnCa1V8w7dpYH1yNu+SLb6E5dkeCBzKEyLGlFrnr+dUyw==}
+ engines: {node: '>=14.14'}
+ dependencies:
+ graceful-fs: 4.2.10
+ jsonfile: 6.1.0
+ universalify: 2.0.0
+ dev: true
+
+ /fs.realpath/1.0.0:
+ resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
+ dev: true
+
+ /fsevents/2.3.2:
+ resolution: {integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==}
+ engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+ os: [darwin]
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /function-bind/1.1.1:
+ resolution: {integrity: sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==}
+ dev: true
+
+ /glob-parent/5.1.2:
+ resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==}
+ engines: {node: '>= 6'}
+ dependencies:
+ is-glob: 4.0.3
+ dev: true
+
+ /glob/7.2.3:
+ resolution: {integrity: sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==}
+ dependencies:
+ fs.realpath: 1.0.0
+ inflight: 1.0.6
+ inherits: 2.0.4
+ minimatch: 3.1.2
+ once: 1.4.0
+ path-is-absolute: 1.0.1
+ dev: true
+
+ /graceful-fs/4.2.10:
+ resolution: {integrity: sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA==}
+ requiresBuild: true
+ dev: true
+
+ /has/1.0.3:
+ resolution: {integrity: sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==}
+ engines: {node: '>= 0.4.0'}
+ dependencies:
+ function-bind: 1.1.1
+ dev: true
+
+ /iconv-lite/0.6.3:
+ resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==}
+ engines: {node: '>=0.10.0'}
+ dependencies:
+ safer-buffer: 2.1.2
+ dev: true
+ optional: true
+
+ /image-size/0.5.5:
+ resolution: {integrity: sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==}
+ engines: {node: '>=0.10.0'}
+ hasBin: true
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /immutable/4.1.0:
+ resolution: {integrity: sha512-oNkuqVTA8jqG1Q6c+UglTOD1xhC1BtjKI7XkCXRkZHrN5m18/XsnUp8Q89GkQO/z+0WjonSvl0FLhDYftp46nQ==}
+ dev: true
+
+ /inflight/1.0.6:
+ resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==}
+ dependencies:
+ once: 1.4.0
+ wrappy: 1.0.2
+ dev: true
+
+ /inherits/2.0.4:
+ resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
+ dev: true
+
+ /is-binary-path/2.1.0:
+ resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==}
+ engines: {node: '>=8'}
+ dependencies:
+ binary-extensions: 2.2.0
+ dev: true
+
+ /is-core-module/2.11.0:
+ resolution: {integrity: sha512-RRjxlvLDkD1YJwDbroBHMb+cukurkDWNyHx7D3oNB5x9rb5ogcksMC5wHCadcXoo67gVr/+3GFySh3134zi6rw==}
+ dependencies:
+ has: 1.0.3
+ dev: true
+
+ /is-extglob/2.1.1:
+ resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
+ engines: {node: '>=0.10.0'}
+ dev: true
+
+ /is-glob/4.0.3:
+ resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==}
+ engines: {node: '>=0.10.0'}
+ dependencies:
+ is-extglob: 2.1.1
+ dev: true
+
+ /is-number/7.0.0:
+ resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==}
+ engines: {node: '>=0.12.0'}
+ dev: true
+
+ /is-what/3.14.1:
+ resolution: {integrity: sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==}
+ dev: true
+
+ /jsonfile/6.1.0:
+ resolution: {integrity: sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==}
+ dependencies:
+ universalify: 2.0.0
+ optionalDependencies:
+ graceful-fs: 4.2.10
+ dev: true
+
+ /kolorist/1.6.0:
+ resolution: {integrity: sha512-dLkz37Ab97HWMx9KTes3Tbi3D1ln9fCAy2zr2YVExJasDRPGRaKcoE4fycWNtnCAJfjFqe0cnY+f8KT2JePEXQ==}
+ dev: true
+
+ /less/4.1.3:
+ resolution: {integrity: sha512-w16Xk/Ta9Hhyei0Gpz9m7VS8F28nieJaL/VyShID7cYvP6IL5oHeL6p4TXSDJqZE/lNv0oJ2pGVjJsRkfwm5FA==}
+ engines: {node: '>=6'}
+ hasBin: true
+ dependencies:
+ copy-anything: 2.0.6
+ parse-node-version: 1.0.1
+ tslib: 2.4.1
+ optionalDependencies:
+ errno: 0.1.8
+ graceful-fs: 4.2.10
+ image-size: 0.5.5
+ make-dir: 2.1.0
+ mime: 1.6.0
+ needle: 3.2.0
+ source-map: 0.6.1
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /make-dir/2.1.0:
+ resolution: {integrity: sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==}
+ engines: {node: '>=6'}
+ requiresBuild: true
+ dependencies:
+ pify: 4.0.1
+ semver: 5.7.1
+ dev: true
+ optional: true
+
+ /mime/1.6.0:
+ resolution: {integrity: sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==}
+ engines: {node: '>=4'}
+ hasBin: true
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /minimatch/3.1.2:
+ resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
+ dependencies:
+ brace-expansion: 1.1.11
+ dev: true
+
+ /mrmime/1.0.1:
+ resolution: {integrity: sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==}
+ engines: {node: '>=10'}
+ dev: true
+
+ /ms/2.1.2:
+ resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
+ dev: true
+
+ /ms/2.1.3:
+ resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
+ dev: true
+ optional: true
+
+ /nanoid/3.3.4:
+ resolution: {integrity: sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==}
+ engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
+ hasBin: true
+ dev: true
+
+ /needle/3.2.0:
+ resolution: {integrity: sha512-oUvzXnyLiVyVGoianLijF9O/RecZUf7TkBfimjGrLM4eQhXyeJwM6GeAWccwfQ9aa4gMCZKqhAOuLaMIcQxajQ==}
+ engines: {node: '>= 4.4.x'}
+ hasBin: true
+ requiresBuild: true
+ dependencies:
+ debug: 3.2.7
+ iconv-lite: 0.6.3
+ sax: 1.2.4
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+ optional: true
+
+ /normalize-path/3.0.0:
+ resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
+ engines: {node: '>=0.10.0'}
+ dev: true
+
+ /once/1.4.0:
+ resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
+ dependencies:
+ wrappy: 1.0.2
+ dev: true
+
+ /parse-node-version/1.0.1:
+ resolution: {integrity: sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==}
+ engines: {node: '>= 0.10'}
+ dev: true
+
+ /path-is-absolute/1.0.1:
+ resolution: {integrity: sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==}
+ engines: {node: '>=0.10.0'}
+ dev: true
+
+ /path-parse/1.0.7:
+ resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
+ dev: true
+
+ /picocolors/1.0.0:
+ resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==}
+ dev: true
+
+ /picomatch/2.3.1:
+ resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
+ engines: {node: '>=8.6'}
+ dev: true
+
+ /pify/4.0.1:
+ resolution: {integrity: sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==}
+ engines: {node: '>=6'}
+ dev: true
+ optional: true
+
+ /postcss/8.4.21:
+ resolution: {integrity: sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==}
+ engines: {node: ^10 || ^12 || >=14}
+ dependencies:
+ nanoid: 3.3.4
+ picocolors: 1.0.0
+ source-map-js: 1.0.2
+ dev: true
+
+ /prr/1.0.1:
+ resolution: {integrity: sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==}
+ dev: true
+ optional: true
+
+ /readdirp/3.6.0:
+ resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
+ engines: {node: '>=8.10.0'}
+ dependencies:
+ picomatch: 2.3.1
+ dev: true
+
+ /resolve/1.22.1:
+ resolution: {integrity: sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==}
+ hasBin: true
+ dependencies:
+ is-core-module: 2.11.0
+ path-parse: 1.0.7
+ supports-preserve-symlinks-flag: 1.0.0
+ dev: true
+
+ /rollup/3.17.2:
+ resolution: {integrity: sha512-qMNZdlQPCkWodrAZ3qnJtvCAl4vpQ8q77uEujVCCbC/6CLB7Lcmvjq7HyiOSnf4fxTT9XgsE36oLHJBH49xjqA==}
+ engines: {node: '>=14.18.0', npm: '>=8.0.0'}
+ hasBin: true
+ optionalDependencies:
+ fsevents: 2.3.2
+ dev: true
+
+ /safer-buffer/2.1.2:
+ resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
+ dev: true
+ optional: true
+
+ /sass/1.58.3:
+ resolution: {integrity: sha512-Q7RaEtYf6BflYrQ+buPudKR26/lH+10EmO9bBqbmPh/KeLqv8bjpTNqxe71ocONqXq+jYiCbpPUmQMS+JJPk4A==}
+ engines: {node: '>=12.0.0'}
+ hasBin: true
+ dependencies:
+ chokidar: 3.5.3
+ immutable: 4.1.0
+ source-map-js: 1.0.2
+ dev: true
+
+ /sax/1.2.4:
+ resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==}
+ dev: true
+
+ /semver/5.7.1:
+ resolution: {integrity: sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==}
+ hasBin: true
+ dev: true
+ optional: true
+
+ /sirv/2.0.2:
+ resolution: {integrity: sha512-4Qog6aE29nIjAOKe/wowFTxOdmbEZKb+3tsLljaBRzJwtqto0BChD2zzH0LhgCSXiI+V7X+Y45v14wBZQ1TK3w==}
+ engines: {node: '>= 10'}
+ dependencies:
+ '@polka/url': 1.0.0-next.21
+ mrmime: 1.0.1
+ totalist: 3.0.0
+ dev: true
+
+ /source-map-js/1.0.2:
+ resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==}
+ engines: {node: '>=0.10.0'}
+ dev: true
+
+ /source-map/0.6.1:
+ resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
+ engines: {node: '>=0.10.0'}
+ requiresBuild: true
+ dev: true
+ optional: true
+
+ /source-map/0.7.4:
+ resolution: {integrity: sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==}
+ engines: {node: '>= 8'}
+ dev: true
+
+ /stylus/0.59.0:
+ resolution: {integrity: sha512-lQ9w/XIOH5ZHVNuNbWW8D822r+/wBSO/d6XvtyHLF7LW4KaCIDeVbvn5DF8fGCJAUCwVhVi/h6J0NUcnylUEjg==}
+ hasBin: true
+ dependencies:
+ '@adobe/css-tools': 4.0.1
+ debug: 4.3.4
+ glob: 7.2.3
+ sax: 1.2.4
+ source-map: 0.7.4
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /supports-preserve-symlinks-flag/1.0.0:
+ resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
+ engines: {node: '>= 0.4'}
+ dev: true
+
+ /to-regex-range/5.0.1:
+ resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
+ engines: {node: '>=8.0'}
+ dependencies:
+ is-number: 7.0.0
+ dev: true
+
+ /totalist/3.0.0:
+ resolution: {integrity: sha512-eM+pCBxXO/njtF7vdFsHuqb+ElbxqtI4r5EAvk6grfAFyJ6IvWlSkfZ5T9ozC6xWw3Fj1fGoSmrl0gUs46JVIw==}
+ engines: {node: '>=6'}
+ dev: true
+
+ /tslib/2.4.1:
+ resolution: {integrity: sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA==}
+ dev: true
+
+ /typescript/4.9.5:
+ resolution: {integrity: sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==}
+ engines: {node: '>=4.2.0'}
+ hasBin: true
+ dev: true
+
+ /ufo/1.1.0:
+ resolution: {integrity: sha512-LQc2s/ZDMaCN3QLpa+uzHUOQ7SdV0qgv3VBXOolQGXTaaZpIur6PwUclF5nN2hNkiTRcUugXd1zFOW3FLJ135Q==}
+ dev: true
+
+ /universalify/2.0.0:
+ resolution: {integrity: sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==}
+ engines: {node: '>= 10.0.0'}
+ dev: true
+
+ /vite-plugin-inspect/0.7.15_vite@4.1.4:
+ resolution: {integrity: sha512-oxeZCljacA/slhGFbDNlBqdhDU9fgdHL84i7Nz7DnaAIE7DhTiW2djanw3d/BKuZtduKUY82vRUQ4iaG917t2A==}
+ engines: {node: '>=14'}
+ peerDependencies:
+ vite: ^3.1.0 || ^4.0.0
+ dependencies:
+ '@antfu/utils': 0.7.2
+ '@rollup/pluginutils': 5.0.2
+ debug: 4.3.4
+ fs-extra: 11.1.0
+ kolorist: 1.6.0
+ sirv: 2.0.2
+ ufo: 1.1.0
+ vite: 4.1.4_w7akx4qgh2oh637ou2wbfb5bgu
+ transitivePeerDependencies:
+ - rollup
+ - supports-color
+ dev: true
+
+ /vite/4.1.4_w7akx4qgh2oh637ou2wbfb5bgu:
+ resolution: {integrity: sha512-3knk/HsbSTKEin43zHu7jTwYWv81f8kgAL99G5NWBcA1LKvtvcVAC4JjBH1arBunO9kQka+1oGbrMKOjk4ZrBg==}
+ engines: {node: ^14.18.0 || >=16.0.0}
+ hasBin: true
+ peerDependencies:
+ '@types/node': '>= 14'
+ less: '*'
+ sass: '*'
+ stylus: '*'
+ sugarss: '*'
+ terser: ^5.4.0
+ peerDependenciesMeta:
+ '@types/node':
+ optional: true
+ less:
+ optional: true
+ sass:
+ optional: true
+ stylus:
+ optional: true
+ sugarss:
+ optional: true
+ terser:
+ optional: true
+ dependencies:
+ esbuild: 0.16.17
+ less: 4.1.3
+ postcss: 8.4.21
+ resolve: 1.22.1
+ rollup: 3.17.2
+ sass: 1.58.3
+ stylus: 0.59.0
+ optionalDependencies:
+ fsevents: 2.3.2
+ dev: true
+
+ /wrappy/1.0.2:
+ resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==}
+ dev: true
diff --git a/vite-plugins/svg-spritemap/demo/src/css/spritemap.css b/vite-plugins/svg-spritemap/demo/src/css/spritemap.css
new file mode 100644
index 0000000..ede9967
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/css/spritemap.css
@@ -0,0 +1,15 @@
+/* Generated by vite-plugin-svg-spritemap */
+
+.icon-spiriit {
+ background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' viewBox='0 0 125 41' width='118' height='38'%3e%3cpath d='M0 25.5h6.2c.4 1.9 2.2 3 4.6 3 2.3 0 3.9-.7 3.9-2.5 0-1.2-.7-2-2.5-2.3l-5.8-1c-4-.7-6-2.6-6-6 0-4.7 4.5-7 9.9-7 5.7 0 9.6 2.6 9.9 7h-6c-.3-1.7-1.7-2.6-4-2.6-2 0-3.6.6-3.6 2.1 0 1 .6 1.7 2.3 2l5.8.9c4.1.7 6.2 2.7 6.2 6.2 0 5.2-4.7 7.6-10.2 7.6C5.2 32.9.6 30.4 0 25.5zm48-4.2c0 6.4-3.7 11.7-9.5 11.7-3.4 0-6.6-1.6-7.7-7.3v14.9h-6.6V10h5.6l.7 6.6c1.4-5.6 4.7-7 8.3-7 5.5 0 9.2 5.2 9.2 11.7zm-6.6 0c0-3.4-2.1-6.4-5.3-6.4-3.3 0-5.3 2.8-5.3 6.4s2 6.3 5.3 6.3c3.2 0 5.3-2.9 5.3-6.3zM60 32.6h-6.6V15.2h-3.3V10H60v22.6zM53.1 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3-2.1 0-3.6-1.1-3.6-3.3zm27 6.1v5.2h-2.6c-3.9 0-6 2.1-6 6.4v11h-6.6V10h5.4l.6 7c.9-5.2 3.4-7 6.5-7h2.7zM93 32.6h-6.6V15.2h-3.3V10H93v22.6zM86.1 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3s-3.6-1.1-3.6-3.3zM125 27.1v5.4h-4.7c-4.8 0-7.2-2.5-7.2-7.4v-9.9h-3.3V10h3.3V3.9h6.6v1.3c0 2.3-1.4 4.8-4.9 4.8H125v5.2h-5.2v9c0 1.9 1 2.9 2.8 2.9h2.4z'/%3e%3cpath fill='%233960ff' d='M106.6 32.6H100V15.2h-3.3V10h9.9v22.6zM99.7 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3s-3.6-1.1-3.6-3.3z'/%3e%3c/svg%3e") center no-repeat;
+}
+.icon-vite {
+ background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' class='iconify iconify--file-icons' width='31.88' height='32' viewBox='0 0 510 512'%3e%3cpath fill='currentColor' d='M493.89 58.275 355.178 83.558 379.282 0 186.79 37.718l-2.999 50.64L15.145 58.214C3.53 57.538-3.238 65.879 1.558 77.46l244.056 427.983c5.253 8.575 17.347 8.91 22.65 0L507.575 77.419c5.4-9.676-2.874-21.018-13.685-19.144zm-237 435.435L17.87 74.556l164.993 29.491-7.778 131.365 67.632-15.608-18.858 92.344 51.374-15.608-25.495 123.397c-1.27 8.069 9.241 12.362 14.44.812l150.22-299.792-74.135 14.308 10.086-34.962 140.91-25.684L256.89 493.71z'/%3e%3c/svg%3e") center no-repeat;
+}
+.icon-spiriit-frag {
+ background: url('/__spritemap#icon-spiriit-view') center no-repeat;
+}
+.icon-vite-frag {
+ background: url('/__spritemap#icon-vite-view') center no-repeat;
+}
+
diff --git a/vite-plugins/svg-spritemap/demo/src/css/style.css b/vite-plugins/svg-spritemap/demo/src/css/style.css
new file mode 100644
index 0000000..a8fcae7
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/css/style.css
@@ -0,0 +1,44 @@
+body {
+ background-color: #ddd;
+ margin: 10vw;
+ font-family: Avenir, Helvetica, Arial, sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+@keyframes rainbow {
+ 0% {
+ color: red;
+ }
+ to {
+ color: #ff9500;
+ }
+}
+.icon {
+ margin: 0.5rem;
+}
+.icon-spiriit {
+ width: 118px;
+ height: 38px;
+}
+.icon-vite {
+ width: 31.88px;
+ height: 32px;
+}
+.icon-vite {
+ animation: rainbow infinite 1s alternate;
+}
+h1 {
+ font-size: 2.5rem;
+ margin-bottom: 1rem;
+}
+h2 {
+ margin-top: 0;
+}
+.example {
+ margin-top: 4rem;
+}
+.example__svgs {
+ display: flex;
+ align-items: center;
+ margin: -0.5rem;
+}
diff --git a/vite-plugins/svg-spritemap/demo/src/icons/spiriit.svg b/vite-plugins/svg-spritemap/demo/src/icons/spiriit.svg
new file mode 100644
index 0000000..c3ce55f
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/icons/spiriit.svg
@@ -0,0 +1,5 @@
+
\ No newline at end of file
diff --git a/vite-plugins/svg-spritemap/demo/src/icons/vite.svg b/vite-plugins/svg-spritemap/demo/src/icons/vite.svg
new file mode 100644
index 0000000..c2bb334
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/icons/vite.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/vite-plugins/svg-spritemap/demo/src/less/spritemap.less b/vite-plugins/svg-spritemap/demo/src/less/spritemap.less
new file mode 100644
index 0000000..42a3bfe
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/less/spritemap.less
@@ -0,0 +1,43 @@
+/* Generated by vite-plugin-svg-spritemap */
+
+@sprites-prefix: 'icon-';
+@sprites: {
+ @spiriit: {
+ uri: "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' viewBox='0 0 125 41' width='118' height='38'%3e%3cpath d='M0 25.5h6.2c.4 1.9 2.2 3 4.6 3 2.3 0 3.9-.7 3.9-2.5 0-1.2-.7-2-2.5-2.3l-5.8-1c-4-.7-6-2.6-6-6 0-4.7 4.5-7 9.9-7 5.7 0 9.6 2.6 9.9 7h-6c-.3-1.7-1.7-2.6-4-2.6-2 0-3.6.6-3.6 2.1 0 1 .6 1.7 2.3 2l5.8.9c4.1.7 6.2 2.7 6.2 6.2 0 5.2-4.7 7.6-10.2 7.6C5.2 32.9.6 30.4 0 25.5zm48-4.2c0 6.4-3.7 11.7-9.5 11.7-3.4 0-6.6-1.6-7.7-7.3v14.9h-6.6V10h5.6l.7 6.6c1.4-5.6 4.7-7 8.3-7 5.5 0 9.2 5.2 9.2 11.7zm-6.6 0c0-3.4-2.1-6.4-5.3-6.4-3.3 0-5.3 2.8-5.3 6.4s2 6.3 5.3 6.3c3.2 0 5.3-2.9 5.3-6.3zM60 32.6h-6.6V15.2h-3.3V10H60v22.6zM53.1 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3-2.1 0-3.6-1.1-3.6-3.3zm27 6.1v5.2h-2.6c-3.9 0-6 2.1-6 6.4v11h-6.6V10h5.4l.6 7c.9-5.2 3.4-7 6.5-7h2.7zM93 32.6h-6.6V15.2h-3.3V10H93v22.6zM86.1 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3s-3.6-1.1-3.6-3.3zM125 27.1v5.4h-4.7c-4.8 0-7.2-2.5-7.2-7.4v-9.9h-3.3V10h3.3V3.9h6.6v1.3c0 2.3-1.4 4.8-4.9 4.8H125v5.2h-5.2v9c0 1.9 1 2.9 2.8 2.9h2.4z'/%3e%3cpath fill='%233960ff' d='M106.6 32.6H100V15.2h-3.3V10h9.9v22.6zM99.7 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3s-3.6-1.1-3.6-3.3z'/%3e%3c/svg%3e";
+ width: 118px;
+ height: 38px;
+ };
+ @vite: {
+ uri: "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' class='iconify iconify--file-icons' width='31.88' height='32' viewBox='0 0 510 512'%3e%3cpath fill='currentColor' d='M493.89 58.275 355.178 83.558 379.282 0 186.79 37.718l-2.999 50.64L15.145 58.214C3.53 57.538-3.238 65.879 1.558 77.46l244.056 427.983c5.253 8.575 17.347 8.91 22.65 0L507.575 77.419c5.4-9.676-2.874-21.018-13.685-19.144zm-237 435.435L17.87 74.556l164.993 29.491-7.778 131.365 67.632-15.608-18.858 92.344 51.374-15.608-25.495 123.397c-1.27 8.069 9.241 12.362 14.44.812l150.22-299.792-74.135 14.308 10.086-34.962 140.91-25.684L256.89 493.71z'/%3e%3c/svg%3e";
+ width: 31.88px;
+ height: 32px;
+ };
+}
+
+.sprite(@name, @include-size: false, @type: 'uri') {
+ @sprite: @sprites[ @@name];
+
+ @fragment: if(
+ @type = 'fragment',
+ '/__spritemap#@{sprites-prefix}@{name}-view',
+ false
+ );
+ @uri: if(@type = 'uri', @sprite[uri], false);
+
+ & when (isstring(@fragment)) {
+ background: url(@fragment) center no-repeat;
+ }
+ & when (isstring(@uri)) {
+ background: url(@uri) center no-repeat;
+ }
+
+ & when (isstring(@fragment)), (isstring(@uri)) {
+ & when (@include-size) {
+ background-size: @sprite[width] @sprite[height];
+ }
+ & when (@include-size = 'box') {
+ width: @sprite[width];
+ height: @sprite[height];
+ }
+ }
+}
diff --git a/vite-plugins/svg-spritemap/demo/src/less/style.less b/vite-plugins/svg-spritemap/demo/src/less/style.less
new file mode 100644
index 0000000..cbf8d64
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/less/style.less
@@ -0,0 +1,69 @@
+@import './spritemap.less';
+
+body {
+ background-color: #ddd;
+ margin: 10vw;
+ font-family: Avenir, Helvetica, Arial, sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+//color rainbow gradient animation keyframes
+@keyframes rainbow {
+ from {
+ color: #ff0000;
+ }
+ to {
+ color: #ff9500;
+ }
+}
+
+.icon {
+ margin: 0.5rem;
+
+ each(@sprites, {
+ @name: replace(@key, '^@', '');
+ &-@{name} {
+ width: @value[width];
+ height: @value[height];
+ }
+ });
+
+ &-vite {
+ animation: rainbow infinite 1s alternate;
+ }
+}
+
+h1 {
+ font-size: 2.5rem;
+ margin-bottom: 1rem;
+}
+
+h2 {
+ margin-top: 0;
+}
+
+.example {
+ margin-top: 4rem;
+
+ &__svgs {
+ display: flex;
+ align-items: center;
+ margin: -0.5rem;
+ }
+
+ &--bg-frags .icon-spiriit {
+ .sprite('spiriit', @type: 'fragment');
+ }
+ &--bg-frags .icon-vite {
+ .sprite('vite', @type: 'fragment');
+ }
+
+ &--bg-uri .icon-vite {
+ .sprite('vite');
+ }
+
+ &--bg-uri .icon-spiriit {
+ .sprite('spiriit');
+ }
+}
diff --git a/vite-plugins/svg-spritemap/demo/src/main.ts b/vite-plugins/svg-spritemap/demo/src/main.ts
new file mode 100644
index 0000000..908c74e
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/main.ts
@@ -0,0 +1,6 @@
+import './scss/style.scss'
+// import './stylus/style.styl'
+// import './less/style.less'
+
+// import './css/spritemap.css'
+// import './css/style.css'
diff --git a/vite-plugins/svg-spritemap/demo/src/scss/spritemap.scss b/vite-plugins/svg-spritemap/demo/src/scss/spritemap.scss
new file mode 100644
index 0000000..97815d9
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/scss/spritemap.scss
@@ -0,0 +1,41 @@
+/* Generated by vite-plugin-svg-spritemap */
+
+$sprites-prefix: 'icon-';
+$sprites: (
+ 'spiriit': (
+ uri: "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' width='118' height='38' viewBox='0 0 125 41'%3e%3cpath d='M0 25.5h6.2c.4 1.9 2.2 3 4.6 3 2.3 0 3.9-.7 3.9-2.5 0-1.2-.7-2-2.5-2.3l-5.8-1c-4-.7-6-2.6-6-6 0-4.7 4.5-7 9.9-7 5.7 0 9.6 2.6 9.9 7h-6c-.3-1.7-1.7-2.6-4-2.6-2 0-3.6.6-3.6 2.1 0 1 .6 1.7 2.3 2l5.8.9c4.1.7 6.2 2.7 6.2 6.2 0 5.2-4.7 7.6-10.2 7.6C5.2 32.9.6 30.4 0 25.5zm48-4.2c0 6.4-3.7 11.7-9.5 11.7-3.4 0-6.6-1.6-7.7-7.3v14.9h-6.6V10h5.6l.7 6.6c1.4-5.6 4.7-7 8.3-7 5.5 0 9.2 5.2 9.2 11.7zm-6.6 0c0-3.4-2.1-6.4-5.3-6.4-3.3 0-5.3 2.8-5.3 6.4s2 6.3 5.3 6.3c3.2 0 5.3-2.9 5.3-6.3zM60 32.6h-6.6V15.2h-3.3V10H60v22.6zM53.1 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3-2.1 0-3.6-1.1-3.6-3.3zm27 6.1v5.2h-2.6c-3.9 0-6 2.1-6 6.4v11h-6.6V10h5.4l.6 7c.9-5.2 3.4-7 6.5-7h2.7zM93 32.6h-6.6V15.2h-3.3V10H93v22.6zM86.1 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3s-3.6-1.1-3.6-3.3zM125 27.1v5.4h-4.7c-4.8 0-7.2-2.5-7.2-7.4v-9.9h-3.3V10h3.3V3.9h6.6v1.3c0 2.3-1.4 4.8-4.9 4.8H125v5.2h-5.2v9c0 1.9 1 2.9 2.8 2.9h2.4z'/%3e%3cpath fill='%233960ff' d='M106.6 32.6H100V15.2h-3.3V10h9.9v22.6zM99.7 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3s-3.6-1.1-3.6-3.3z'/%3e%3c/svg%3e",
+ width: 118px,
+ height: 38px
+ ),
+ 'vite': (
+ uri: "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='31.88' height='32' aria-hidden='true' class='iconify iconify--file-icons' viewBox='0 0 510 512'%3e%3cpath fill='currentColor' d='M493.89 58.275 355.178 83.558 379.282 0 186.79 37.718l-2.999 50.64L15.145 58.214C3.53 57.538-3.238 65.879 1.558 77.46l244.056 427.983c5.253 8.575 17.347 8.91 22.65 0L507.575 77.419c5.4-9.676-2.874-21.018-13.685-19.144zm-237 435.435L17.87 74.556l164.993 29.491-7.778 131.365 67.632-15.608-18.858 92.344 51.374-15.608-25.495 123.397c-1.27 8.069 9.241 12.362 14.44.812l150.22-299.792-74.135 14.308 10.086-34.962 140.91-25.684L256.89 493.71z'/%3e%3c/svg%3e",
+ width: 31.88px,
+ height: 32px
+ )
+);
+
+@mixin sprite($name, $include-size: false, $type: 'uri') {
+ $sprite: map-get($sprites, $name);
+ $url: false;
+
+ @if $type == 'fragment' {
+ $url: '/__spritemap##{$sprites-prefix}#{$name}-view';
+ } @else if $type == 'uri' {
+ $url: map-get($sprite, uri);
+ } @else {
+ @error 'sprite(): $type must be either "fragment" or "uri"';
+ }
+
+ @if $url {
+ background: url($url) center no-repeat;
+
+ @if $include-size {
+ @if $include-size == true {
+ background-size: map-get($sprite, width) map-get($sprite, height);
+ } @else if $include-size == 'box' {
+ width: map-get($sprite, width);
+ height: map-get($sprite, height);
+ }
+ }
+ }
+}
diff --git a/vite-plugins/svg-spritemap/demo/src/scss/style.scss b/vite-plugins/svg-spritemap/demo/src/scss/style.scss
new file mode 100644
index 0000000..f777386
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/scss/style.scss
@@ -0,0 +1,63 @@
+@import './spritemap.scss';
+
+body {
+ background-color: #ddd;
+ margin: 10vw;
+ font-family: Avenir, Helvetica, Arial, sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+//color rainbow gradient animation keyframes
+@keyframes rainbow {
+ from {
+ color: #ff0000;
+ }
+ to {
+ color: #ff9500;
+ }
+}
+
+.icon {
+ margin: 0.5rem;
+
+ @each $name, $sprite in $sprites {
+ &-#{$name} {
+ width: map-get($sprite, 'width');
+ height: map-get($sprite, 'height');
+ }
+ }
+
+ &-vite {
+ animation: rainbow infinite 1s alternate;
+ }
+}
+
+h1 {
+ font-size: 2.5rem;
+ margin-bottom: 1rem;
+}
+
+h2 {
+ margin-top: 0;
+}
+
+.example {
+ margin-top: 4rem;
+
+ &__svgs {
+ display: flex;
+ align-items: center;
+ margin: -0.5rem;
+ }
+
+ @each $name, $sprite in $sprites {
+ &--bg-frags .icon-#{$name} {
+ @include sprite($name, $type: 'fragment');
+ }
+
+ &--bg-uri .icon-#{$name} {
+ @include sprite($name);
+ }
+ }
+}
diff --git a/vite-plugins/svg-spritemap/demo/src/stylus/spritemap.styl b/vite-plugins/svg-spritemap/demo/src/stylus/spritemap.styl
new file mode 100644
index 0000000..01e7a6b
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/stylus/spritemap.styl
@@ -0,0 +1,36 @@
+/* Generated by vite-plugin-svg-spritemap */
+
+$sprites-prefix = 'icon-'
+$sprites = {
+ 'spiriit': {
+ uri: "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' viewBox='0 0 125 41' width='118' height='38'%3e%3cpath d='M0 25.5h6.2c.4 1.9 2.2 3 4.6 3 2.3 0 3.9-.7 3.9-2.5 0-1.2-.7-2-2.5-2.3l-5.8-1c-4-.7-6-2.6-6-6 0-4.7 4.5-7 9.9-7 5.7 0 9.6 2.6 9.9 7h-6c-.3-1.7-1.7-2.6-4-2.6-2 0-3.6.6-3.6 2.1 0 1 .6 1.7 2.3 2l5.8.9c4.1.7 6.2 2.7 6.2 6.2 0 5.2-4.7 7.6-10.2 7.6C5.2 32.9.6 30.4 0 25.5zm48-4.2c0 6.4-3.7 11.7-9.5 11.7-3.4 0-6.6-1.6-7.7-7.3v14.9h-6.6V10h5.6l.7 6.6c1.4-5.6 4.7-7 8.3-7 5.5 0 9.2 5.2 9.2 11.7zm-6.6 0c0-3.4-2.1-6.4-5.3-6.4-3.3 0-5.3 2.8-5.3 6.4s2 6.3 5.3 6.3c3.2 0 5.3-2.9 5.3-6.3zM60 32.6h-6.6V15.2h-3.3V10H60v22.6zM53.1 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3-2.1 0-3.6-1.1-3.6-3.3zm27 6.1v5.2h-2.6c-3.9 0-6 2.1-6 6.4v11h-6.6V10h5.4l.6 7c.9-5.2 3.4-7 6.5-7h2.7zM93 32.6h-6.6V15.2h-3.3V10H93v22.6zM86.1 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3s-3.6-1.1-3.6-3.3zM125 27.1v5.4h-4.7c-4.8 0-7.2-2.5-7.2-7.4v-9.9h-3.3V10h3.3V3.9h6.6v1.3c0 2.3-1.4 4.8-4.9 4.8H125v5.2h-5.2v9c0 1.9 1 2.9 2.8 2.9h2.4z'/%3e%3cpath fill='%233960ff' d='M106.6 32.6H100V15.2h-3.3V10h9.9v22.6zM99.7 3.9c0-2.2 1.6-3.4 3.6-3.4s3.6 1.1 3.6 3.4c0 2.2-1.6 3.3-3.6 3.3s-3.6-1.1-3.6-3.3z'/%3e%3c/svg%3e",
+ width: 118px,
+ height: 38px
+ },
+ 'vite': {
+ uri: "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' class='iconify iconify--file-icons' width='31.88' height='32' viewBox='0 0 510 512'%3e%3cpath fill='currentColor' d='M493.89 58.275 355.178 83.558 379.282 0 186.79 37.718l-2.999 50.64L15.145 58.214C3.53 57.538-3.238 65.879 1.558 77.46l244.056 427.983c5.253 8.575 17.347 8.91 22.65 0L507.575 77.419c5.4-9.676-2.874-21.018-13.685-19.144zm-237 435.435L17.87 74.556l164.993 29.491-7.778 131.365 67.632-15.608-18.858 92.344 51.374-15.608-25.495 123.397c-1.27 8.069 9.241 12.362 14.44.812l150.22-299.792-74.135 14.308 10.086-34.962 140.91-25.684L256.89 493.71z'/%3e%3c/svg%3e",
+ width: 31.88px,
+ height: 32px
+ }
+}
+
+sprite($name, $include-size = false, $type = 'uri')
+ $sprite = $sprites[$name]
+ $url = false
+
+ if $type == 'fragment'
+ $url = '/__spritemap#' + $sprites-prefix + $name + '-view'
+ else if $type == 'uri'
+ $url = $sprite[uri]
+ else
+ error('sprite(): $type must be either "fragment" or "uri"')
+
+ if $url
+ background: url($url) center no-repeat
+
+ if $include-size
+ if $include-size == true
+ background-size: $sprite[width] $sprite[height]
+ else if $include-size == 'box'
+ width: $sprite[width]
+ height: $sprite[height]
\ No newline at end of file
diff --git a/vite-plugins/svg-spritemap/demo/src/stylus/style.styl b/vite-plugins/svg-spritemap/demo/src/stylus/style.styl
new file mode 100644
index 0000000..5dd3894
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/stylus/style.styl
@@ -0,0 +1,48 @@
+@import './spritemap.styl'
+
+body
+ background-color #ddd
+ margin 10vw
+ font-family 'Avenir', Helvetica, Arial, sans-serif
+ -webkit-font-smoothing antialiased
+ -moz-osx-font-smoothing grayscale
+
+// color rainbow gradient animation keyframes
+@keyframes rainbow
+ from
+ color #ff0000
+ to
+ color #ff9500
+
+.icon
+ margin 0.5rem
+
+ for $name, $sprite in $sprites
+ &-{$name}
+ width: $sprite[width];
+ height: $sprite[height];
+
+ &-vite
+ animation rainbow infinite 1s alternate
+
+h1
+ font-size 2.5rem
+ margin-bottom 1rem
+
+h2
+ margin-top 0
+
+.example
+ margin-top 4rem
+ &__svgs
+ display flex
+ align-items center
+ margin -0.5rem
+
+ for $name, $sprite in $sprites
+ &--bg-frags .icon-{$name}
+ sprite($name, $type: 'fragment')
+
+ &--bg-uri .icon-{$name}
+ sprite($name)
+
diff --git a/vite-plugins/svg-spritemap/demo/src/vite-env.d.ts b/vite-plugins/svg-spritemap/demo/src/vite-env.d.ts
new file mode 100644
index 0000000..11f02fe
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/src/vite-env.d.ts
@@ -0,0 +1 @@
+///
diff --git a/vite-plugins/svg-spritemap/demo/tsconfig.json b/vite-plugins/svg-spritemap/demo/tsconfig.json
new file mode 100644
index 0000000..fbd0225
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/tsconfig.json
@@ -0,0 +1,20 @@
+{
+ "compilerOptions": {
+ "target": "ESNext",
+ "useDefineForClassFields": true,
+ "module": "ESNext",
+ "lib": ["ESNext", "DOM"],
+ "moduleResolution": "Node",
+ "strict": true,
+ "sourceMap": true,
+ "resolveJsonModule": true,
+ "isolatedModules": true,
+ "esModuleInterop": true,
+ "noEmit": true,
+ "noUnusedLocals": true,
+ "noUnusedParameters": true,
+ "noImplicitReturns": true,
+ "skipLibCheck": true
+ },
+ "include": ["src"]
+}
diff --git a/vite-plugins/svg-spritemap/demo/vite.config.ts b/vite-plugins/svg-spritemap/demo/vite.config.ts
new file mode 100644
index 0000000..4ea91b7
--- /dev/null
+++ b/vite-plugins/svg-spritemap/demo/vite.config.ts
@@ -0,0 +1,16 @@
+import { defineConfig } from 'vite'
+import Inspect from 'vite-plugin-inspect'
+import VitePluginSvgSpritemap from './../src/index'
+
+export default defineConfig({
+ plugins: [
+ VitePluginSvgSpritemap('src/icons/*.svg', {
+ // styles: 'src/css/spritemap.css',
+ styles: 'src/scss/spritemap.scss',
+ // styles: 'src/stylus/spritemap.styl',
+ // styles: 'src/less/spritemap.less',
+ prefix: 'icon-'
+ }),
+ Inspect()
+ ]
+})
diff --git a/vite-plugins/svg-spritemap/dist/index.d.ts b/vite-plugins/svg-spritemap/dist/index.d.ts
new file mode 100644
index 0000000..dd49b4a
--- /dev/null
+++ b/vite-plugins/svg-spritemap/dist/index.d.ts
@@ -0,0 +1,22 @@
+import { Plugin } from 'vite';
+import { Config } from 'svgo';
+
+type Pattern = string[] | string;
+type StylesLang = 'less' | 'scss' | 'styl' | 'css';
+interface UserOptions {
+ svgo?: boolean | Config;
+ output?: {
+ filename: string;
+ use?: boolean;
+ view?: boolean;
+ } | string | boolean;
+ prefix?: string;
+ styles?: {
+ filename: string;
+ lang?: StylesLang;
+ }[] | string | false;
+}
+
+declare function VitePluginSvgSpritemap(iconsPattern: Pattern, options?: UserOptions): Plugin[];
+
+export { VitePluginSvgSpritemap as default };
diff --git a/vite-plugins/svg-spritemap/dist/index.mjs b/vite-plugins/svg-spritemap/dist/index.mjs
new file mode 100644
index 0000000..8a8b11b
--- /dev/null
+++ b/vite-plugins/svg-spritemap/dist/index.mjs
@@ -0,0 +1,586 @@
+// src/plugins/build.ts
+import { join as join2 } from "path";
+
+// src/helpers/filename.ts
+import hash_sum from "hash-sum";
+var getFileName = (fileName, name, content, ext) => {
+ const hash = hash_sum(content);
+ fileName = fileName.replace(/\[hash\]/g, hash);
+ fileName = fileName.replace(/\[ext\]/g, ext);
+ fileName = fileName.replace(/\[extname\]/g, "." + ext);
+ fileName = fileName.replace(/\[name\]/g, name);
+ return fileName;
+};
+
+// src/svgManager.ts
+import { promises as fs } from "fs";
+import { basename } from "path";
+import fg from "fast-glob";
+import { optimize } from "svgo";
+import { DOMParser, DOMImplementation, XMLSerializer } from "@xmldom/xmldom";
+import hash_sum2 from "hash-sum";
+
+// src/styles/styles.ts
+import { fileURLToPath } from "url";
+import { readFile } from "fs";
+import { promisify } from "util";
+import path, { join } from "path";
+var __dirname = path.dirname(fileURLToPath(import.meta.url));
+var Styles = class {
+ _svgs;
+ _options;
+ constructor(svgs, options) {
+ this._svgs = /* @__PURE__ */ new Map();
+ this._options = options;
+ svgs.forEach((svg, name) => {
+ this._svgs.set(name, {
+ width: svg.width,
+ height: svg.height,
+ viewbox: svg.viewBox,
+ source: svg.source
+ });
+ });
+ }
+ createSpriteMap(generator) {
+ let spriteMap = "";
+ let index = 1;
+ this._svgs.forEach((svg, name) => {
+ spriteMap += `${generator(name, svg, index === this._svgs.size)}
+`;
+ index++;
+ });
+ return spriteMap;
+ }
+ async insert(insert, lang) {
+ if (!this._options.styles)
+ return "";
+ const template = await promisify(readFile)(
+ join(__dirname, `/template.${lang}`),
+ "utf8"
+ );
+ const doNotEditThisFile = "/* Generated by svg-spritemap */\n";
+ return doNotEditThisFile + insert + "\n" + template;
+ }
+ // SCSS generation
+ _generate_scss() {
+ let insert = `@use 'sass:map';
+$sprites-prefix: '${this._options.prefix}';
+`;
+ insert += "$sprites: (\n";
+ insert += this.createSpriteMap((name, svg, isLast) => {
+ let sprites = "";
+ sprites = ` '${name}': (`;
+ sprites += `
+ uri: 'data:image/svg+xml;utf8,${svg.source}',`;
+ sprites += `
+ width: ${svg.width}px,`;
+ sprites += `
+ height: ${svg.height}px`;
+ sprites += `
+ ${!isLast ? ")," : ")"}`;
+ return sprites;
+ });
+ insert += ");\n";
+ return insert;
+ }
+ // Styl generation
+ _generate_styl() {
+ let insert = `$sprites-prefix = '${this._options.prefix}'
+`;
+ insert += "$sprites = {\n";
+ insert += this.createSpriteMap((name, svg, isLast) => {
+ let sprites = "";
+ sprites = ` '${name}': {`;
+ sprites += `
+ uri: 'data:image/svg+xml;utf8,${svg.source}',`;
+ sprites += `
+ width: ${svg.width}px,`;
+ sprites += `
+ height: ${svg.height}px`;
+ sprites += `
+ ${!isLast ? "}," : "}"}`;
+ return sprites;
+ });
+ insert += "}\n";
+ return insert;
+ }
+ // Less generation
+ _generate_less() {
+ let insert = `@sprites-prefix: '${this._options.prefix}';
+`;
+ insert += "@sprites: {\n";
+ insert += this.createSpriteMap((name, svg) => {
+ let sprites = "";
+ sprites = ` @${name}: {`;
+ sprites += `
+ uri: 'data:image/svg+xml;utf8,${svg.source}';`;
+ sprites += `
+ width: ${svg.width}px;`;
+ sprites += `
+ height: ${svg.height}px;`;
+ sprites += `
+ };`;
+ return sprites;
+ });
+ insert += "}\n";
+ return insert;
+ }
+ // CSS generation
+ _generate_css() {
+ let insert = this.createSpriteMap((name, svg) => {
+ let sprites = "";
+ sprites = `.${this._options.prefix + name} {`;
+ sprites += `
+ --icon: url('data:image/svg+xml;utf8,${svg.source}');`;
+ sprites += `
+}`;
+ return sprites;
+ });
+ if (this._options.output && this._options.output.view) {
+ insert += this.createSpriteMap((name) => {
+ let sprites = "";
+ sprites = `.${this._options.prefix + name}-frag {`;
+ sprites += `
+ mask-image: url('/__spritemap#${this._options.prefix + name}-view') center no-repeat;`;
+ sprites += `
+}`;
+ return sprites;
+ });
+ }
+ return insert;
+ }
+ generate() {
+ const result = /* @__PURE__ */ new Map();
+ if (!this._options.styles)
+ return result;
+ this._options.styles.forEach((entry) => {
+ let insert;
+ switch (entry.lang) {
+ case "scss":
+ insert = this._generate_scss();
+ break;
+ case "styl":
+ insert = this._generate_styl();
+ break;
+ case "less":
+ insert = this._generate_less();
+ break;
+ case "css":
+ default:
+ insert = this._generate_css();
+ }
+ result.set(entry.filename, this.insert(insert, entry.lang));
+ });
+ return result;
+ }
+};
+
+// src/helpers/calculateY.ts
+var calculateY = (heights = [], gutter = 0) => {
+ return heights.reduce((a, b) => a + b, 0) + heights.length * gutter;
+};
+
+// src/helpers/cleanAttributes.ts
+import svgElementAttributes from "svg-element-attributes" assert { type: "json" };
+var cleanAttributes = (attributes, tag) => {
+ const cleanAttributes2 = ["viewbox", "width", "height", "id", "xmlns"];
+ const validAttributes = [
+ ...svgElementAttributes["*"],
+ ...svgElementAttributes.svg.filter(
+ (attr) => svgElementAttributes[tag].includes(attr)
+ )
+ ];
+ return Array.from(attributes).filter(
+ (attr) => !cleanAttributes2.includes(attr.name.toLocaleLowerCase()) && validAttributes.includes(attr.name)
+ );
+};
+
+// src/svgManager.ts
+var SVGManager = class {
+ _options;
+ _parser;
+ _svgs;
+ _iconsPattern;
+ hash = null;
+ constructor(iconsPattern, options) {
+ this._parser = new DOMParser();
+ this._options = options;
+ this._svgs = /* @__PURE__ */ new Map();
+ this._iconsPattern = iconsPattern;
+ }
+ async update(filePath, loop = false) {
+ const name = basename(filePath, ".svg");
+ if (!name)
+ return false;
+ let svg = await fs.readFile(filePath, "utf8");
+ const document = this._parser.parseFromString(svg, "image/svg+xml");
+ const documentElement = document.documentElement;
+ let viewBox = (documentElement.getAttribute("viewBox") || documentElement.getAttribute("viewbox"))?.split(" ").map((a) => parseFloat(a));
+ const widthAttr = documentElement.getAttribute("width");
+ const heightAttr = documentElement.getAttribute("height");
+ let width = widthAttr ? parseFloat(widthAttr) : void 0;
+ let height = heightAttr ? parseFloat(heightAttr) : void 0;
+ if (viewBox && viewBox.length !== 4 && (!width || !height)) {
+ console.warn(
+ `Sprite '${filePath}' is invalid, it's lacking both a viewBox and width/height attributes.`
+ );
+ return;
+ }
+ if (viewBox && viewBox.length !== 4 && width && height) {
+ viewBox = [0, 0, width, height];
+ }
+ if (!width && viewBox) {
+ width = viewBox[2];
+ }
+ if (!height && viewBox) {
+ height = viewBox[3];
+ }
+ if (!width || !height || !viewBox) {
+ return;
+ }
+ if (typeof this._options.svgo === "object") {
+ const optimizedSvg = optimize(svg, this._options.svgo);
+ if ("data" in optimizedSvg) {
+ svg = optimizedSvg.data;
+ }
+ }
+ this._svgs.set(name, {
+ width,
+ height,
+ viewBox,
+ source: svg
+ });
+ if (!loop) {
+ this.hash = hash_sum2(this.spritemap);
+ await this.createFileStyle();
+ }
+ }
+ async updateAll() {
+ const iconsPath = await fg(this._iconsPattern);
+ for (let index = 0; index < iconsPath.length; index++) {
+ const iconPath = iconsPath[index];
+ await this.update(iconPath, true);
+ }
+ this.hash = hash_sum2(this.spritemap);
+ }
+ get spritemap() {
+ const DOM = new DOMImplementation().createDocument(null, null, null);
+ const Serializer = new XMLSerializer();
+ const spritemap = DOM.createElement("svg");
+ spritemap.setAttribute("xmlns", "http://www.w3.org/2000/svg");
+ if (this._options.output && this._options.output.use) {
+ spritemap.setAttribute("xmlns:xlink", "http://www.w3.org/1999/xlink");
+ }
+ if (!this._svgs.size)
+ return Serializer.serializeToString(spritemap);
+ const sizes = {
+ width: [],
+ height: []
+ };
+ const parser = new DOMParser();
+ this._svgs.forEach((svg, name) => {
+ const symbol = DOM.createElement("symbol");
+ const document = parser.parseFromString(svg.source, "image/svg+xml");
+ const documentElement = document.documentElement;
+ let attributes = cleanAttributes(
+ Array.from(documentElement.attributes),
+ "symbol"
+ );
+ attributes.forEach((attr) => {
+ if (attr.name.toLowerCase().startsWith("xmlns:")) {
+ spritemap.setAttribute(attr.name, attr.value);
+ }
+ });
+ attributes.forEach((attr) => {
+ symbol.setAttribute(attr.name, attr.value);
+ });
+ symbol.setAttribute("id", this._options.prefix + name);
+ symbol.setAttribute("viewBox", svg.viewBox.join(" "));
+ Array.from(documentElement.childNodes).forEach((child) => {
+ symbol.appendChild(child);
+ });
+ spritemap.appendChild(symbol);
+ const y = calculateY(sizes.height);
+ if (this._options.output && this._options.output.use) {
+ const use = DOM.createElement("use");
+ use.setAttribute("xlink:href", `#${this._options.prefix}${name}`);
+ use.setAttribute("width", svg.width.toString());
+ use.setAttribute("height", svg.height.toString());
+ use.setAttribute("y", y.toString());
+ spritemap.appendChild(use);
+ }
+ if (this._options.output && this._options.output.view) {
+ const view = DOM.createElement("view");
+ attributes = cleanAttributes(
+ Array.from(documentElement.attributes),
+ "view"
+ );
+ attributes.forEach((attr) => {
+ view.setAttribute(attr.name, attr.value);
+ });
+ view.setAttribute("id", this._options.prefix + name + "-view");
+ view.setAttribute(
+ "viewBox",
+ `0 ${Math.max(0, y)} ${svg.width} ${svg.height}`
+ );
+ spritemap.appendChild(view);
+ }
+ sizes.width.push(svg.width);
+ sizes.height.push(svg.height);
+ });
+ return Serializer.serializeToString(spritemap);
+ }
+ async createFileStyle() {
+ if (!Array.isArray(this._options.styles))
+ return;
+ const styleGen = new Styles(this._svgs, this._options);
+ const styles = styleGen.generate();
+ const stylesheets = /* @__PURE__ */ new Map();
+ this._options.styles.forEach(async (entry) => {
+ const content = await styles.get(entry.filename);
+ stylesheets.set(entry.filename, content);
+ });
+ return stylesheets;
+ }
+};
+
+// src/plugins/build.ts
+function BuildPlugin(iconsPattern, options) {
+ let config;
+ let fileName;
+ let filePath;
+ let svgManager;
+ let stylesheets;
+ return {
+ name: "vite-plugin-svg-spritemap:build",
+ apply: "build",
+ configResolved(_config) {
+ config = _config;
+ svgManager = new SVGManager(iconsPattern, options);
+ },
+ async buildStart() {
+ await svgManager.updateAll();
+ stylesheets = await svgManager.createFileStyle();
+ if (typeof options.output === "object") {
+ fileName = getFileName(
+ options.output.filename,
+ "spritemap",
+ svgManager.spritemap,
+ "svg"
+ );
+ filePath = join2(config.build.assetsDir, fileName);
+ }
+ },
+ transform(code) {
+ return code.replace(/__spritemap/g, filePath);
+ },
+ generateBundle(_, bundle) {
+ if (typeof options.output === "object") {
+ bundle[fileName] = {
+ needsCodeReference: false,
+ name: fileName,
+ source: svgManager.spritemap,
+ type: "asset",
+ fileName: filePath
+ };
+ }
+ if (stylesheets) {
+ for (const [filename, content] of stylesheets) {
+ bundle[filename] = {
+ needsCodeReference: false,
+ name: filename,
+ source: content,
+ type: "asset",
+ fileName: filename
+ };
+ }
+ }
+ }
+ };
+}
+
+// src/plugins/dev.ts
+import { createFilter } from "vite";
+import fg2 from "fast-glob";
+var event = "vite-plugin-svg-spritemap:update";
+function DevPlugin(iconsPattern, options) {
+ const filterSVG = createFilter(/\.svg$/);
+ const filterCSS = createFilter(/\.(s?css|styl|less)$/);
+ const virtualModuleId = "/@vite-plugin-svg-spritemap/client";
+ let svgManager;
+ return {
+ name: "vite-plugin-svg-spritemap:dev",
+ apply: "serve",
+ configResolved() {
+ svgManager = new SVGManager(iconsPattern, options);
+ },
+ resolveId(id) {
+ if (id === virtualModuleId) {
+ return id;
+ }
+ },
+ load(id) {
+ if (id === virtualModuleId) {
+ return generateHMR();
+ }
+ },
+ async buildStart() {
+ await svgManager.updateAll();
+ const icons = await fg2(iconsPattern);
+ const directories = /* @__PURE__ */ new Set();
+ icons.forEach((icon) => {
+ const directory = icon.split("/").slice(0, -1).join("/");
+ directories.add(directory);
+ });
+ directories.forEach((directory) => this.addWatchFile(directory));
+ },
+ configureServer(server) {
+ server.middlewares.use(async (req, res, next) => {
+ if (req.url?.startsWith("/__spritemap")) {
+ res.statusCode = 200;
+ res.setHeader("Content-Type", "image/svg+xml");
+ res.write(svgManager.spritemap, "utf-8");
+ res.end();
+ } else {
+ next();
+ }
+ });
+ },
+ transformIndexHtml: {
+ enforce: "pre",
+ transform(html) {
+ html = html.replace(
+ /__spritemap-\d*|__spritemap/g,
+ `__spritemap__${svgManager.hash}`
+ );
+ return html.replace(
+ "