@rasir/symbol-iconfont

Introduction

Automatically converts SVG files into ionfont.js and outputs a React Icon component, which is not compatible with IE. Usage npm i @rasir/symbol-iconfont -g

API

   --id <id>             Parent element ID, defaults to the same as the file name to prevent creating duplicate parent elements for the same iconfont file.

   -c,--clazz            Output React class component, defaults to outputting a React functional component.

   -d,--deep             Whether to recursively traverse directories.

   -p,--pure             Whether to remove colors.

    -r                    Indicates whether to restore all svgs.  --pick/--remove/--add are deactivated.

   --restore <restore>    Only restore specified svg files without modifying the original iconfont.js file. The names of the symbols to be restored are indicated, separated by commas.When --restore has a value, --pick/--remove/--add are deactivated.



   --add <add>            Add svg to the iconfont file specified by output. Directories where the svg to be added are located should be specified. If there are duplicate named svgs, numbers will be added in their names.

   --remove <remove>      Specify symbols to remove from the iconfont file. Names of the symbols to be removed should be indicated and separated by commas.

   --pick <pick>           Specify symbols in the iconfont file that need restoration into svg files and also removal from files. Names of these symbols should also be indicated and separated by commas.

   --html                Generate template HTML according to the specified iconfont.js

   -i,--input <input>    Input path, default is the current directory.

   -o,--output <output>  Output path, default is /dist.

   -h,--help             API description.

   -v,--version          Version information.

Usage example

bsicon --id=bdpicon -d -p -i=/asserts -o=/dist

Output results

dist
    Icon
        index.tsx --- React component TSX file
        index.less --- React component stylesheet LESS file
    iconfont.js --- Icon font file containing all SVG information
    index.html --- Icon font example that allows you to click the icon to copy the type

1.0.3

If you want to remove colors from some SVGs and keep colors from others, you can create a new "pure" directory within the directory specified by -i, place the SVGs you want to remove colors into it, and do not use -p in the command line but add -d instead.
If -p is added to the command line, the output will have all colors removed.
If -d is not added to the command line, the program will not read the "pure" directory.
e.g: --id=bdpicon -d -i=/asserts -o=/dist

1.1.1

1. Restore SVG Convert iconfont.js back to svg files bsion -r -i=/asserts/iconfont.js -o=/dist You can also specify the name of the svg to be restored bsion -i=/asserts/iconfont.js -o=/dist --restore=a,b,c Restoring SVG will not modify the original iconfont.js nor will it generate a new iconfont.js

2. Add svg to iconfont.js bsion -i=/asserts/iconfont.js -o=/dist --add=/dir bsion -i=/asserts/iconfont.js -o=/dist --add=/dir/new.svg

3. Remove specific svg from iconfont.js bsion -i=/asserts/iconfont.js -o=/dist --remove=a,b,c

4. Retrieve specific svg from iconfont.js bsion -i=/asserts/iconfont.js -o=/dist --pick=a,b,c

5. Generate html template based on iconfont.js bsion -i=/asserts/iconfont.js -o=/dist --html