私は角度のフロントエンドで春ブーツ・アプリケーションを構築したいです。プロジェクトを構築する春ブート初期化子を使用して、コメントを追加し、私はそうRestController
するために/greet/world
。それから私は私の中で、新たな角度-プロジェクトを作成しsrc/main
実行することにより、-folder ng new ui
(含むrouting
及びcss
)。
私は更新されoutput-Path
、私の中でangular.json
次のように:
"outputPath": "../resources/static"
それから私は、追加Http-Get
の私-要求内にapp.component.ts
して構築する次のコマンドを実行しましたjar
:
ng build --prod
私はsrc /メイン/ UIからcd %back_to_project_root%
mvn clean package
cd target
java -jar Jar-file
開いたときhttp://localhost:8080
、私はいつもの角度-スタートアップ・ページと次のコンソール・ログを参照してください。
私のバックエンドにフロントエンドを含むとき、私は間違って何をしたのですか?実行しているng serve
私からsrc/main/ui
完全に正常に動作します。
マイapp.component.ts
:
import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
title = 'ui';
constructor(private http: HttpClient) { }
ngOnInit() {
this.http.get('http://localhost:8080/greet/world').subscribe( (data) => {
console.log('DATA', data);
this.title = 'try';
});
}
}
マイHelloWorldController.javaのパッケージcom.demo.example.controller。
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
@RequestMapping("/hello")
public class HelloWorldController {
@RequestMapping(value="/world")
public String greetWorld() {
return "Hello world";
}
}
私のpom.xml
<?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">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.1.1.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.hud</groupId>
<artifactId>HelloWorld</artifactId>
<version>0.0.1-SNAPSHOT</version>
<packaging>jar</packaging>
<name>HelloWorld</name>
<description></description>
<properties>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-rest</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.springframework.restdocs</groupId>
<artifactId>spring-restdocs-mockmvc</artifactId>
<scope>test</scope>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
<plugin>
<groupId>org.codehaus.mojo</groupId>
<artifactId>exec-maven-plugin</artifactId>
<executions>
<execution>
<phase>test</phase>
<goals>
<goal>exec</goal>
</goals>
</execution>
</executions>
<configuration>
<executable>ng</executable>
<workingDirectory>src/main/ui</workingDirectory>
<argument>
<argument>build</argument>
</argument>
</configuration>
</plugin>
</plugins>
</build>
</project>
編集1
私はに私の出力パスを変更../../../target/static
して、走ったmvn clean package
とng build --prod
後で。
しかし、これは本当にこれらが提供されていないので、一日を保存していないjar
実行しているとき-file mvn clean package
が、それは一瞬のための質問を解決しました。
編集2
私が提案のように私のコードを再加工し、以下のものを得ました:
pom.xml
<?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">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.1.1.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.test</groupId>
<artifactId>HelloWorld</artifactId>
<version>0.0.1-SNAPSHOT</version>
<packaging>jar</packaging>
<name>HelloWorld</name>
<description></description>
<properties>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-rest</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.springframework.restdocs</groupId>
<artifactId>spring-restdocs-mockmvc</artifactId>
<scope>test</scope>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
<plugin>
<groupId>com.github.eirslett</groupId>
<artifactId>frontend-maven-plugin</artifactId>
<version>1.6</version>
<executions>
<execution>
<id>npm install</id>
<goals>
<goal>npm</goal>
</goals>
<configuration>
<arguments>install</arguments>
</configuration>
</execution>
<execution>
<id>npm build</id>
<goals>
<goal>npm</goal>
</goals>
<configuration>
<arguments>run build</arguments>
</configuration>
</execution>
</executions>
<configuration>
<nodeVersion>v10.14.1</nodeVersion>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-resources-plugin</artifactId>
<executions>
<execution>
<id>default-copy-resources</id>
<phase>process-resources</phase>
<goals>
<goal>copy-resources</goal>
</goals>
<configuration>
<overwrite>true</overwrite>
<!-- It must match the resulting war-file name -->
<outputDirectory>${project.build.directory}/${project.artifactId}-${project.version}/</outputDirectory>
<resources>
<resource>
<directory>${project.basedir}/dist</directory>
</resource>
</resources>
</configuration>
</execution>
</executions>
</plugin>
</plugins>
</build>
</project>
実行時にはmvn clean install
、プロジェクトのルートから、私は次のエラーを取得します:
[ERROR] Failed to execute goal com.github.eirslett:frontend-maven-plugin:1.6:npm (npm install) on project HelloWorld: Failed to run task: 'npm install' failed.
java.io.IOException: Cannot run program "c:\Dev\wsp_test\HelloWorld\node\node.exe" (in directory "c:\Dev\wsp_test\HelloWorld"): CreateProcess error=2, System cannot find the file (<- this is translated, so might be different wording)-> [Help 1]
あなたの開き
angular.json
設定、ファイルを"outputPath"
します../../../dist
あなたには
package.json
、あなたが持っている必要がありbuild
、スクリプト、例:
"scripts": {
[..]
"build": "ng build --prod",
}
- 編集して
pom.xml
追加するfrontend-maven-plugin
のMavenでビルド角度にプラグインを、そしてmaven-resources-plugin
(それらをコピーするためにどのようにMavenベースのJava戦争のプロジェクト内のセットアップの角度4へ):
<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>
<configuration>
<arguments>install</arguments>
</configuration>
</execution>
<execution>
<id>npm build</id>
<goals>
<goal>npm</goal>
</goals>
<configuration>
<arguments>run build</arguments>
</configuration>
</execution>
<configuration>
<nodeVersion>v8.9.0</nodeVersion>
</configuration>
</executions>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-resources-plugin</artifactId>
<version>2.4.2</version>
<executions>
<execution>
<id>default-copy-resources</id>
<phase>process-resources</phase>
<goals>
<goal>copy-resources</goal>
</goals>
<configuration>
<overwrite>true</overwrite>
<!-- It must match the resulting war-file name -->
<outputDirectory>${project.build.directory}/${project.artifactId}-${project.version}/</outputDirectory>
<resources>
<resource>
<directory>${project.basedir}/dist</directory>
</resource>
</resources>
</configuration>
</execution>
</executions>
</plugin>
</plugins>
</build>