使用SpringBoot整合Angular的時候我們需要使用到一個名爲frontend的maven插件,該插件主要用於java項目集成node的項目進行一體化構建部署,也就是說將node的應用部署到java中,使用java容器運行node項目等功能!!!廢話不說直接導上源碼.
修改項目的pom文件增加以下代碼(或者直接使用該代碼覆蓋原有的pom文件代碼)
<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/maven-v4_0_0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.edurt</groupId>
<artifactId>springboot-angular-integration</artifactId>
<packaging>jar</packaging>
<version>1.0.0</version>
<name>springboot-angular-integration</name>
<url>http://maven.apache.org</url>
<properties>
<system.java.version>1.8</system.java.version>
<!-- node & npm -->
<system.node.version>v8.2.1</system.node.version>
<system.npm.version>5.4.2</system.npm.version>
<dependency.springboot.version>1.5.6.RELEASE</dependency.springboot.version>
<plugin.springboot.version>1.5.9.RELEASE</plugin.springboot.version>
<!-- plugin -->
<plugin.frontend.version>0.0.27</plugin.frontend.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
<version>${dependency.springboot.version}</version>
</dependency>
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>3.8.1</version>
<scope>test</scope>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<version>${plugin.springboot.version}</version>
<configuration>
<fork>true</fork>
</configuration>
</plugin>
<!-- Frontend -->
<plugin>
<groupId>com.github.eirslett</groupId>
<artifactId>frontend-maven-plugin</artifactId>
<version>${plugin.frontend.version}</version>
<configuration>
<!-- angular 源碼根目錄 angular -->
<workingDirectory>src/main/angular</workingDirectory>
<nodeDownloadRoot>https://npm.taobao.org/mirrors/node/</nodeDownloadRoot>
<nodeVersion>${system.node.version}</nodeVersion>
<npmVersion>${system.npm.version}</npmVersion>
<installDirectory>target</installDirectory>
</configuration>
<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>
<configuration>
<arguments>install</arguments>
<installDirectory>target</installDirectory>
</configuration>
</execution>
<execution>
<id>angular cli build</id>
<goals>
<goal>npm</goal>
</goals>
<phase>generate-resources</phase>
<configuration>
<arguments>run build</arguments>
</configuration>
</execution>
</executions>
</plugin>
</plugins>
</build>
</project>
我們在 frontend配置項中配置了部分需要的功能,詳細的配置信息大家可以到 frontend插件官網中進行查看
在pom文件中配置完成後,我們需要修改
.angular-cli.json文件進行設置angular項目的編譯輸出配置
"outDir": "../resources/static",
注意 outDir輸出目錄只能是java的resources目錄下(可以是public/static/或者是其他自定義目錄,自定義目錄的話需要用戶自己去寫自定義目錄配置)
本文分享自微信公衆號 - Spring中文網（china-spring-all）。
如有侵權，請聯繫 [email protected] 刪除。
本文參與“OSC源創計劃”，歡迎正在閱讀的你也加入，一起分享。