ureport2原有的字体库
修改后的效果如下
使用效果图
字体库的版权不便宜,尤其是被某某盯上之后,不是成被告,还得掏money。
下面我们开工, 切入今天的正题。
首先找到ureport2-font,项目增加阿里普惠体。(模仿已有的字体库功能即可)
目前只做了ttf格式的字体库文件,其他的还未研究。
找到ureport-font-context.xml文件,注册新增的字体。
文件相对路径为:ureport2-js\package.json
增加一下内容:
"build": "webpack",
"start": "webpack-dev-server --open"
2.2修改FontSettingDialog.js
文件相对路径为:ureport2-js\src\dialog\FontSettingDialog.js
2.3修改FontFamilyTool.js
文件相对路径为:ureport2-js\src\tools\FontFamilyTool.js
具体内容:
fonts.push("阿里普惠");
至此,源码部分已经修改完成。
接下来,如何编译、使用修改后的项目产品呢?至关重要,别眨眼,这可是千锤百炼出来的,流过不少汗水的。
此处需要强调的是编译的顺序,呵呵,别人不告诉他,偷着乐吧。
回到vscode,打开终端,我们输入以下命令:npm run build
看到它,恭喜你了,离成功近了一步。
那么,编译成功的文件到哪去了呢?
找到webpack.config.min.js,在ureport2-js项目下,里面有编译成功后,输出的路径地址
这也是它的编译顺序排在第一位的原因,ok,前端编译成功了。
到ureport2-console\src\main\resources\ureport-asserts\js目录下,看一眼,新出生的baby。
这个是最终出产品的地方,它是ureport2-parent的子模块。
仔细查看每个模块的POM文件,会发现ureport2-console依赖了
其他的就不一一截图了,自行研究。
好吧,开始编译,一定要加“-Dgpg.skip”,不然郁闷死你。
mvn clean install -Dgpg.skip
这里简单解释一下,用“install”,而不用“package”,是本地观察效果的一个好方法。这样,编译成功后的jar包,会自动安装到本机,编译后的jar包AGV信息如下:
com.bstek.ureport
ureport2-console
2.3.0-SNAPSHOT
查看一下文件目录, 已经存在了。
自行搭建环境中,替换原有的依赖
com.bstek.ureport
ureport2-console
2.3.0-SNAPSHOT
至此,整个过程已经完成,运行起来,看一下修改后的效果吧。
这里是一个开始,本人对前端不是很熟悉,希望大家能贡献自己的优秀作品。