官方文档地址

配置前端

技术选型

  1. Vue mvvm框架
  2. Es6 ECMAScript 6.0
  3. Ans-ui Analysys-ui
  4. D3 可视化库图表库
  5. Jsplumb 连线插件库
  6. Lodash 高性能的 JavaScript 实用工具库

用命令行模式 cd 进入 dolphinscheduler-ui项目目录并执行 npm install 拉取项目依赖包

如果 npm install 速度非常慢 可以转淘宝镜像命令行输入 npm install -g cnpm --registry=https://registry.npm.taobao.org 运行 cnpm install

编译前端遇到的问题:

Vue packages version mismatch:

  • vue@2.5.17 (/Users/taoshilei/Documents/develop/incubator-dolphinscheduler/dolphinscheduler-ui/node_modules/vue/dist/vue.runtime.common.js)
  • vue-template-compiler@2.6.11 (/Users/taoshilei/Documents/develop/incubator-dolphinscheduler/dolphinscheduler-ui/node_modules/vue-template-compiler/package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

FlinkX 数据同步插件开发

  • 增加节点样式

/Users/taoshilei/Documents/develop/incubator-dolphinscheduler/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.scss

  1. .icos-FLINKX {
  2. background: url("../img/toolbar_FLINKX.png") no-repeat 50% 50%;
  3. }
  • 增加节点篇配置

/Users/taoshilei/Documents/develop/incubator-dolphinscheduler/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/config.js

在 tasktype 里面新增:

  1. FLINKX: {
  2. desc: 'FLINKX',
  3. color: '#E46F13'
  4. }
  • 添加页面

添加 dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/flinkx.vue