3.1.1 环境准备（Mac版）

史, 昂 • 2024年5月23日 am9:58 • Oinone 7天入门到精通 • 阅读 1721

工欲善其事，必先利其器。

在进行学习前，大家务必先检查环境。为了降低大家环境准备难度，基础环境全程用安装包无脑模式进行环境配置，安装请从附件下载（提供mac版本安装包，其他操作系统请自行网上下载与安装）。

后端相关

基础环境准备

安装 jdk 1.8 （下载地址见书籍【附件一】）

安装 mysql 8.0.26 （下载地址见书籍【附件一】）

安装mysql，并配置环境变量详见本文中的【环境变量设置】部分
如果mysql启动失败则，在命令行加执行以下命令

Shell
mysqld --initalize-insecure
sudo chmod -R a+rwx /usr/local/mysql/data/

图3-1-1 mysql启动失败需执行的命令

安装 idea社区版（官方下载链接见书籍【附件一】）

根据不同版本下载不同的idea插件 (联系Oinone官方客服)

b. 点击Preferences菜单（快捷键 comand+,）

c. 选择Plugins，进入插件管理页面，接下来按图操作就可以了

图3-1-3 插件管理页面操作示意

e. 选择.zip文件，不需要解压

如果安装了Lombok，请禁用
idea的Java Complier，不然java反射获取方法入参名会变成arg*，导致元数据默认取值出错。或者pom中加入Complier插件，此方法为正解，不然上线也会有问题，我们学习的工程都会选用mvn插件方式

图3-1-4 界面操作示意图

图3-1-5 界面操作示意图

图3-1-6 界面操作示意图

<plugin>
    <groupId>org.apache.maven.plugins</groupId>
    <artifactId>maven-compiler-plugin</artifactId>
    <configuration>
        <compilerArgument>-parameters</compilerArgument>
        <source>${maven.compiler.source}</source>
        <target>${maven.compiler.source}</target>
        <encoding>${project.build.sourceEncoding}</encoding>
    </configuration>
</plugin>

图3-1-7 pom文件代码

安装 dataGrip 最新版本的

过期就去删“ ~/Library/Application\ Support/JetBrains/DataGrip202xxxx”相关的目录，无限期试用，或者安装其他mysql GUI 工具

安装 git 2.2.0（下载地址见书籍【附件一】）

安装 GraphQL的客户端工具 Insomnia

第一次使用可以参考3.2.1【构建第一个Module】一文中在模块启动后如何用该工具验证后端启动成功，更多使用技巧自行百度，Insomnia.Core-2022.4.2.dmg.txt(186.9 MB)（下载地址见书籍【附件一】）,下载文件后修改文件名去除.txt后缀

安装 maven ，并配置环境变量（下载地址见书籍【附件一】）

配置mvn的settings，下载附件settings-open.xml，并重命名为settings.xml,建议直接放在~/.m2/下面。下载地址见oinone开源社区群公告，也可以联系oinone合作伙伴或服务人员
把settings.xml拷贝一份到maven安装目录conf目录下

环境变量设置 vi ~/.bash_profile ，并执行 source ～/.bash_profile

##按实际情况设置
export PATH=$PATH:/usr/local/mysql/bin
export PATH=$PATH:/usr/local/mysql/support-files
export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_0221.jdk/Contents/Home
##替换掉${mavenHome}，为你的实际maven的安装路径
export M2_HOME=${mavenHome}
export PATH=$PATH:$M2_HOME/bin

图3-1-8 环境变量设置

查看主机名

#查看主机名
echo $HOSTNAME

图3-1-9 查看主机名

根据主机名，配置/etc/hosts文件。此步如果没有配置，可能导致mac机器在启动模块时出现dubbo超时,从而导致系统启动巨慢，记得把oinonedeMacBook-Pro.local换成自己的主机名

#oinonedeMacBook-Pro.local 需要换成自己对应的主机名，自己的主机名用 echo $HOSMNAME
127.0.0.1 oinonedeMacBook-Pro.local
::1 oinonedeMacBook-Pro.local

图3-1-10 配置/etc/hosts文件

必备中间件安装脚本（rocketmq、zk、redis）

zk 下载并解压（下载地址见书籍【附件一】）

vi ～/.bash_profile ，追加以下两行，并执行 source ～/.bash_profile

