ag68 / nicon-toolkit

a tookit for fetch icon resource from nicon

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool


nicon-toolkit is a util that fetches iconfont resource from nicon platform. Its main purpose is to reduce complication for usage when fetching iconfont resource from nicon platform

Install

npm install -g nicon-toolkit

Getting Start

Using a Configuration

Most projects will need a more complex setup, so nicon-toolkit supports a configuration file. This is more convenient and efficient that having to type in a lot of commands in the terminal.

your project

your-project
    | - bin
    | - src
    | - package.json
  + | - icon.config.js
    | - index.html

icon.config.js

module.exports = [{
    "repoId": "37",
    "type": "cssUrl",
    "output": "./index.html",
    "tag": 'regex',
    "apiUrl": 'http://icon.bolin.site/api/repo/{repoId}/resource'
}]

add a placeholder to your output file

<link  name="cssUrl" href="replaceContent">

Run command in terminal under your-project root path

nicon-toolkit

Finish

get below

<link  name="cssUrl" href="//nos.netease.com/icon/dd7a8e7d8f00054c45e50c4e6c3778e8.css">

Configuration

Type repoId output [tag] [placeholder] [apiUrl]
cssUrl Number file path tag.cssUrl palceholder.cssUrl apiUrl.default
cssContent Number file path tag.cssContent palceholder.cssContent apiUrl.default
cssFile Number file path - - apiUrl.default
svg Number folder path - - apiUrl.default
svgSpriteContent Number file path tag.svgSpriteContent palceholder. svgSpriteContent apiUrl.default

default config

apiUrl

default

http://icon.bolin.site/api/repo/{repoId}/resource

tag

cssUrl

/<link(\s+rel="stylesheet")*\s+name="cssUrl"\s+href="(.*?)">/gm

cssContent

/<style(\s+type="text\/css")*\s+name="cssContent">((.|\t|\n)*?)<\/style>/gm

svgSpriteContent

/<div(\s+type="svgSprite")*\s+name="svgSpriteContent">((.|\t|\n)*?)<\/div>/gm

placeholder

cssUrl

<link  name="cssUrl" href="replaceContent">

cssContent

<style  name="cssContent">replaceContent</style>

svgSpriteContent

<div name="svgSpriteContent">replaceContent</div>

Nofice

if you want to use your tag property, You must follow the rules below

fileContent.replace(tag, function ($0, $1, $2) {
    return $0.replace($2, content);
});

About

a tookit for fetch icon resource from nicon


Languages

Language:JavaScript 100.0%