SpringBoot前后端分离项目中如何制作前端jar包（类似swaggerUI前端jar包制作方法）

可用于SpringBoot引用的前端UI的Jar包，类似于SwaggerUI包WABJAR介绍SpringBoot中制作webjar包一.maven打包二.项目中使用三.查看效果

可用于SpringBoot引用的前端UI的Jar包，类似于SwaggerUI包

有的时候我们会碰到一些场景，需要制作前端UI包，用于灵活部署，或者方便个性化改造。那么我们可以使用webjars的方式打包，maven直接引入jar包，即可集成，类似于SwaggerUI包。

WABJAR介绍

WebJars是将这些通用的Web前端资源打包成Java的Jar包，然后借助Maven工具对其管理，保证这些Web资源版本唯一性，升级也比较容易。关于webjars资源，有一个专门的网站http://www.webjars.org/，我们可以到这个网站上找到自己需要的资源，在自己的工程中添加入maven依赖，即可直接使用这些资源了。 webjars官网上可以找到已有的webjars https://www.webjars.org/

SpringBoot中制作webjar包

在3.X的Servlet规范中，WEB-INF/lib下的jar包中的META-INF/resources将自动作为静态资源供程序来访问。SpringBoot已完成自动装配。

一.maven打包

首先把自己的静态资源放到src\main\resource下面：

然后修改pom.xml文件，删除多余的配置，通过maven打包resource文件夹下代码。

<?xml version="1.0"?> <project xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd" xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> <modelVersion>4.0.0</modelVersion> <groupId>com.test</groupId> <artifactId>api-ui</artifactId> <name>api-ui</name> <version>0.0.1-SNAPSHOT</version> <description>api引擎web功能。包含api在线设计的UI界面。</description> <properties> <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> <destDir>${project.build.outputDirectory}/META-INF/resources</destDir> </properties> <build> <!-- 类似于webjar方式打包成静态资源包 --> <resources> <resource> <directory>${project.basedir}/src/main/resources</directory> <targetPath>${destDir}</targetPath> </resource> </resources> </build> </project>

打包后的效果如下：

二.项目中使用

自己的springbootweb项目中使用时添加依赖即可，当然还需要相关的web依赖。

<dependency> <groupId>com.test</groupId> <artifactId>api-ui</artifactId> <version>0.0.1-SNAPSHOT</version> </dependency>

三.查看效果

启动boot项目访问 http://localhost/api-ui.html ，就像直接访问自己的项目静态文件地址一样.当然为了减少文件名称冲突，最好在打包的ui包里加上几个文件夹路径，比如webjars之类的。省的和原有项目的静态文件冲突。