我有一个使用REST作为Spring Boot Application和一个客户端作为Angular2的应用程序.
之前,我是分别通过启动SpringBootApplication主要方法(它开始侦听端口8080)和Angular2来启动应用程序-Spring Boot的-从命令行npm start(通常在3000端口启动)运行.
现在,我希望Maven使用一个命令运行两个应用程序.
>角4.0.0
> Spring Boot 1.5.4.发布
我一直在尝试申请answer和this tutorial.
但在第一种情况下,仅启动Angular应用程序,第二种-仅启动REST.
我的package.json:
"scripts": {
"build": "tsc -p src/",
"build:watch": "tsc -p src/ -w",
"serve": "lite-server -c=bs-config.json",
"prestart": "npm run build",
"start": "concurrently \"npm run build:watch\" \"npm run serve --proxy-config proxy-config.json\" ",
"lint": "tslint ./src/**/*.ts -t verbose"
},
"license": "ISC",
"dependencies": {
"@angular/animations": "^4.2.4",
"@angular/common": "~4.0.0",
"@angular/compiler": "~4.0.0",
"@angular/core": "~4.0.0",
"@angular/forms": "~4.0.0",
"@angular/http": "~4.0.0",
"@angular/material": "^2.0.0-beta.7",
"@angular/platform-browser": "~4.0.0",
"@angular/platform-browser-dynamic": "~4.0.0",
"@angular/router": "~4.0.0",
"@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.26",
"angular-in-memory-web-api": "~0.3.0",
"angular2-modal": "^3.0.1",
"bootstrap": "^3.3.6",
"core-js": "^2.4.1",
"hammerjs": "^2.0.8",
"jsplumb": "^2.4.3",
"ng2-bs3-modal": "^0.10.4",
"ng2-popup": "^0.4.0",
"rxjs": "5.0.1",
"systemjs": "0.19.40",
"zone.js": "^0.8.4"
},
"devDependencies": {
"concurrently": "^3.2.0",
"lite-server": "^2.2.2",
"typescript": "~2.1.0",
"canonical-path": "0.0.2",
"tslint": "^3.15.1",
"rimraf": "^2.5.4",
"@types/node": "^6.0.46"
},
"repository": {}
解决方法:
我同意sinedsem的观点,对于开发人员,我会将两个应用程序分开.至于管理生产版本,我做的事情会稍有不同.我不喜欢在构建过程中涉及任何手动步骤的想法,例如将构建文件从angular复制到spring boot应用程序的源.
取而代之的是,我将使用分别作为独立模块构建的angular ui和spring boot应用程序在maven下管理整个构建.该构建将完全由maven进行管理,使用frontend-maven-plugin将angular ui构建委派给npm / gulp等.可以将其作为依赖项添加到构建输出的spring boot应用中,也可以复制到目标目录中.弹簧启动模块.
父POM
创建一个新的父POM
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">
4.0.0
org.example.angularboot
boot-ui-parent
0.1
pom
spring-boot-app
angular-ui-resources
Angular UI模块
使用frontend-maven-plugin构建Angular UI模块,以执行任何npm / bower / gulp等构建步骤.将构建的输出设置为target / classs / static或将构建的角度资源复制到target / classs / static
例如以下插件将安装node / npm并运行所需的npm bower和gulp步骤以构建angular应用程序.
com.github.eirslett
frontend-maven-plugin
1.3
install node and npm
install-node-and-npm
generate-resources
v6.10.3
4.6.1
npm install
npm
generate-resources
bower install
bower
install --allow-root
gulp build
gulp
generate-resources
Spring Boop App模块
这应该与当前的spring boot模块相同,只是增加了新的parent和angular-ui模块的依赖关系.
由于将角度UI的构建版本打包在target / classes / static下,并且angular-ui jar位于Spring Boot的类路径中,因此将Angular UI打包到spring boot应用程序中.
或者,您可以运行copy resources maven插件,将资源从angular-ui模块的build目录复制到spring-boot模块的build目录.虽然我不太喜欢将资源文件从一个模块复制到另一个模块
例如
maven-resources-plugin
3.0.1
copy-angular-components
process-classes
copy-resources
${project.build.outputDirectory}/static
${basedir}/../angular-ui/target/classes/static
false
标签:angular,maven,spring,java
来源: https://codeday.me/bug/20191025/1932120.html