Feui 基于 Vue 的移动端组件库

Question

Feui 是诺诺网前端组(NuoFE)基于WeUI、nuim和Vue(2.x)开发的移动端 UI 组件库，希望借此提高组件价值，减轻工作量，更好的享受生活，享受工作。

特点

简单

基于 Vue 2.0的 Mobile 组件库，撸起代码超简单

方便

支持自定义主题，移植方便，使用起来超方便

可靠

支持40+的自定义组件，高复用，按需加载，99种问题一套框架解决

开始入门

安装

npm i feui --save-dev

引入组件

No.1 : 使用 babel-plugin-import (推荐)

# 安装 babel-plugin-import 插件
npm i babel-plugin-import --save-dev

// 在 .babelrc 或 babel-loader 中添加插件配置
{
  "plugins": [
    ["import", { "libraryName": "feui", "style": true }]
  ]
}

接着你可以在代码中直接引入 feui 组件，插件会自动将代码转化为 No.2 的按需引入形式。

import { Button } from "feui";
export default {
  components: {
    [Button.name]: Button
  }
};

No.2 : 按需引入组件

import { Button } from "feui/lib/button";
import "feui/lib/feui-css/base.css";
import "feui/lib/feui-css/button.css";

No.3 : 导入所有组件

import Vue from "vue";
import feui from "feui";
import "feui/lib/feui-css/index.css";
Vue.use(feui);

CDN

<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/feui/lib/feui-css/index.css">
<!-- 引入组件 -->
<script src="https://unpkg.com/feui/lib/feui.min.js"></script>

vue-cli 脚手架 feui-cli

可以使用vue-cli的定义脚手架来初始化feui：

vue init zoeblow/feui-cli projectName

更多使用方法参见中文文档：https://www.wenjiangs.com/docs/feui

相关链接

• 中文文档：https://www.wenjiangs.com/docs/feui
• https://github.com/zoeblow/feui