使用maven插件 frontend-maven-plugin (https://github.com/eirslett/frontend-maven-plugin) , 可通过maven直接打包前端.

关于该插件如何配置使用,建议直接去看官方github。在前端模块中,配置pom.xml,配置好后,再使用maven打包项目时,就会将前端后端模块一起全部打包。

若使用Jenkins打包,服务器上无法直接访问官网,或者其他不方便访问的情况, 可以使用国内淘宝镜像,

以下为前端模块的pom.xml的配置,采用了npm打包前端:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  <parent>
    <artifactId>xxxxxx</artifactId>
    <groupId>cn.com.xxx</groupId>
    <version>1.0.0</version>
  </parent>
  <modelVersion>4.0.0</modelVersion>
  <name>前端模块</name>
  <packaging>pom</packaging>

  <artifactId>xxxxx-xxxx</artifactId>

  <properties>
    <build.node.version>v10.5.0</build.node.version>
    <build.npm.version>6.1.0</build.npm.version>
  </properties>

  <build>
    <plugins>
      <plugin>
        <groupId>com.github.eirslett</groupId>
        <artifactId>frontend-maven-plugin</artifactId>
        <version>1.6</version>
        <executions>
          <execution>
            <id>install node and npm</id>
            <goals>
              <goal>install-node-and-npm</goal>
            </goals>
            <phase>generate-resources</phase>
          </execution>
          <execution>
            <id>npm install</id>
            <goals>
              <goal>npm</goal>
            </goals>
            <phase>generate-resources</phase>
            <configuration>
              <arguments>install</arguments>
            </configuration>
          </execution>
          <execution>
            <id>npm run build</id>
            <goals>
              <goal>npm</goal>
            </goals>
            <phase>compile</phase>
            <configuration>
              <arguments>run build</arguments>
            </configuration>
          </execution>
        </executions>
        <configuration>
          <nodeVersion>${build.node.version}</nodeVersion>
          <npmVersion>${build.npm.version}</npmVersion>

          <!-- 若不方便访问官网,可使用国内淘宝镜像-->
          <nodeDownloadRoot>https://npm.taobao.org/mirrors/node/</nodeDownloadRoot>
          <npmDownloadRoot>https://registry.npm.taobao.org/npm/-/</npmDownloadRoot>
        </configuration>
      </plugin>
    </plugins>
  </build>
</project>

 

Logo

权威|前沿|技术|干货|国内首个API全生命周期开发者社区

更多推荐