java - 如何将 vue dist 文件夹部署到 GlassFish 5？

Question

我正在尝试找出一种在 GlassFish 5 上部署我的 vue 项目的方法。 原因是我有两个项目。在 GlassFish 上运行的基于 Java 的 REST 项目。以及之前在 node.js 上运行的纯 Vue 项目。

由于 2 个不同的主机，我不得不一次又一次地与 CORS 问题作斗争，我想将这两个项目组合在一台服务器上。

如果我在 Vue 文档 (how to create dist folder) 中理解正确，那么首先我必须使用 serve -s dist 创建一个 dist 文件夹。

要将此文件夹部署到我的 GlassFish 服务器上，我必须如何处理该文件夹？

目标是我可以继续在我的纯 Vue 项目中开发前端，然后从中创建一个新的 dist 文件夹，然后将它移动到我需要通过我的 GlassFish 服务器提供它的任何地方。

从那里，我调用了我的休息界面，而没有遇到任何 CORS 问题。

我的休息/后端项目是用 Maven 构建的，是一场 war 。

Answer 1

您可以使用 frontend-maven-plugin 将前端构建步骤捆绑在 Maven 构建中。只需使用此 Maven 插件执行构建 Vue 应用程序的命令(例如 npm run build)并配置 .war 文件以包含 dist文件夹作为网络资源。

我对在 Payara(类似于 Glassfish)上运行的 React + Jakarta EE 应用程序做了同样的设置(您可能需要根据您的文件夹结构调整它):

<project>

  <!-- dependencies like seen above -->

  <build>
    <finalName>jakarta-ee-react-file-handling</finalName>
    <plugins>
      <plugin>
        <groupId>com.github.eirslett</groupId>
        <artifactId>frontend-maven-plugin</artifactId>
        <version>1.8.0</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>
            <phase>generate-resources</phase>
            <configuration>
              <arguments>install</arguments>
            </configuration>
          </execution>
          <execution>
            <id>npm test</id>
            <goals>
              <goal>npm</goal>
            </goals>
            <phase>generate-resources</phase>
            <configuration>
              <environmentVariables>
                <CI>true</CI>
              </environmentVariables>
              <arguments>test</arguments>
            </configuration>
          </execution>
          <execution>
            <id>npm build</id>
            <goals>
              <goal>npm</goal>
            </goals>
            <phase>generate-resources</phase>
            <configuration>
              <environmentVariables>
                <CI>true</CI>
              </environmentVariables>
              <arguments>run build</arguments>
            </configuration>
          </execution>
        </executions>
        <configuration>
          <workingDirectory>src/main/frontend</workingDirectory>
          <nodeVersion>v12.13.1</nodeVersion>
        </configuration>
      </plugin>
      <plugin>
        <artifactId>maven-compiler-plugin</artifactId>
        <version>3.8.1</version>
      </plugin>
      <plugin>
        <artifactId>maven-surefire-plugin</artifactId>
        <version>2.22.2</version>
      </plugin>
      <plugin>
        <artifactId>maven-war-plugin</artifactId>
        <version>3.2.3</version>
        <configuration>
          <webResources>
            <resource>
              <directory>${project.basedir}/src/main/frontend/build</directory>
            </resource>
          </webResources>
        </configuration>
      </plugin>
    </plugins>
  </build>
</project>

我还写了关于 bundling the frontend build with a Jakarta EE backend 的指南源代码也可以在 GitHub 上找到.