agilebpm脑图_设计开发平台前端框架介绍 | AgileBPM 敏捷工作流开发平台—开源免费-基于 Activiti 工作流引擎、Flowable...

目前设计平台前端是独立部署的,引入了 Angular 和 Vue,您可以根据自己技术强项 选择使用 Angular 或者 Vue,他们引入的成本都很小。

比如我们团队使用 Angular 很多年了,依赖注入,模块化概念很舒服,使用它构建复杂应用非常得心应手,自然会倾向 Angular

但是更多人喜欢使用更高效更简单的 Vue,他的入门成本很低,性能很好 当然也是很不错的选择,我们也推荐您使用 Vue 。

前端引入模块

我们使用 webpack 把某类引入打包成了一个文件,这样可以减少 js 体积以及请求数量,加快加载速度,而且模块化可以减少对全局作用域的污染。

目前前端含一下模块:

base 模块 :平台公共必备组件的引入,一般为jQuery组件,均以注册到 jQuery 的形式暴露给全局作用域

ng-edit 模块 : Angular js 相关的 公共服务,并将 angular 暴露到全局作用域

vue-edit 模块 :Vue js 相关的 公共组件,将 Vue 暴露给全局作用域

grid 模块 :用于列表页面 公共js的引入,只有BootstrapTable.js 一个引用

列表页面默认不需要 双向绑定组件,列表数据中监控数据变化存在页面性能问题,所以默认列表页面不提供 Angular引入,如有需要可以单独引入

前端开发介绍

配置后端服务地址配置 assets/app-conf.js

webpack 打包配置: /agilebpm-ui/webpack.config.js

webpack 相关打包的引入文件配置 /agilebpm-ui/assets/entry

开发

AgileBPM 仅对基础模块进行了打包,如果您这边不是对基础模块进行的修改则无需打包安装的

初次开发需要执行 node命令安装依赖 npm install

开发时执行 npm run source 监控前端文件变化并实时打包,您可以开启npm run source 模式下去调试开发基础模块的源码

完成开发后执行打包命令 npm run build ,最后提交打包后的文件

注意:angular js 不支持混淆模式的打包,所以默认打包命令屏蔽了相关引入,具体请查看 /agilebpm-ui/webpack.config.js 引入描述,设置非混淆时才能打包相关引入。

前端分离开发时可以使用 npm run dev 使用 webpack server 单独跑前端项目(如果是agilebpm-ui 以 jar 形式时运行前端,则可以忽略该方式)

JS 引入情况

前端 目录├─assets资源目录

│ ├─cssCSS

│ ├─entrywebpage打包入口

│ │ ├─common公共JS打包引入

│ │ └─home

│ ├─fonts字体图标

│ ├─img图标LOG等资源

│ ├─jsJS

│ │ ├─common公共js

│ │ ├─platform平台模块js

│ │ │ └─util

│ │ └─plugins

│ └─vueVUE表单相关js引入

├─bpm流程模块HTML源代码

├─bpmplugin流程插件HTML源代码

├─buildwebpack 打包后的压缩文件

│ ├─commonwebpack 打包的公共JS引入

│ ├─font

│ ├─form

│ ├─home

│ └─images

├─bus业务对象模块HTML源代码

├─demo案例模块HTML源代码

├─flow-editor流程设计器源代码

├─form表单模块HTML源代码

├─org组织模块HTML源代码

└─sys系统模块HTML源代码

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/560843.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

(贪心)删数问题

题目&#xff1a; 键盘输入一个高精度的正整数&#xff4e;&#xff08;<240位&#xff09;&#xff0c; 去掉任意&#xff53;个数字后剩下的数字按原左右次序将组成一个新的正整数。 编程对给定的&#xff4e;和&#xff53;&#xff0c;寻找一种方案&#xff0c;使得剩…

alsa的动态库安装在哪里_Linux链接库一(动态库,静态库,库放在什么路径下)...

http://www.cppblog.com/wolf/articles/74928.htmlhttp://www.cppblog.com/wolf/articles/77828.htmlhttp://www.jb51.net/article/34990.htm大部分内容抄的以上文章的。1 库的分类根据链接时期的不同&#xff0c;库又有静态库和动态库之分。静态库是在链接阶段被链接的(好像是…

递推:约瑟夫环

约瑟夫环&#xff08;约瑟夫问题&#xff09; 是一个数学的应用问题&#xff1a;已知n个人&#xff08;以编号1&#xff0c;2&#xff0c;3…n分别表示&#xff09;围坐在一张圆桌周围。从编号为k的人开始报数&#xff0c;数到m的那个人出列&#xff1b;他的下一个人又从1开始…

pic pwm 占空比可调 源码_PIC16F914输出可调占空比PWM波形程序

#includetypedef unsigned int uint;typedef unsigned char uchar;#define KEY0_DOWN() (RB40)//定义按键按下__CONFIG(0X1014);//内部时钟uchar KEY0_FLAG0;/*************************///OSC SET; INTER 4MHZ PERIOD 1US/*************************/void OSC_INIT(){OSCCON0…

(递推)三角形分割平面问题

题目描述 用N个三角形最多可以把平面分成几个区域? 输入 输入数据的第一行是一个正整数T(1<T<10000),表示测试数据的数量.然后是T组测试数据,每组测试数据只包含一个正整数N(1<N<10000). 输出 对于每组测试数据,请输出题目中要求的结果. 样例输入 2 1 …

floquet端口必须沿z轴设置_Ansys Workbench 振动给料机偏心轴的模态分析

张哲维 于 岩 刘传峰 公 业振动给料机主要由振动机架、弹簧、振动器电机等组成。振动器是由两个特定位置的偏心轴以齿轮相啮合组成&#xff0c;装配时必须使两齿轮按标记相啮合&#xff0c;通过电机驱动&#xff0c;使两偏心轴旋转&#xff0c;从而产生巨大合成的直线激振力&am…

