一、启动步骤

1. 拉取代码

git clone https://github.com/youseries/urule.git

拉取后目录

image.png

• 打包后的前端页面是在urule-console/src/main/resources目录中
• 前端页面源码在urule-console-js目录中
• 在urule-springboot/src/main/resources/context.xml中配置数据库参数

2. idea中引入项目

1) 使用idea打开整个项目文件夹

2) 配置Project structure

配置JDK为1.8

image.png

将四个模块引入(urule-console, urule-core, urule-parent, urule-springboot)

image.png

3. 配置数据库

在urule-springboot/src/main/resources/context.xml中配置数据库参数, 如果报时区错误可以配置下时区参数serverTimezone=UTC, 运行时如果数据库为空, 会自动创建表

image.png

4. 直接运行即可

运行后, 访问 http://localhost:8080/urule即可进入页面

image.png

二、前端二次开发方法

1. 配置webpack

比原来的配置添加了TerserWebpackPlugin插件和CleanWebpackPlugin插件, 用来解决代码压缩和打包时清除原文件

const path=require('path');
const TerserWebpackPlugin = require('terser-webpack-plugin');
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
const { ProgressPlugin } = require('webpack');
module.exports={
    mode:'production',
    entry: {
        frame:'./src/frame/index.jsx',
        variableEditor:'./src/variable/index.jsx',
        constantEditor:'./src/constant/index.jsx',
        parameterEditor:'./src/parameter/index.jsx',
        actionEditor:'./src/action/index.jsx',
        packageEditor:'./src/package/index.jsx',
        flowDesigner:'./src/flow/index.jsx',
        ruleSetEditor:'./src/editor/urule/index.jsx',
        decisionTableEditor:'./src/editor/decisiontable/index.jsx',
        scriptDecisionTableEditor:'./src/editor/scriptdecisiontable/index.jsx',
        decisionTreeEditor:'./src/editor/decisiontree/index.jsx',
        clientConfigEditor:'./src/client/index.jsx',
        ulEditor:'./src/editor/ul/index.jsx',
        scoreCardTable:'./src/scorecard/index.jsx',
        permissionConfigEditor:'./src/permission/index.jsx'
    },
    output:{
        path:path.resolve('../urule-console/src/main/resources/urule-asserts/js'),
        filename: '[name].bundle.js'
    },
    optimization: {
        minimize: true,
        minimizer: [
            new CleanWebpackPlugin(),
            new TerserWebpackPlugin ({
                extractComments: false
            })
        ]
    },
    plugins: [
        new ProgressPlugin({
            activeModules: true,         // 默认false，显示活动模块计数和一个活动模块正在进行消息。
            entries: true,                 // 默认true，显示正在进行的条目计数消息。
            modules: false,              // 默认true，显示正在进行的模块计数消息。
            modulesCount: 5000,          // 默认5000，开始时的最小模块数。PS:modules启用属性时生效。
            profile: false,                // 默认false，告诉ProgressPlugin为进度步骤收集配置文件数据。
            dependencies: false,         // 默认true，显示正在进行的依赖项计数消息。
            dependenciesCount: 10000,    // 默认10000，开始时的最小依赖项计数。PS:dependencies启用属性时生效。
        })
    ],
    module:{
        rules:[
            {
                test: /\.(jsx|js)?$/,
                exclude: /node_modules/,
                loader: "babel-loader",
                options:{
                    "presets": [
                        "react","env"
                    ]
                }
            },
            {
                test:/\.css$/,
                use: [{ loader: 'style-loader' }, { loader: 'css-loader' }]
            },
            {
                test: /\.(eot|woff|woff2|ttf|svg|png|jpg)$/,
                use: [
                    {
                        loader: 'url-loader',
                        options: {
                            limit: 10000000
                        }
                    }
                ]
            }
        ]
    }
};

2. 配置package.json

可对页面进行打包, 热更新的开发模式还没搞好

"scripts": {
    "build": "webpack --config webpack.config.min.js"
}