在战争中打包 javascript 应用程序（使用 grunt 和 browserify）

Question

我有一个项目，其中包含一个 javascript 客户端应用程序和一个基于 maven+spring 的 REST Web 服务。

javascript 应用程序是使用 browserify 和 grunt 构建的。出于这个原因，我无法简单地将 html/js 源代码放在基于 maven 的 Web 服务项目的 src/main/webapp 目录中。真正需要的是在 browserify/grunt 编译之后 javascript 应用程序的 dist 目录的内容。

问题是：如何设置以便将 javascript 应用程序与 Web 服务战争一起打包（请注意，这需要包括 grunt/browserify 构建步骤）？

Answer 1

这可以通过使用 maven 的 frontend-maven-plugin 来实现。我在每次 maven 构建期间使用它执行以下步骤：

• 下载和安装 Node.js（如果它不存在）
• 更新 npm 包
• 执行我的前端构建 (gulp)
• Gulp 会将我的 SASS 和 JS 编译到插件中指定的文件夹中

我还可以通过更改文件来触发 gulp 构建。我的 POM 的一部分（对于 grunt 应该类似）：

        <plugin>
            <groupId>com.github.eirslett</groupId>
            <artifactId>frontend-maven-plugin</artifactId>
            <version>0.0.26</version>
            <configuration>
                <workingDirectory>src/main/frontend</workingDirectory>
                <installDirectory>.</installDirectory>
            </configuration>
            <executions>
                <!-- Config from: https://github.com/eirslett/frontend-maven-plugin -->
                <!-- phase optional for all executions: default phase is "generate-resources" -->
                <!--  disable some of the following executions to improve build speed -->
                <execution>
                    <id>install node and npm</id>
                    <goals>
                        <goal>install-node-and-npm</goal>
                    </goals>
                    <phase>generate-resources</phase>
                    <configuration>
                        <nodeVersion>v4.1.1</nodeVersion>
                        <npmVersion>3.3.3</npmVersion>
                        <nodeDownloadRoot>https://nodejs.org/dist/</nodeDownloadRoot>
                        <npmDownloadRoot>http://registry.npmjs.org/npm/-/</npmDownloadRoot>
                    </configuration>
                </execution>
                <execution>
                    <id>npm install</id>
                    <goals>
                        <goal>npm</goal>
                    </goals>
                    <phase>generate-resources</phase>
                    <configuration>
                        <arguments>install</arguments>
                    </configuration>
                </execution>
                <execution>
                    <id>gulp build</id>
                    <goals>
                        <goal>gulp</goal>
                    </goals>
                    <phase>generate-resources</phase>
                    <configuration>
                        <srcdir>src/main/frontend</srcdir>
                        <outputdir>src/main/webapp/resources</outputdir>
                        <arguments>build</arguments>
                    </configuration>
                </execution>
            </executions>
        </plugin>