(贪心)活动选择

问题描述 有一个需要使用每个资源的n个活动组成的集合S {a1&#xff0c;a2&#xff0c;&#xff0c;an },资源每次只能由一个活动使用。每个活动a都有一个开始时间和结束时间&#xff0c;且 0< s < f < 。一旦被选择后&#xff0c;活动a就占据半开时间区间[s,f]。如果…

vue如何配置服务器端跨域_vue项目里如何配置本地代理实现跨域请求

1、在如图项目配置的index.js文件夹下添加以下一段话微信图片_20180912182204.pngproxyTable: {/rest: {target: http://192.168.20.223:8080, pathRewrite: {"^/rest": /rest },// secure: false, changeOrigin: true }},代码中的rest只是在请求接口时本人自定义的一…

cp命令显示进度条_干货|| Linux常用命令大全

Linux常用命令目录操作命令ls命令名称&#xff1a;ls命令英文原意&#xff1a;list命令所在路径&#xff1a;/bin/ls执行权限&#xff1a;所有用户功能描述&#xff1a;显示目录文件ls (显示当前目录下文件)ls 目录名 (显示指定目录下文件)ls -l (长格式显示目录文件)ls -l 文件…

(贪心)整数区间

题目 找到一个含元素个数最少的集合,使得对于每一个区间,都至少有一个整数属于该集合&#xff0c;输出该集合的元素个数。 输入 首行包括区间的数目n,1≤n≤10000,接下来的n行,每行包括两个整数a,b,被一空格隔开,0≤a≤b≤10000,它们是某一个区间的开始值和结束值。 输出 …

二进制法生成1-n的子集

先上代码&#xff1a; #include<iostream> using namespace std;void print_subset(int n, int s){for(int i0;i<n;i)if(s&(1<<i)){printf("%d",i);} printf("\n");} int main(){int n;cin>>n; for(int i0;i<(1<<n);i)…

centos 等保三级_等保测评三级整改-身份鉴别

a)应对登录的用户进行身份标识和鉴别&#xff0c;身份标识具有唯一性&#xff0c;身份鉴别信息具有复杂度要求并定期更换&#xff1b;在linux&#xff0c;设置密码复杂度的方法有几个1. 一个是在/etc/login.defs文件&#xff0c;里面几个选项PASS_MAX_DAYS 90 #密码最长过期天数…

k3 审核流程图_K3操作流程图

目录一、流程图符号说明&#xff1a; ______________________________________________ 3二、K/3系统基础操作流程图&#xff1a; ___________________________________ 4A、“中间层—账套管理”_________________________________________________ 4 B&#xff1a;系统基础资…

c#中connect函数_Flink算子使用方法及实例演示:union和connect

Flink的Transformation转换主要包括四种&#xff1a;单数据流基本转换、基于Key的分组转换、多数据流转换和数据重分布转换。读者可以使用Flink Scala Shell或者Intellij Idea来进行练习&#xff1a;Flink Scala Shell&#xff1a;使用交互式编程环境学习和调试FlinkFlink 01 |…

(分治)取余运算

题目描述 输入b&#xff0c;p&#xff0c;k的值&#xff0c;求b^p mod k的值。其中b&#xff0c;p&#xff0c;k*k为长整型数。 输入 输入b&#xff0c;p&#xff0c;k的值。 输出 求b^p mod k的值。 样例输入 2 10 9 样例输出 2^10 mod 97 余数公式&#xff1a; a*…

java移动端接口测试_借助Charles来测试移动端-下篇

本篇是借助Charles来测试移动端的下半篇。(上篇任意门点我)上次说到可以借助Charles来抓移动端的网络请求&#xff0c;接下来&#xff0c;我们来看一下怎么通过Charles来模拟返回&#xff0c;还是以网页版豆瓣为例。先找到网页版豆瓣的请求通过上面这句话&#xff0c;我们知道&…

仓库货位卡标识牌_【干货】仓库布局,你想学啊,我教你啊!

下面两张仓库布局图&#xff0c;哪一个更加好&#xff1f;那再来看下这两张对比图&#xff0c;哪个布局更加好&#xff1f;为什么要关注仓库布局&#xff1f;在仓库操作中&#xff0c;什么操作最耗时&#xff1f;有一个大概的统计&#xff0c;假如说总工作量是100%的话&#xf…

(回溯Uva524)素数环

题目 输入正整数&#xff0c;把整数1&#xff0c;2&#xff0c;3&#xff0c;&#xff0c;n组成一个环&#xff0c;使得相邻两个整数之和均为素数。输出时从整数1开始逆时针排列。同一个环应恰好输出一次。n<16 样例输入 6 样例输出 1 4 3 2 5 6 1 6 5 2 3 4 分析与解…

openglshader实现虚拟场景_虚拟演播室设计原则

所谓虚拟演播室&#xff0c;就是利用计算机产生出虚拟的三维背景和道具&#xff0c;然后通过视频合成系统将演员与其进行合成&#xff0c;生成全三维、真人与虚拟布景和道具融合的效果。虚拟演播室系统只需要在一个蓝色背景下进行演播&#xff0c;不需要真正去搭建演播室布景&a…

(回溯 UVa129)困难的串

题目:分析与解答&#xff1a; 题目: 如果一个字符串包含两个相邻的重复子串&#xff0c;则称它是“容易的串”&#xff0c;其他串成为“困难的串”。例如:BB,ABCDACABCAB,ABCDABCD都是容易的&#xff0c;而D、DC、ABDAB、CBABCBA 都是困难的。 输入正整数n和L&#xff0c;…