Skip to content

YanxinTang/fluent-ui

Repository files navigation

Fluent UI

GitHub Workflow Status (master) Coverage Status npm (scoped) GitHub

Introduction

A Fluent UI toolkit implements by Vue 2.

Installation

yarn add @tyx1703/fluent-ui
npm i @tyx1703/fluent-ui

Usage

Fully import

import FluentUI from '@tyx1703/fluent-ui';

Vue.use(FluentUI);

On demand

  1. install babel-plugin-theme-component
yarn add -D babel-plugin-theme-component
  1. edit .babelrc (babel.config.js)
// import style from scss

{
  "plugins": [
    [
      "theme-component", 
      {
        "libraryName": "@tyx1703/fluent-ui",
        "style": true,
        "styleDirectory": "src/themes/fluent-ui",
        "styleExtension": "scss",
      }
    ]
  ]
}

// import style from css
{
  "plugins": [
    [
      "theme-component", 
      {
        "libraryName": "@tyx1703/fluent-ui",
        "style": true,
        "styleDirectory": "dist/fluent-ui",
      }
    ]
  ]
}
  1. import components in main.js
// main.js
import Vue from 'vue';
import { Button } from '@tyx1703/fluent-ui';

Vue.use(Button);

You can check this file to get more components.

Contribution

If you are interested in this project, welcome to fork and pull request.

License

MIT License

Copyright (c) 2018-present, tyx1703