yu.js.ui

基于原生JavaScript组件库

Usage no npm install needed!

<script type="module">
  import yuJsUi from 'https://cdn.skypack.dev/yu.js.ui';
</script>

README

yu.js.ui

yu.js.ui 基于原生JavaScript组件库

使用文档 | 完整示例 | 官方网站

yu.js.ui的优势

  • yu.js.ui 使用了yu.css.ui的样式，使用原生js，直接操作DOM，实现了element-ui, ant-design中的大部分组件
  • yu.js.ui 源码是使用ES6编写的，基本为原生JavaScript，未使用任何第三方库。
  • yu.js.ui 借鉴了一些Vue, React的表达方式和使用方式
  • yu.js.ui 可以实现自定义组件
  • yu.js.ui 同时支持ES5和ES6使用
  • yu.js.ui 源码总共只有几十KB，虽然打包后会大一些
  • yu.js.ui 基类核心代码只有30多行，仅让组件拥有状态，至于每个组件状态对应的DOM操作由组件自己实现

什么时候适合引入yu.js.ui

当你的项目未引入Vue, React, Angular，基本是直接操作DOM，此时你又怀念Vue, React的一些操作和用法，想念element-ui, ant-design 等库带来的便捷时，你就可以引入yu.js.ui

一、npm 引入 推荐

npm install --save yu.js.ui

使用,将yu挂载到window.yu

import yu from "yu.js.ui"

yu.install()

二、使用CDN引入

目前可以通过 unpkg.com/yu.js.ui 获取到最新版本的资源，在页面上引入 js 文件即可开始使用。

<script src="https://unpkg.com/yu.js.ui/dist/index.js"></script>

此js文件已经执行yu.install()，无需再重复执行

三、引入样式

yu.js.ui使用的是yu.css.ui的样式，所以样式引入，请参考 yu.css.ui 如果你想快速体验，并引入样式，只要添加

<link rel="stylesheet" href="https://unpkg.com/yu.css.ui/dist/index.css">