Angular运行在java_java-春季启动运行Angular2

我有一个使用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