使用SpringBoot、Range6和Maven构建Web应用程序

点击上方“公众号”，关注动脑学院！

结合SpringBoot和角使用Maven可能是一项具有挑战性的任务。在这篇文章中，我们将使用SpringBoot和角6创建一个简单的Web应用程序，并将它们打包到一个WAR文件中。

创建Maven项目

首先，创建一个包含两个模块的Maven项目：一个用于后端，另一个用于前端。

在我的例子中，有两个Maven模块-教程服务器(后端)和教程-网页(前端)-是从父模块继承的，导师-家长。

项目结构如下：

亲本POM的结构如下：

现在，将POM配置为教程服务器详情如下：

注意，我们已经为web模块添加了依赖项。教程-网页和SprintBoot依赖项.稍后我们将回到后端POM配置。

让我们看一下教程-网页模块POM

我们将在稍后再讨论这个配置。

创建SpringBoot应用程序

在我的示例项目中，我手动创建了SpringBoot应用程序。您可以使用Spring创建弹簧起动器也是

SpringBoot应用程序的包结构如下：

让我们看看家庭控制器类，因为这将返回一个视图

注意，HOME方法接受一个模型并返回“index.html”，这是视图。

使用角CLI创建Angular 6项目

如果角-cli尚未安装，请使用终端上的以下命令安装它。

npm install -g @angular/cli 

使用角-cli生成一个角6项目。教程-web/src/main/web目录。导航到目录教程-web/src/main在终端中运行以下命令：

ng new -skip-git -directory web np-app 

在上面的命令中，我们跳过了git存储库，因为我们没有从根目录运行该命令。我们已经将输出目录指定为web并且给出了应用程序的名称np-app.

将以下配置添加到tutorial-web/pom.xml通过Maven构建一个Range6项目。

注意，我们正在使用前端插件来构建第六角计划。

我们已经在配置部分中指定了节点和NPM版本以及工作目录。在第一个执行部分，我们告诉Maven安装NPM和节点。这将安装在项目中，这给我们带来了许多好处。

在下一个执行部分中，我们告诉Maven运行npm install“和”npm run build“命令。默认情况下，角-cli将在src\main\web\dist目录中写入文件。

配置后端Maven POM以包含角6资源

编辑教程-server/头.xml，并添加以下插件部分：

在这里，我们将从教程-web/src/main/web/dist/np-app到教程-服务器/目标/类/资源目录。这将确保包括t应用程序/Web-INF/类/资源当WAR文件生成时。

运行应用程序

跑mvn clean install 来自项目根目录。这将在教程-服务器/目标目录。可以将其部署到Tomcat服务器并查看应用程序。

若要使用Maven运行SpringBoot应用程序，请从教程服务器目录。

mvn spring-boot:run 

一旦应用程序启动，我们应该能够看到欢迎页面使用http://localhost:8090/.

完整的源代码可以在GitHub储存库.

来源：

https://dzone.com/articles/building-a-web-app-using-spring-boot-angular-6-and

看到这里，你想不想踩在过来人的肩膀上，轻松实现专业技能的提升呢？不妨扫码加入java技术交流分享群，体验精彩公开课，还能免费领取更多学习资料。

添加「java技术交流分享群」，开启你的技能提升之旅吧~

GAOJIBULUO

微信公众号：Java高级部落

长按识别二维码关注我们

点击“阅读原文”

加入「java技术交流分享群」

一起学习提升吧~