https://github.com/mini-ghost/unplugin-svg-loader
https://github.com/mini-ghost/unplugin-svg-loader
Last synced: 5 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/mini-ghost/unplugin-svg-loader
- Owner: Mini-ghost
- License: mit
- Created: 2024-11-05T15:07:57.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-11-05T15:21:43.000Z (over 1 year ago)
- Last Synced: 2025-03-21T21:01:57.648Z (about 1 year ago)
- Language: TypeScript
- Size: 81.1 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# @mini-ghost/unplugin-svg-loader
An unplugin that supports converting SVGs to base64 or extracting paths.
## Installation
```bash
npm i @mini-ghost/unplugin-svg-loader
```
Vite
```ts
// vite.config.ts
import SvgLoader from '@mini-ghost/unplugin-svg-loader/vite'
export default defineConfig({
plugins: [
SvgLoader(),
],
})
```
Example: [`playground/`](./playground/)
Rollup
```ts
// rollup.config.js
import SvgLoader from '@mini-ghost/unplugin-svg-loader/rollup'
export default {
plugins: [
SvgLoader(),
],
}
```
Webpack
```ts
// webpack.config.js
module.exports = {
/* ... */
plugins: [
require('@mini-ghost/unplugin-svg-loader/webpack')()
]
}
```
Vue CLI
```ts
// vue.config.js
module.exports = {
configureWebpack: {
plugins: [
require('@mini-ghost/unplugin-svg-loader/webpack')(),
],
},
}
```
esbuild
```ts
// esbuild.config.js
import { build } from 'esbuild'
import SvgLoader from '@mini-ghost/unplugin-svg-loader/esbuild'
build({
plugins: [SvgLoader()],
})
```
## Usage
### Base64
```ts
import unpluginBase64 from './assets/unplugin.svg?base64'
// 'data:image/svg+xml;base64,...'
```
### Path
```ts
import unpluginPath from './assets/unplugin.svg?path'
// 'M256 0H0V256H256V0Z M72.9779 273.931L73.3264...'
```
`*.svg?path` is very useful for allowing Echarts to use some simple icons.
```ts
import simpleIconPath from './assets/simple.svg?path'
const legend = {
data: [
{ name: 'unplugin', icon: `path://${simpleIconPath}` },
// ...
]
}
```
## License
[MIT](./LICENSE) License © 2024-PRESENT [Alex Liu](https://github.com/Mini-ghost)