V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
zhouyanliang
V2EX  ›  分享创造

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

  •  
  •   zhouyanliang · 2022-11-03 10:54:44 +08:00 · 2520 次点击
    这是一个创建于 480 天前的主题,其中的信息可能已经有所发展或是发生改变。

    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/

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

    block

    全新的插件管理器

    插件管理器流程

    plugin

    插件管理器界面

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

    plugin2

    插件管理器命令行

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

    # 创建插件
    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-
    

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

    • users 插件包名为 @nocobase/plugin-users
    • nocobase 插件包名为 @nocobase/preset-nocobase
    • hello 插件包名为 @my-nocobase-app/plugin-hello

    插件的生命周期

    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 来管理插件。

    提供了更完整的文档

    • 欢迎:快速了解 NocoBase
    • 用户使用手册:进一步了解 NocoBase 平台提供的核心功能
    • 插件开发教程:进阶深入插件开发
    • API 参考:插件开发过程中,查阅各 API 用法
    • 客户端组件库(正在准备中):提供 NocoBase 各组件的示例和用法

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

    提供了更多插件示例

    8 条回复    2022-11-04 19:13:54 +08:00
    dddd1919
        1
    dddd1919  
       2022-11-03 11:03:31 +08:00
    示例生成的页面表格的后端功能还需要开发么?
    cgcs
        2
    cgcs  
       2022-11-03 11:56:03 +08:00
    真不错,搞定 airtable
    cgcs
        3
    cgcs  
       2022-11-03 11:56:32 +08:00
    linked field 不能用于公式的输入,是我比较蛋疼的一个事情
    nielinjie
        4
    nielinjie  
       2022-11-03 13:46:33 +08:00   ❤️ 1
    捧场捧场。
    zhouyanliang
        5
    zhouyanliang  
    OP
       2022-11-04 06:36:10 +08:00 via Android
    @dddd1919 不需要
    iannil
        6
    iannil  
       2022-11-04 09:44:55 +08:00
    来了来了 撒花
    chancat
        7
    chancat  
       2022-11-04 14:42:22 +08:00 via Android
    看看,学习一下。
    kssdxw
        8
    kssdxw  
       2022-11-04 19:13:54 +08:00
    我们用了快半年了,是真的强
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   2411 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 15:50 · PVG 23:50 · LAX 07:50 · JFK 10:50
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.