#### 替换掉${basePath}，为你的实际安装路径
export ZOOKEEPER_HOME=${basePath}/apache-zookeeper-3.5.8-bin
export PATH=$PATH:$ZOOKEEPER_HOME/bin

图3-1-11 配置zk环境变量

启动zk

##启动
zkServer.sh start
##停止
zkServer.sh stop

图3-1-12 启停zk

rocketmq （下载地址见书籍【附件一】）

vi ～/.bash_profile ，追加以下两行，并执行 source ～/.bash_profile

#### 替换掉${basePath}，为你的实际安装路径
export ROECET_MQ_HOME=${basePath}/rocketmq-all-4.7.1-bin-release
export PATH=$PATH:$ROECET_MQ_HOME:$ROECET_MQ_HOME/bin

图3-1-13 配置rocketmq环境变量

到bin目录下修改配置文件 runserver.sh 和 runbroker.sh

##注释掉下面一行
##choose_gc_log_directory
##修改java启动所需内存，按自己实际情况改，1g或者512m
JAVA_OPT = "${JAVA_OPT} -server -Xms1g -Xmx1g -Xmn1g -XX:MetaspaceSize=128m -XX:MaxMetaspaceSize=320m"

图3-1-14 bin目录下修改配置文件

启停rocketmq

##启动 nameserver
nohup mqnamesrv &
##启动 broker
nohup mqbroker -n localhost:9876 &

##停止
mqshutdown broker
mqshutdown namesrv

图3-1-15 启停rocketmq

redis

CPU差异	下载地址
默认	redis-5.0.2 下载地址
m系列的cpu 5.x版本不支持	redis-6.2.8 下载地址

表3-1-2 redis下载地址

安装

## 替换掉${redisHome}，为你的实际安装路径
cd ${redisHome}
make
make install PREFIX=${redisHome}

图3-1-16 安装redis

vi ～/.bash_profile ，追加以下两行，并执行 source ～/.bash_profile

##替换掉${redisHome}，为你的实际安装路径
export REDIS_HOME=${redisHome}
export PATH=$PATH:$REDIS_HOME/bin

图3-1-17 配置redis环境变量

启停

##启动
nohup redis-server &
##停止
redis-cli shutdown

图3-1-18 启停redis

晋级中间件安装脚本（canal，es）

canal、es相关的安装与使用，我们放到后续教程中TBD再介绍，它们是非必须的，只有用到异步事件、增强模型等高级特性时，才需要安装。

前端环境准备

安装nvm，便于node的版本管理 http://nvm.sh

curl -o- https://pamirs.oss-cn-hangzhou.aliyuncs.com/pamirs/software/install.sh | bash

图3-1-19 安装nvm

vi ～/.bash_profile ，在文件后面追加以下内容（如图3-1-20所示），并执行 source ～/.bash_profile

export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm

图3-1-20 配置nvm环境变量

用nvm 安装nodejs 版本12.12.0

#看nvm是否安装成功
nvm -v
nvm install 12.12.0

图3-1-21 安装nodejs

vi ～/.bash_profile ，追加以下一行，并执行 source ～/.bash_profile

nvm use 12.12.00

图3-1-22 配置nodejs的环境变量

安装vue-cli

#@vue/cli需要固定，安装成功后可vue -V查看
sudo npm install @vue/cli@4.5.17 -g

图3-1-23 安装vue-cli

配置npm 源

#通过config命令，其他方式自行百度
npm config set registry http://nexus.shushi.pro/repository/kunlun/

图3-1-24 配置npm源

登录npm账号

npm login --registry "http://nexus.shushi.pro/repository/kunlun/"
npm info underscore #（如果上面配置正确这个命令会有字符串response）

图3-1-25 登陆npm源

username、password、email 请见oinone开源社区群公告，也可以联系oinone合作伙伴或服务人员

安装cnpm参考 https://www.npmjs.com/package/cnpm
```
sudo npm install cnpm -g --registry=https://registry.npmmirror.com
```
图3-1-26 安装cnpm

至此所有环境准备好了，我们就正式要进入学习如何使用oinone进行业务开发了

其他说明

解决一些新版mac系统默认是zsh而不是bash，“每次都需source ～/.bash_profile”的问题，vi ~/.zshrc新建.zshrc文件，添加内容为source ～/.bash_profile，保存退出后执行 source ~/.zshrc 命令。或者把.bash_profile的内容复制到.zshrc文件去

