LowCodeEngine：阿里开源的企业级低代码开发平台，提供预制的 UI 组件和模板，覆盖完整的研发周期

最新推荐文章于 2025-03-30 11:30:02 发布

蚝油菜花

最新推荐文章于 2025-03-30 11:30:02 发布

阅读量757

点赞数 18

分类专栏：每日 AI 项目与应用实例文章标签：开源低代码人工智能阿里云

本文链接：https://blog.csdn.net/qq_19841021/article/details/144797655

版权

每日 AI 项目与应用实例专栏收录该内容

659 篇文章

订阅专栏

❤️ 如果你也关注 AI 的发展现状，且对 AI 应用开发非常感兴趣，我会每日跟你分享最新的 AI 资讯和开源应用，也会不定期分享自己的想法和开源实例，欢迎关注我哦！

🥦 微信公众号｜搜一搜：蚝油菜花 🥦

原文链接：https://mp.weixin.qq.com/s/t15Ar0KuDIVO1PiInt1c3w

🚀 快速阅读

功能：提供拖拽、配置等简单操作，快速构建复杂系统页面。
技术：基于 TypeScript 开发，支持组件化、数据绑定和模板引擎。
生态：提供丰富的物料体系、设置器和插件，支持全链路研发周期。

正文（附运行示例）

LowCodeEngine 是什么

公众号: 蚝油菜花 - lowcode-engine

LowCodeEngine 是阿里巴巴开源的低代码开发框架，旨在通过拖拽、配置等简单操作，帮助开发者快速构建复杂的系统页面。该框架以强大的定制能力、优雅的开发体验、丰富的 API 和插件支持而著称，能够满足各种复杂的业务场景需求。

LowCodeEngine 基于 TypeScript 开发，支持物料体系、设置器、插件等生态元素的全链路研发周期，极大地提升了开发效率和质量。其设计理念是最小内核、最强生态，能够支撑多种类型的低代码平台。

LowCodeEngine 的主要功能

内核引擎：提炼自企业级低代码平台，奉行最小内核、最强生态的设计理念。
高质量生态元素：提供开箱即用的生态元素，包括物料体系、设置器、插件等。
工具链支持：完善的工具链，支持生态元素的全链路研发周期。
扩展能力：强大的扩展能力，已支撑 100+ 个各种类型的低代码平台。
TypeScript 开发：基于 TypeScript 开发，提供完整的类型定义文件。

LowCodeEngine 的技术原理

组件化开发：基于组件化开发，组合不同的组件构建页面和应用。
数据绑定：支持数据绑定，实现 UI 组件与数据模型的同步和动态更新。
模板引擎：用模板引擎渲染页面，提高开发效率和页面性能。
物料体系：提供预制的 UI 组件和模板，加速开发流程。
TypeScript 支持：基于 TypeScript 的类型系统提高代码质量和开发体验。

如何运行 LowCodeEngine

首先，安装 LowCodeEngine 的 npm 包：

npm install @alilc/lowcode-engine --save-dev

然后，通过 CDN 引入 LowCodeEngine 的核心文件：

<script src="https://alifd.alicdn.com/npm/@alilc/lowcode-engine@1.0.18/dist/js/engine-core.js"></script>
<script src="https://alifd.alicdn.com/npm/@alilc/lowcode-react-simulator-renderer@1.0.18/dist/js/react-simulator-renderer.js"></script>

接下来，初始化 LowCodeEngine：

import { init, skeleton } from '@alilc/lowcode-engine';

skeleton.add({
  area: 'topArea',
  type: 'Widget',
  name: 'logo',
  content: YourFantasticLogo,
  contentProps: {
    logo: 'https://img.alicdn.com/tfs/TB1_SocGkT2gK0jSZFkXXcIQFXa-66-66.png',
    href: '/',
  },
  props: {
    align: 'left',
    width: 100,
  },
});

init(document.getElementById('lce'));