如何將 Angular 8 項目構建為 .war 文件

Question

我想知道如何將 angular 應用程序構建為 .war 文件，以便我可以使用 maven 部署到 WAS 服務器

Answer 1

戰爭文件結構如下

Root/ - Web resources.
    WEB-INF/ - directory for application support
       lib/ - supporting jar files
       web.xml - configuration file for the application

將您的 html、js 和 css 文件放在將作為 Web 資源提供的 war 文件的根目錄中。 您可以忽略 WEB-INF/lib 文件夾，因為 angular 不需要任何 java 庫。

Answer 2

您可以嘗試使用 grunt 進行 angular-grunt-build。 請參考https://www.npmjs.com/package/angular-grunt-build

Answer 3

您可以使用 maven 創建一個構建插件來執行 angular 應用程序的構建。 構建插件將在構建期間執行，它們應該在 POM 的元素中進行配置。

    <build>
        <plugins>
            <plugin>
                <groupId>org.codehaus.mojo</groupId>
                <artifactId>exec-maven-plugin</artifactId>
                <executions>
                    <execution>
                        <id>npm install</id>
                        <goals>
                            <goal>exec</goal>
                        </goals>
                        <phase>install</phase>
                        <configuration>
                            <executable>npm</executable>
                            <arguments>
                                <argument>install</argument>
                            </arguments>
                        </configuration>
                    </execution>
                    <execution>
                        <id>npm build</id>
                        <goals>
                            <goal>exec</goal>
                        </goals>
                        <phase>install</phase>
                        <configuration>
                            <executable>npm</executable>
                            <arguments>
                                <argument>run</argument>
                                <argument>build</argument>
                            </arguments>
                        </configuration>
                    </execution>
                </executions>
            </plugin>
        </plugins>
    </build>

重要的是你之前已經安裝了 node js，npm。 如果不是，maven 構建將失敗，因為它找不到運行 angular 應用程序構建的環境。

之后我們修改maven-war-plugin。 我們在下面指定的目錄將是 maven build 生成的 war 中的 location angular app。

            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-war-plugin</artifactId>
                <configuration>
                    <failOnMissingWebXml>false</failOnMissingWebXml>
                    <webResources>

                        <resource>
                            <targetPath>resources</targetPath>
                            <filtering>false</filtering>
                            <!-- this is relative to the pom.xml directory -->
                            <directory>../path when you want to put angular app /dist/</directory>
                            <includes>
                                <include>**/*.*</include>
                            </includes>
                        </resource
                    </webResources>
                </configuration>
            </plugin>