Oinone社区作者：史, 昂原创文章，如若转载，请注明出处：https://doc.oinone.top/oio4/9225.html

访问Oinone官网:https://www.oinone.top获取数式Oinone低代码应用平台体验

Oinone 7天从入门到精通

史, 昂数式管理员

0 0

3.1.2 环境准备（windows版）

上一篇 2024年5月23日 am9:57

3.1 环境搭建

下一篇 2024年5月23日

Oinone 7天入门到精通

第5章 Oinone的CDM

史, 昂
2024年5月23日
1.1K000
Oinone 7天入门到精通

工作台

1. 工作台介绍工作台用于呈现集成相关的统计数据，包括：连接器总数：集成资源连接器总数；数据流程总数：定义的数据连接流程总数；任务总执行数：任务总执行数（统计流程实例数量）；总异常任务数：总执行异常的任务数；开放接口数：合计开放接口数量（包含所有状态）。 2. 快捷连接快捷连接是通过快捷筛选所需要链接的集成资源（应用/Oinone平台应用/数据库等），进入【数据流程创建页】，同时展示平台提供的数据流程模版，点击开始连接可使用数据流程模型创建数据流程。开始连接后进入流程创建页：

史, 昂
2024年6月20日
1.3K000
Oinone 7天入门到精通

通知类

1.通知类 1.1 站内信当流程节点需要向用户发送消息或提示时使用站内信这个节点动作。接收人的选取类似审批节点的审批人，通知内容必填，配置完成，保存即可。节点触发后，接收人会在全渠道运营平台-工作台-我的消息中查看到站内信。 1.2 邮件当需要向指定邮箱发送邮件时使用邮件这个节点动作。可直接输入邮箱号，或者按照员工、部门、角色来选择，给接收人登记的邮箱发送邮件，也可以选择模型中的邮箱来发送邮件，若人员重复时只会发送一次邮件。填写主题，填写正文时可以调用当前流程中的一些模型字段的变量。 1.3 短信发送短信需要在工作流-系统设置-短信模板中创建一个短信模板，阿里云模版新增需要一段时间审核，审核通过后就可以正常使用短信节点。短信的接收人与邮件的操作方式一致，之后选择短信模板，并且确定好变量的对应关系即可。

史, 昂
2024年6月20日
1.3K000
Oinone 7天入门到精通

4.2.6 框架之网络请求-拦截器

