@abi-software/svg-sprite 中文文档教程
svg-sprite 
用于将 svg 图标捆绑到 Vue 构建中的 npm 包。 这与在运行时从服务器加载 svg 相反，这可能导致 svg 最后加载到站点上。
Using svg-sprite
svg-sprite 目前仅适用于包含在 assets/icons 目录中的 svgs
它但是可以分叉以包含任何一组 svg，或者将来我们可以修改 svg-sprite 以获取指向 svg 文件夹的道具输入
Installation
npm install @abi-software/svg-sprite
Setup
要使用 svg-sprite，我们需要在加载任何 svg 之前加载它在组件中。 保证执行此操作的方法是将其加载到 app.py 的第一行
In App.vue
<template>
<div ref="root">
<SvgSpriteColor/>
... Rest of app ...
</div>
</template>
<script>
import {SvgSpriteColor} from '@abi-software/svg-sprite';
export default {
name: "App",
components: {
SvgSpriteColor,
},
...
}
When using an svg (this example is in a component)
<template>
<svg-icon icon="close" @click.native="close"/>
</template>
<script>
/* eslint-disable no-alert, no-console */
import Vue from "vue";
import {SvgIcon} from '@abi-software/svg-sprite';
Vue.component('svg-icon', SvgIcon);
Project setup
npm install
Compiles and hot-reloads for development
npm run serve
Create bundle for npm and publish
npm run build-bundle
npm publish
Lints and fixes files
npm run lint
svg-sprite
An npm package used to bundle svg icons into the a Vue build. This is opposed to loading svg's from the server at runtime, which can end up svgs loading last on a site.
Using svg-sprite
svg-sprite currently only works for svgs included in the assets/icons directory
It can however be forked to inlcude any set of svgs, or in future we can modify svg-sprite to take a prop input that points to an svg folder
Installation
npm install @abi-software/svg-sprite
Setup
To use svg-sprite, we need to load it before any of the svgs will be loaded in components. A method gauranteed to do this is loading it on the first line of app.py
In App.vue
<template>
<div ref="root">
<SvgSpriteColor/>
... Rest of app ...
</div>
</template>
<script>
import {SvgSpriteColor} from '@abi-software/svg-sprite';
export default {
name: "App",
components: {
SvgSpriteColor,
},
...
}
When using an svg (this example is in a component)
<template>
<svg-icon icon="close" @click.native="close"/>
</template>
<script>
/* eslint-disable no-alert, no-console */
import Vue from "vue";
import {SvgIcon} from '@abi-software/svg-sprite';
Vue.component('svg-icon', SvgIcon);
Project setup
npm install
Compiles and hot-reloads for development
npm run serve
Create bundle for npm and publish
npm run build-bundle
npm publish
Lints and fixes files
npm run lint
