当前位置: 首页 > 知识库问答 >
问题:

如何将带有angular 2前端(angular cli构建)的spring boot webapp部署到Tomcat?

后源
2023-03-14

我有一个spring boot web应用程序,我用angular cli构建了我的前端。我已在angular cli中设置angular build的输出目录。json到resources/static,我已经在包中配置了构建脚本。json如下所示:

"scripts" : {"build": "ng build --base-href /mywebapp", ...}

在应用程序中。Spring Boot配置的属性我已经设置了服务器。“mywebapp”的上下文路径

但是,如果我构建角应用程序,资源/静态中创建的index.html所包含的js文件不包含服务器上下文路径mywebapp:

<script type="text/javascript" src="inline.bundle.js"></script>
<script type="text/javascript" src="polyfills.bundle.js"></script>

但是我应该看起来像这样:

<script type="text/javascript" src="/mywebapp/inline.bundle.js"></script>
<script type="text/javascript" src="/mywebapp/polyfills.bundle.js"></script>

因此,如果我将我的spring boot应用程序部署到tomcat上,则生成索引。html已加载,但找不到导入的js文件,并尝试在下加载文件http://localhost:8080/而不是http://localhost:8080/mywebapp/.

如果我不想在根目录下部署一个带有角度前端的Spring Boot应用程序,如何将其部署到tomcat服务器?

共有2个答案

单耘豪
2023-03-14

我有同样的问题,首先我创建了一个pom。xml文件,我使用插件将我的包转换为war文件。

<plugins>

  <!-- ############################## -->
  <!-- npm scripts                    -->
  <!-- ############################## -->

  <plugin>
    <groupId>org.codehaus.mojo</groupId>
    <artifactId>exec-maven-plugin</artifactId>
    <executions>
      <execution>
        <id>exec-project-dependencies-install</id>
        <phase>generate-sources</phase>
        <configuration>
          <executable>npm</executable>
          <arguments>
            <argument>install</argument>
          </arguments>
        </configuration>
        <goals>
          <goal>exec</goal>
        </goals>
      </execution>

      <!-- run `ng build -prod -aot` -->
      <!-- * clean dist/ before generating distribution files -->
      <execution>
        <id>exec-compile</id>
        <phase>generate-sources</phase>
        <configuration>
          <executable>npm</executable>
          <arguments>
            <argument>run</argument>
            <argument>ci</argument>
          </arguments>
        </configuration>
        <goals>
          <goal>exec</goal>
        </goals>
      </execution>
    </executions>
  </plugin>

  <!-- generate zip -->
  <plugin>
    <groupId>org.apache.maven.plugins</groupId>
    <artifactId>maven-assembly-plugin</artifactId>
    <version>2.3</version>
    <configuration>
      <descriptors>
        <descriptor>src/assembly/static.xml</descriptor>
      </descriptors>
    </configuration>
    <executions>
      <execution>
        <id>make-assembly</id>
        <phase>package</phase>
        <goals>
          <goal>single</goal>
        </goals>
      </execution>
    </executions>
  </plugin>
   <!--generate zip -->
  <plugin>
    <groupId>org.apache.maven.plugins</groupId>
    <artifactId>maven-assembly-plugin</artifactId>
    <version>2.3</version>
    <configuration>
      <descriptors>
        <descriptor>src/assembly/static.xml</descriptor>
      </descriptors>
    </configuration>
    <executions>
      <execution>
        <id>make-assembly</id>
        <phase>package</phase>
        <goals>
          <goal>single</goal>
        </goals>
      </execution>
    </executions>
  </plugin>

在部署时,我发现了一些问题和很好的讲座。

理论-https://kosbr.github.io/2016/10/09/angular-build.html

问题-https://github.com/angular/angular-cli/issues/4517 - https://github.com/angular/angular-cli/pull/4090

希望能有所帮助。

康秋月
2023-03-14

请看一下我使用'--deploy url'参数的答案。https://stackoverflow.com/a/43741602/5633515

在您的情况下,使用--deploy url=“/mywebapp/”

 类似资料:
  • 十构建部署 待更新……

  • 问题内容: 我是Yesod的新手,无法静态构建Yesod,因此可以部署到Heroku。 我已更改默认的.cabal文件以反映静态编译 而且它不再构建。我收到一堆警告,然后是许多未定义的引用,如下所示: 如果我仅使用just进行编译,而没有进行 任何编译,则一切正常,但是当尝试在Heroku上启动时,应用程序崩溃。 我尝试按照此处的建议将libgmp.so.10添加到LD_LIBRARY_PATH

  • 问题内容: 我正在开发一个新项目,其中react / express作为前端,而loopback作为后端api。我在开发环境中使用不同的端口将它们分开。 我应该如何在生产中部署它们? 托管在同一服务器上-将后端与其他子域分开? 在2台不同的服务器上托管-似乎无法使用同一域。 问题答案: 您可以部署 您的 静态托管服务* 和 CDN 前端 *** AWS S3 + AWS CloudFront Go

  • 问题内容: 在尝试将新的portlet安装到在Glassfish域上运行的Liferay时遇到了问题。我最近很清楚流程,也想与他人分享。所以,请阅读答案,希望这对某人有帮助:) (此问题的先决条件是,我知道添加在 Glassfish 上运行的项目是通过autodeploy文件夹完成的,但是使它们在 Liferay上 可见则是另一回事了。) 问题答案: 因此,您首先创建一个.war文件,让我们说一个

  • 请问Vanblogs 该如何部署呀,谢谢各位大神 看过相应的操作说明,但是看不懂,小白一个

  • 本文向大家介绍docker+daocloud实现前端项目自动构建部署,包括了docker+daocloud实现前端项目自动构建部署的使用技巧和注意事项,需要的朋友参考一下 项目的自动化部署在大公司或独角兽中用得比较多,相比来进行手动部署项目来说会更加高效。那么本文结合之前学习的docker知识点以及nginx来简单实现VueJs项目的自动部署,当然针对其他项目也类似。 运行环境 首先需要在服务器上