Farris Vue is a Vue3 component library based on Farris Design.

English | Simplified Chinese

Farris Design Principles:

• Fast : Farris Vue is a UI kit with fast user experience, Farris Data Grid has high-speed rendering performance when rendering large amounts of data
• REliable : We provide users with reliable usage representation, and make targeted optimizations for various abnormal interaction scenarios
• Responsive : Enhanced responsive design, providing finer responsive interaction inside components
• Intuitive : Use intuitive design to more accurately convey interface interaction to users
• Smart : Intelligent UI to meet the scenarios of developing intelligent applications

1. Get to know Farris

You can visit our official site (https://farris-design.gitee.io/farris-vue) to learn about the Farris UI Vue components.

2. How to run the project locally

2.1 Check the environment

Before running the project locally, please execute the following command to check whether yarn is installed in the environment.

if notyarnFor version information, please refer to Install yarn.

2.2 Get the source code

Execute the following commands to get the project source code and install the dependent components.

npm install lerna -g
git clone https://gitee.com/ubml/farris-vue.git
cd farris-vue
lerna bootstrap

2.3 Running the sample site

Execute the following commands.

cd packages/ui-vue
yarn run docs:dev

Access in your browser:http://localhost:5173/ Check out the example page.

2.4 Using the sample site

You can visit the sample page site:

1. Click “Quick Start” to learn how to install and use Farris Vue.
2. Click “Component” to experience the visual and interactive effects of the component, and view the component API documentation.

3. How to use Farris Vue

3.1 Install @farris/ui-vue

npm install @farris/ui-vue

3.2 Introducing Farris Vue into the application

existmain.tsimported in the file@farris/ui-vue.

import { createApp } from 'vue';
import App from './App.vue';
import Farris from '@farris/ui-vue';

createApp(App).use(Farris).mount('#app');

3.3 Using Farris Vue in the application

existApp.vueUse Farris Vue components in the file.

<template>
    <f-button-edit></f-button-edit>
</template>

4. How to contribute

Restoring your contributions to Farris Vue Here you can contribute to:

• use TypeScript + TSX + SystemJs + Rollup Technical development of Farris Vue components
• Participate in contributing to the Farris theme tool
• Participate in contributing to Farris development documentation

If you decide to contribute to Farris Vue, you can start by reading our contribution guide.

✨ Contributors

Thanks to the following Farris Vue contributors

Open Source License

Apache License 2.0