在整个http的链路中，异常错误对前端来说尤为重要，他作用在很多不同的场景，通用的比如500, 502等; 一个好的软件通常需要在不同的错误场景中做不同的事情。当用户cookie失效时，希望能自动跳转到登录页；当用户权限发生变更时，希望能跳转到一个友好的提示页；那么如何满足这些个性化的诉求呢？接下来让我们一起了解oinone前端网络请求-拦截器。一、入口在src目录下main.ts中可以看到VueOioProvider，这是系统功能提供者的注册入口图4-2-6-1 VueOioProvider import interceptor from './middleware/network-interceptor'; VueOioProvider( { http: { callback: interceptor } }, [] ); 图4-2-6-2 拦截器的申明入口二、middleware 在项目初始化时使用CLI构建初始化前端工程，在src/middleware有拦截器的默认实现：图4-2-6-3 在src/middleware有拦截器的默认实现三、interceptor interceptor在请求返回后触发，interceptor有两个回调函数，error和next error参数 graphQLErrors 处理业务异常 networkError 处理网络异常 next extensions 后端返回扩展参数 const interceptor: RequestHandler = (operation, forward) => { return forward(operation).subscribe({ error: ({ graphQLErrors, networkError }) => { console.log(graphQLErrors, networkError); // 默认实现 => interceptor error }, next: ({ extensions }) => { console.log(extensions); // 默认实现 => interceptor next }, }); }; 图4-2-6-4 后端返回扩展参数四、interceptor error // 定义错误提示等级 const DEFAULT_MESSAGE_LEVEL = ILevel.ERROR; // 错误提示等级对应提示的报错 const MESSAGE_LEVEL_MAP = { [ILevel.ERROR]: [ILevel.ERROR], [ILevel.WARN]: [ILevel.ERROR, ILevel.WARN], [ILevel.INFO]: [ILevel.ERROR, ILevel.WARN, ILevel.INFO], [ILevel.SUCCESS]: [ILevel.ERROR, ILevel.WARN, ILevel.INFO, ILevel.SUCCESS], [ILevel.DEBUG]: [ILevel.ERROR, ILevel.WARN, ILevel.INFO, ILevel.SUCCESS, ILevel.DEBUG] }; // 错误提示通用函数 const notificationMsg = (type: string = 'error', tip: string = '错误', desc: string = '') => { notification[type]({ message: tip, description: desc }); }; // 根据错误等级返回错误提示和类型 const getMsgInfoByLevel = (level: ILevel) => { let notificationType = 'info'; let notificationText = translate('kunlun.common.info'); switch (level) { case ILevel.DEBUG: notificationType = 'info'; notificationText = translate('kunlun.common.debug'); break; case ILevel.INFO: notificationType = 'info'; notificationText = translate('kunlun.common.info'); break;…

史, 昂
2024年5月23日
1.0K000
Oinone 7天入门到精通

3.5.6.4 动作的配置

在3.5.3【Action的类型】一文中，我们介绍Action的几种类型，以及组合动作。通用配置配置项可选值默认值作用 name 动作名称 label 显示名称 icon 图标 type primary defaultlink primary 按钮类型样式，支持主要样式、次要样式以及链接样式。 bizStyle defaultsuccesswarningdangerinfo default 按钮业务样式，支持成功（green）、警告（yellow）、危险（red）、信息（grey）四种样式。 invisible truefalse condition false 展示规则，有简单的true/false显隐，也支持复杂的表达式 disabled truefalse condition 根据动作上下文类型进行自动推断是否禁用自动推断规则：当上下文类型为【单行】时，相当于使用表达式LIST_COUNT(context.activeRecords) != 1当上下文类型为【多行】时，相当于使用表达式LIST_COUNT(context.activeRecords) <= 1当上下文类型为【单行或多行】时，相当于使用表达式LIST_COUNT(context.activeRecords) == 0 disabledTitle string 根据动作上下文类型进行自动推断禁用悬浮提示表3-5-6-12 动作通用配置二次确认配置二次确认框默认支持两种模式，对话框和气泡框；对话框图3-5-6-51 对话框提示气泡框图3-5-6-52 气泡框警告配置项配置项可选值默认值作用备注 confirm string 二次确认提示文字配置后开启二次确认 confirmType POPPER（气泡提示框） MODAL（对话框） POPPER 确认框类型 confirmPosition TM（按钮上方） BM（按钮下方） LM（按钮左侧） RM（按钮右侧） BM 确认框位置气泡框该配置生效 enterText 确定确定按钮文字 cancelText 取消取消按钮文字表3-5-6-13 配置项弹出层动作配置（窗口动作ViewAction）目前平台对于弹出层支持了两种展示形式。弹窗（modal/dialog）和抽屉（drawer）支持两种配置方式【内嵌视图配置】和【引用已有页面】，内嵌视图配置优先于引用已有页面。内嵌视图配置该配置对于弹窗和抽屉均适用。 <action name="窗口动作名称" label="创建"> <view model="模型编码" type="form"> <template slot="form" widget="form"> <field data="id" invisible="true" /> <field data="code" label="编码" widget="Input" /> <field data="name" label="名称" widget="Input" /> </template> <template slot="footer"> <action name="$$internal_DialogCancel" label="关闭" type="default" /> <action name="create" label="确定" /> </template> </view> </action> 图3-5-6-53 内嵌视图配置引用已有页面配置该配置对于弹窗和抽屉均适用。 <view model="模型编码" type="form"> <template slot="form" widget="form"> <field data="id" invisible="true" /> <field data="code" label="编码" widget="Input" /> <field data="name" label="名称" widget="Input" /> </template> <template slot="footer"> <action name="$$internal_DialogCancel" label="关闭" type="default" /> <action name="create" label="确定" /> </template> </view> 图3-5-6-54 引用已有页面示例 <action name="窗口动作名称" label="创建" resViewName="$viewName$" /> 图3-5-6-55 引用已有页面弹窗当窗口动作的路由方式（target）为dialog时，内嵌视图/引用页面将以弹窗形式展示在页面上。配置项配置项可选值默认值作用 title…

史, 昂
2024年5月23日
871000

登录后才能评论