Nicon
一言不合，先上平台Nicon。在本人服务器上部署，接入github登录与七牛CDN存储，可供个人使用。
Nicon 是一个集图标上传、展示、使用于一身的字体图标管理平台，流程简单，符合日常开发使用习惯，适合企业在内部部署使用。采用 Iconfont 字体图标替换项目中图片图标的使用，以达到缩减体积、风格统一、提高开发效率等目的。若配合设计师使用，设计师可在平台上管理图标，复用图标，减少设计图标耗费的时间，而开发只负责使用设计师维护好的图标库，减少了与设计师的交流成本。
优势
与其他字体图标管理平台相比，它拥有以下优势：
- 使用流程简单，符合日常开发使用习惯，无需在审核管理流程中耗费时间
- 适合企业内部设计师与开发协同使用，保持图标的设计、管理、使用的连贯性
- 部署简单，平台自带注册、登录功能，还有静态资源路由，只需数据库配置就可部署使用
- 支持接入三方登录、资源上传到三方CDN服务器。使用更安全，资源更稳定
- 支持导出资源多样化，符合多种使用场合，更有配套的导出工具nicon-tookit, 方便快捷
使用流程图
协作使用最优解
目前图标从设计到使用的完整流程是基本是: 设计完成->视觉使用->导出给开发->开发处理、使用。显然，图标是设计与开发共同使用的，虽然流程上看着很简单，但是使用频率高了之后小问题也会消耗很多的时间，现如今图标的制作与使用方式都有很多高效率的工具，但都只是单方面的。
对于设计来说，制作图标的工具众多且功能强大，并且设计出来的图标也会直接在这些工具上使用，而图标是复用程度比较高的，所以有效的管理图标可以避免后续花时间重复设计。对于开发来说，图标的使用方式也就那么两三种，只需要有个工具能把图标处理完导出所需类型的资源加入到代码就行，其实不太想去管图标的来龙去脉。
基于以上需求，有必要做出一个可以满足设计与开发共同协作的字体图标管理平台，流程图如下：
在以上的流程中，设计师可以使用平台管理图标方便后续复用，而且不需要在跟开发沟通中耗费时间。 对于开发，并不需要管理图标以及图标的处理方式，只需要适时从平台上更新设计师管理好的图标库生成的资源就行。
功能介绍
该平台的UI是参照iconfont平台实现的，且iconfont平台的图标可以无缝迁移到该平台上。由于个人能力有限，做出的其实就是iconfont的简单版，是一个纯粹的图标管理平台，更适合企业部署在内部使用
1、创建一个图标库
2、上传图标。此阶段为图标草稿阶段，可进行删除、名称修改，最好确保图标名称唯一,点击保存上传之后，才可以加入图标库，如果不保存或者删除，则一直存留为草稿。
3、把图标加入到图标库，会自动保存更新生成新的字体图标库资源。进入到指定图标库后，点击添加图标并选定需要添加的图标，确认之后会生成新的图标文件，完成
4、对不满意的或不合格的图标库可以从图标库中删除
5、可以收藏别人的图标到自己 上传图标 列表中，然后保存成为自己的图标
前端使用方式
图标管理平台提供了三种图标使用方式， font class、svg files、svg sprite三种方式，可导出的资源类型包括css资源文件链接， css资源文件内容，svg文件内容，svg sprite 文件内容，各个工程可以根据自己的使用方式使用脚本导出合适的资源类型。
可以使用配套的工具nicon-toolkit来从平台上获取资源，简单方便、配置灵活。
1、font-class引用
- 配置脚本的资源配置type为cssUrl(外链)或者cssContent(內联)，运行脚本获取资源文件
- 挑选相应图标并获取字体编码，应用于页面
<i class="图标前缀-图标名称"><i/>
2、svg文件使用
- 配置脚本的资源配置type为svg，运行脚本获取svg文件到指定目录
- 经过二次处理或直接使用、比如base64或其他方式
3、svg sprite使用方式
- 配置脚本的资源配置type为svgSprite，运行脚本获取svgSprite 內联到html文件中
- 挑选相应图标并获取类名，应用于页面
<svg class="icon" aria-hidden="true">
<use xlink:href="#图标前缀-图标名称"></use>
</svg>
这样使用的方式稍微麻烦，建议封装成组件传id就好，比如 <icon id="图标前缀-图标名称"></icon>
安装部署
Nicon平台是一个前后端完全分离的项目，前后端都可以单独启动进行开发联调。前端采用Vue生态相关技术，后端使用koa框架，结构及流程都比较简单。根据需求及自己开发习惯进行架构设计，有兴趣的可以看看。Nicon 平台全部的代码都已经开源，并且个人会长期维护，有兴趣的可以加入一起维护。
Nicon平台的具体部署流程已经写在nicon工程中，欢迎大家来一波star，github地址如下：
- nicon 平台nodejs后端服务
- nicon-front 平台前端工程
在开发过程中，我仿照NEJ的cache使用方式基于axios封装了axios-cache 模块，在axios的基础上进行一些增强，更适合日常的组织与使用方式，有兴趣的话可以试试，当然，也欢迎star。
- axios-cache 集中管理异步接口配置的模块
在使用过程中有任何建议或意见，欢迎指教
