Vigour

        _                       
 _   __(_)___ _____  __  _______
| | / / / __ `/ __ \/ / / / ___/
| |/ / / /_/ / /_/ / /_/ / /    
|___/_/\__, /\____/\__,_/_/     
      /____/

Introduction 介绍

Vigour is a UI component libaray based on Vue.js (currently compatible with Vue.js 2.X). It's SSR-friendly. For more information, please refer to the documentation.

Thank you for using Vigour. I will try my best to make it better💪.

Vigour 是一个基于 Vue.js 的 UI 组件库（目前兼容 Vue.js 2.x）。它对服务端渲染（SSR）友好。有关详细信息，请参阅文档。

感谢你使用 Vigour，我会努力完善它的💪。

Quick-start CDN

<!DOCTYPE html>
<html>
<head>
  <link href="https://cdn.jsdelivr.net/npm/vigour/dist/vigour.css" rel="stylesheet">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
</head>
<body>
  <div id="app">
    <vigour-checkbox :value="true">Hello World</vigour-checkbox>
    <vigour-button>Hello World</vigour-button>
  </div>
  <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/vigour/dist/vigour.umd.js"></script>
  <script>
    new Vue({
      el: '#app',
      components:{
        [vigour.checkbox.name]:vigour.checkbox,
        [vigour.button.name]:vigour.button
      }
    })
  </script>
</body>
</html>

CDN Links

Installation 安装

You can install it using NPM:

你可以使用 NPM 安装：

npm install vigour

Or use Yarn to install:

或者使用 Yarn 安装：

yarn add vigour

Usage 使用

Import CSS 引入样式

You can import the CSS style of Vigour in the following ways.

通过以下方式，你可以引入 Vigour 的 CSS 样式。

import 'vigour/dist/vigour.css';

Import All Components 引入所有组件

You can import all the components of Vigour in the following ways.

通过以下方式，你可以引入 Vigour 的所有组件。

import vigour from 'vigour';
Vue.use(vigour);

Import Components on Demand 按需引入组件

You are free to choose the components you need to import in a way similar to the following.

通过类似以下的方式，你可以自由选择需要引入的组件。

import { button } from 'vigour';
Vue.component(button.name, button);

Please note: in the case of on-demand import, if you want to use Notification and Toast, you need to import them in the following ways.

请注意：在按需引入的情况下，如果想使用 Notification 和 Toast，你需要通过以下方式引入它们。

import {notification} from 'vigour';
Vue.use(notification);

import {toast} from 'vigour';
Vue.use(toast);

mokunshao/vigour