Riten前端组件库文档

字体图标库在线预览

依赖安装

$ npm install riten-common@latest --save

按需引入

组件按需引入

babel-plugin-import 全局配置

// babel.config.js
module.exports = {
  xxx,
  "plugins": [
    ["import", { "libraryName": "riten-common", "style": true }, "ritem-common"]
  ]
};

vue内使用

// template
<template>
  <full-screen-modal></full-screen-modal>
</template>

// vue
<script>
  import { FullScreenModal } from 'riten-common';
  
  export default {
    components: {
      FullScreenModal
    }
  };
</script>

全局配置文件按需引入

使用方式

// js
import { globalConfig } from 'riten-common';
// console.log('字体库地址：', globalConfig.iconFontUrl);

全局通用方法按需引入

// 需要在main.js内初始化echarts、vuex.Store相关内容
// main.js
import { initCommon } from 'riten-common/lib/common';
import * as echarts from 'echarts/core';
import store from '@/store';

initCommon({
  getInstanceByDom: echarts.getInstanceByDom,
  store
});

使用方式

import { transDictEnum } from 'riten-common/lib/common';
// transDictEnum(type, code);