Activiti7入门 ---Node的配置、安装、汉化

1.安装：node

安装都是一直下一步知道成功，我这里选择了c盘。

安装后需要系统自动创建文件和目录：

给予权限：(有人需要，这是c盘的保护机制，当然有人不安在c盘就不需要)

安装好后创建2个目录（在你的安装目录）

node_cache:作为缓存路径

node_global:作为全模块所在路径

进入命令案板cmd修改配置默认地址：

npm config set prefix  "C:\Program Files\nodejs\node_global"

npm config set cache  "C:\Program Files\nodejs\node_cache"

nmp  config   ls               查看一下

2.环境变量配置：

系统变量直接添加：位置是你直接安装目录位置

进入path添加

 测试nodejs安装情况

3.修改镜像：

查看nmp镜像：npm config get registry

修改：npm config set registry https://registry.npm.taobao.org/

修改成使用淘宝镜像下载https://registry.npm.taobao.org

4.下载和配置BPMNJS插件

https://bpmn.io/

 

直接解压下载的bpmnjs的，并进入到目录中

进入到properties-panel目录中

在当前目录中打开cmd命令窗口

在上面的地址栏中直接输入cmd,点击enter键后，会自动的进入cmd.

在cmd命令行中执行npm install初始化bpmnjs

【执行命令效果如下】

 【执行成功后，在propertis-panel目录中产生新的目录】

在cmd命令行中执行npm run dev命令

命令成功后会直接通过浏览器弹出bpmnjs插件画图工具

默认的访问地址是：http://localhost:9013/

 

执行后效果如下

点击create a new diagram创建流程图

 BPMNJS插件汉化

 在该目录中创建changelanguage文件夹

将汉化文件放到changelanguage目录中

 

修改默认的配置信息

修改配置主要是修改index.js文件中的默认加载项，将加载项换成是我们刚才拷贝的配置西信息。

【修改默认的配置信息1】

打开properties-panel/app/index.js配置文件

注释以下内容：

import propertiesProviderModule from 'bpmn-js-properties-panel/lib/provider/camunda';

import camundaModdleDescriptor from 'camunda-bpmn-moddle/resources/camunda.json';

替换成：

import propertiesProviderModule from '../changelanguage/properties-panel/provider/activiti';

import activitiModdleDescriptor from '../changelanguage/activiti.json';

import customTranslate from '../changelanguage/customTranslate/customTranslate';

import customControlsModule from '../changelanguage/customControls';

【修改默认配置信息2】

注意以下内容：

var bpmnModeler = new BpmnModeler({

  container: canvas,

  propertiesPanel: {

    parent: '#js-properties-panel'

  },

  additionalModules: [

    propertiesPanelModule,

    propertiesProviderModule

  ],

  moddleExtensions: {

    camunda: camundaModdleDescriptor

  }

});

替换成：

var customTranslateModule = {

    translate: ['value', customTranslate]

};

var bpmnModeler = new BpmnModeler({

    container: canvas,

    propertiesPanel: {

        parent: '#js-properties-panel'

    },

    additionalModules: [

        propertiesPanelModule,

        propertiesProviderModule,

        customControlsModule,

        customTranslateModule

    ],

    moddleExtensions: {

        activiti:activitiModdleDescriptor

    }

});

在properties-panel目录中打开cmd重新执行命令

在cmd窗口中重新执行npm install 和 npm run dev两个命令

成功执行后效果如下

汉化结束