前言
gulu-demo-dawson 是一个完整的前端 UI 组件库，可轻松在您的项目中使用。该组件库是由组件化思维驱动的，使得组件更为通用化，同时也更加容易去维护和升级。
本篇文章将会详细讲解如何使用 npm 包 gulu-demo-dawson。
安装
你可以使用 npm 或者 yarn 安装 gulu-demo-dawson。
使用 npm:
npm install gulu-demo-dawson --save
使用 yarn:
yarn add gulu-demo-dawson
引用组件
你可以全局引用所有的组件，也可以按需引用每个组件。
全局引用：
-- -------------------- ---- ------- ------ --- ---- ----- ------ --- ---- ----------- ------ -------------- ---- ------------------ ----------------------- --- ----- --- ------- ------- - -- ------ --
按需引用：
import { Button } from 'gulu-demo-dawson'
export default {
components: {
'g-button': Button
}
}使用样式
你需要引入 gulu-demo-dawson 的样式才能看到效果。
import gulu-demo-dawson 的样式：
import 'gulu-demo-dawson/dist/index.css'
组件示例
Button
-- -------------------- ---- -------
----------
-----
--------- ---------------------- -----------------
------
-----------
--------
------ - ------ - ---- ------------------
------ ------- -
----------- -
----------- ------
-
-
---------Icon
-- -------------------- ---- -------
----------
-----
------- ---------------------
------
-----------
--------
------ - ---- - ---- ------------------
------ ------- -
----------- -
--------- ----
-
-
---------Grid
-- -------------------- ---- -------
----------
-----
-------
------ -----------------------
------ -----------------------
------ -----------------------
------ -----------------------
--------
------
-----------
--------
------ - ---- --- - ---- ------------------
------ ------- -
----------- -
-------- ----
-------- ---
-
-
---------结语
gulu-demo-dawson 是一个非常优秀的前端 UI 组件库，使用非常方便且支持按需加载。希望本篇文章对你有所启发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60065f7c238a385564ab6a51