@jike-fe/jk-icons
v0.2.8
Published
A set of SVG symbols and font icons for web.
Downloads
2
Readme
JK-ICONS: Find & Copy Playing
Installation
npm install jk-icons
Import
Webpack
Make sure install
url-loader
,file-loader
to resolve iconfonts files or svg files, and install target*-loader
to import icon stylesheets, likestylus-loader
,less-loader
, etc.LESS
@import (css) "path/to/jk-icons/lib/jk-icons.css";
Stylus
@import 'path/to/jk-icons/lib/jk-icons.styl'
Gulp
Move the fonts with Gulp
gulp.task('move-fonts', function () { gulp.src('node_modules/jk-icons/lib/fonts/**/*') .pipe(gulp.dest('path/to/fonts/')) })
Usage
Class Name
Ensure you've import relative stylesheets, and use it within existed icons
<span class="icon icon-{Icon Name}"></span>
SVG Symbols
Inline combined SVG reference into body, then drop a
<use>
element snippet<svg role="img"> <use xlink:href="#{Icon Name}></use> </svg>
Or directly link the external
svg-symbols
file:<svg role="img"> <use xlink:href="{Url}/svg-symbols.svg#{Icon Name}"></use> </svg>
Development
New version of JK-Icons required a valid Sketch
file to generate all resources, please make sure you have rights to create more assets, or you can ask designers to distribute that.
All build process can be found in gulpfile.babel.js
and local development is required for webpack
.