lxui-uni 组件库

开发指南

组件

Header 头部 Tabbar 底部导航栏 List 分页列表 Upload 上传组件 Image 图片 SubmitBtn 提交按钮 OperateBottom
底部安全区域

NPM安装方式

在项目的根目录执行命令：

#安装命令
npm install lxui-ui 或着：pnpm add lxui-ui等

# 更新
npm update lxui-ui

配置关于SASS

# 安装sass
npm install sass -D

# 安装sass-loader
npm i sass-loader@10 -D

引入组件库

项目src目录中的main.ts中，引入组件库。

// main.ts
import lxuiUni from 'lxui-uni'
 
import { createSSRApp } from 'vue'
export function createApp() {
    const app = createApp(App)
    // 添加
    app.use(lxuiUni)
    return {
        app
    }
 
}

引入主题

在项目的根目录uni.scss中引入主题文件。

/* uni.scss */
@import 'lxui-uni/theme.scss'

配置easycom组件模式

项目src目录中的pages.json。如果修改easycom规则不生效，则建议重启项目。

{
    "easycom": {
        "autoscan": true,
        "custom": {
            "lx-(.*)": "lxui-uni/components/lx-$1/lx-$1.vue"
        }
        
    }
 
}

typescript支持

{
    "compilerOptions": {
        ............,
        "types": [
            "@dcloudio/types",
            "uview-plus/types"
        ]
    },
    .........
}