在一个jar中构建带有springboot2.x的angular11

yvgpqqbh  于 2021-07-12  发布在  Java
关注(0)|答案(2)|浏览(253)

我面临着一个问题,建立一个Angular 11与Spring Boot罐。如果我单独运行应用程序(8080上的后端和4200上的用户界面),它们工作得很好,中间的连接和调用正常稳定。
我要做的是整合这个。我见过很多例子,但我不知道我在哪里做错了什么。
以下是项目结构图:

下面是maven插件,它们正在安装ui构建内容并将其复制到jar中。

<plugin>
        <groupId>com.github.eirslett</groupId>
        <artifactId>frontend-maven-plugin</artifactId>
        <version>${frontend-maven-plugin.version}</version>
        <configuration>
            <nodeVersion>${node.version}</nodeVersion>
            <workingDirectory>${frontendSrcDir}</workingDirectory>
            <installDirectory>${project.build.directory}</installDirectory>
            <environmentVariables>
                <CI>true</CI>
            </environmentVariables>
            <!--suppress UnresolvedMavenProperty -->
            <skip>${skip.ui}</skip>
        </configuration>
        <executions>
            <execution>
                <id>install-frontend-tools</id>
                <goals>
                    <goal>install-node-and-npm</goal>
                </goals>
                <configuration>
                    <nodeVersion>v14.16.0</nodeVersion>
                    <npmVersion>6.14.13</npmVersion>
                </configuration>
            </execution>
            <execution>
                <id>npm-install</id>
                <goals>
                    <goal>npm</goal>
                </goals>
                <configuration>
                    <arguments>install</arguments>
                </configuration>
            </execution>
            <execution>
                <id>build-frontend</id>
                <goals>
                    <goal>npm</goal>
                </goals>
                <phase>prepare-package</phase>
                <configuration>
                    <arguments>run build --prod</arguments>
                </configuration>
            </execution>
        </executions>
    </plugin>
    <plugin>
        <groupId>org.apache.maven.plugins</groupId>
        <artifactId>maven-resources-plugin</artifactId>
        <executions>
            <execution>
                <id>angular-build</id>
                <goals>
                    <goal>copy-resources</goal>
                </goals>
                <phase>validate</phase>
                <configuration>
                    <outputDirectory>${project.build.outputDirectory}/static</outputDirectory>
                    <resources>
                        <resource>
                            <directory>${frontendSrcDir}/dist/ui</directory>
                        </resource>
                    </resources>
                </configuration>
            </execution>
        </executions>
    </plugin>

在jar中,构建文件被复制到jar/boot-inf/classes/static下。这是图像

我错过了什么?

7lrncoxx

7lrncoxx1#

如果您在“资源”中有一个名为“static”或“public”的文件夹,springboot会自动提供静态内容。所以把所有从angular编译的文件放在参考资料下一个名为“static”的文件夹中。
这样做将使Spring Boot服务Angular :)

iibxawm4

iibxawm42#

在@aborgh答案中,
所以把所有从angular编译的文件放在参考资料下一个名为“static”的文件夹中。
这是正确的,我只是补充一些。具体来说,当您运行build命令时,例如 npm build ,它在中生成静态文件,如.html、.js、.css dist 文件夹。
所以你想复制下的所有文件 dist 将它们粘贴到springboot项目中,然后将它们直接放到 resources/static 文件夹。
与您的问题无关,但我建议您将静态文件与springboot后端应用程序分开放置。尝试使用反向代理,比如nginx,这样就可以解析请求,比如https://example.com/api/ 到您的springboot后端应用程序和所有其他请求,例如https://example.com/foo/ 你的前端Angular 视图。

相关问题