开源的无代码平台 NocoBase 开始提供插件管理器和开发文档,请大家帮忙试用

2022-11-03 10:54:44 +08:00
 zhouyanliang

NocoBase 定位为 “极易扩展的无代码开发平台”,经历了 2 年的开发总算在本周发布的 0.8 版本开始提供插件管理器和开发文档。欢迎对这类产品感兴趣的 V 友帮忙试用。

网站: https://www.nocobase.com/
GitHub: https://github.com/nocobase/nocobase
Gitee: https://gitee.com/nocobase/nocobase
文档: https://docs-cn.nocobase.com/

另外,我们已经开始为一些中大型用户提供商业服务,会有越来越多的插件开发需求。有时间、有兴趣想参与开发获得兼职收入的朋友欢迎联系我们。

全新的插件管理器

插件管理器流程

插件管理器界面

目前主要用于本地插件的禁用、激活和删除。内置插件不能删除,插件市场敬请期待。

插件管理器命令行

除了可以在无代码界面激活、禁用插件,也可以通过命令行更完整的管理插件。

# 创建插件
yarn pm create hello
# 注册插件
yarn pm add hello
# 激活插件
yarn pm enable hello
# 禁用插件
yarn pm disable hello
# 删除插件
yarn pm remove hello

备注:插件的发布和升级会在后续的版本里支持。

# 发布插件
yarn pm publish hello
# 升级插件
yarn pm upgrade hello

更多插件示例,查看 packages/samples

插件的变化

插件目录结构

|- /hello
  |- /src
    |- /client      # 插件客户端代码
    |- /server      # 插件服务端代码
  |- client.d.ts
  |- client.js
  |- package.json   # 插件包信息
  |- server.d.ts
  |- server.js

插件名称规范

NocoBase 插件也是 NPM 包,插件名和 NPM 包名的对应规则为 ${PLUGIN_PACKAGE_PREFIX}-${pluginName}

PLUGIN_PACKAGE_PREFIX 为插件包前缀,可以在 .env 里自定义。

例如,有一名为 my-nocobase-app 的项目,新增了 hello 插件,包名为 @my-nocobase-app/plugin-hello

PLUGIN_PACKAGE_PREFIX 配置如下:

PLUGIN_PACKAGE_PREFIX=@nocobase/plugin-,@nocobase/preset-,@my-nocobase-app/plugin-

插件名和包名的对应关系为:

插件的生命周期

v0.8 提供了更完整的插件生命周期方法

import { InstallOptions, Plugin } from '@nocobase/server';

export class HelloPlugin extends Plugin {
  afterAdd() {
    // 插件通过 pm.add 添加之后
  }

  beforeLoad() {
    // 所有插件执行 load 之前,一般用于注册类和事件监听
  }

  async load() {
    // 加载配置
  }

  async install(options?: InstallOptions) {
    // 安装逻辑
  }

  async afterEnable() {
    // 激活之后
  }

  async afterDisable() {
    // 禁用之后
  }

  async remove() {
    // 删除逻辑
  }
}

export default HelloPlugin;

插件的前后端入口

插件的生命周期由服务端控制

import { Application } from '@nocobase/server';

const app = new Application({
  // ...
});

class MyPlugin extends Plugin {
  afterAdd() {}
  beforeLoad() {}
  load() {}
  install() {}
  afterEnable() {}
  afterDisable() {}
  remove() {}
}

app.plugin(MyPlugin, { name: 'my-plugin' });

插件的客户端以 Context.Provider 形式存在(类似于服务端的 Middleware )

import React from 'react';
import { Application } from '@nocobase/client';

const app = new Application({
  apiClient: {
    baseURL: process.env.API_BASE_URL,
  },
  dynamicImport: (name: string) => {
    return import(`../plugins/${name}`);
  },
});

// 访问 /hello 页面时,显示 Hello world!
const HelloProvider = React.memo((props) => {
  const location = useLocation();
  if (location.pathname === '/hello') {
    return <div>Hello world!</div>
  }
  return <>{props.children}</>
});

app.use(HelloProvider);

自定义的业务代码

v0.7 的插件并不完整,自定义的业务代码可能分散在 packages/app/clientpackages/app/server 里,不利于升级、维护。v0.8 推荐以插件包的形式整理,并使用 yarn pm 来管理插件。

提供了更完整的文档

备注:文档还有很多细节待补充,也会根据大家进一步反馈,继续调整。

提供了更多插件示例

2995 次点击
所在节点    分享创造
8 条回复
dddd1919
2022-11-03 11:03:31 +08:00
示例生成的页面表格的后端功能还需要开发么?
cgcs
2022-11-03 11:56:03 +08:00
真不错,搞定 airtable
cgcs
2022-11-03 11:56:32 +08:00
linked field 不能用于公式的输入,是我比较蛋疼的一个事情
nielinjie
2022-11-03 13:46:33 +08:00
捧场捧场。
zhouyanliang
2022-11-04 06:36:10 +08:00
@dddd1919 不需要
iannil
2022-11-04 09:44:55 +08:00
来了来了 撒花
chancat
2022-11-04 14:42:22 +08:00
看看,学习一下。
kssdxw
2022-11-04 19:13:54 +08:00
我们用了快半年了,是真的强

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/892312

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX