从仅包含 HTML、CSS 和 JavaScript 的 Web 应用程序生成 .war 文件

Generate .war file from web app containing just HTML, CSS & JavaScript

提问by sam9046

I am trying to create a war file that will be deployed on a web/application server.

我正在尝试创建一个将部署在 Web/应用程序服务器上的 war 文件。

The source files of the app are purely HTML, CSS, and JavaScript. There is a separate war file for our REST API and for the rest of our backend code.

该应用程序的源文件是纯 HTML、CSS 和 JavaScript。我们的 REST API 和其余的后端代码有一个单独的 war 文件。

Most of the guides out there talk about using java to compile, and pointing to WEB-INF folders etc.

大多数指南都在谈论使用 java 进行编译，并指向 WEB-INF 文件夹等。

However, as I mentioned, in the HTML/CSS/JS war, I don't use any Java, don't use WEB-INF, and there are no servlets or other things you would normally see in a "Java" war file.

然而，正如我所提到的，在 HTML/CSS/JS War中，我不使用任何 Java，不使用 WEB-INF，并且没有 servlet 或您通常会在“Java”War文件中看到的其他东西.

How do I compile or create this type of war file?

我如何编译或创建这种类型的War文件？

The contents look like this:

内容如下所示：

WebContent/HTML WebContent/CSS WebContent/JS

网页内容/HTML 网页内容/CSS 网页内容/JS

All libraries for JavaScript contained within JS folder.

JS 文件夹中包含的所有 JavaScript 库。

Would this work: Simply run:

这是否有效：只需运行：

src.dist="./WebContent"
app.name="example"
app.version=1
work.home="./temp"

jar jarfile="${src.dist}/${app.name}-${app.version}.war"
     basedir="${work.home}"

Obviously I would have set up the rest of the script correctly.

显然我会正确设置脚本的其余部分。

回答by Marco

This is extremely simple:

这非常简单：

1. Create a folder
2. Add a src/main/webappfolder
3. Add all of your HTML, CSS and JS files to the src/main/webappfolder
4. Add an empty web.xmlfile to the src/main/webapp/WEB-INFdirectory.
5. add a maven pom.xml

6. add the maven-war-plugin to your pom.xml, with the following configuration:

   <!--  create the war -->
   <plugin>
     <artifactId>maven-war-plugin</artifactId>
     <configuration>
       <webXml>src/main/webapp/WEB-INF/web.xml</webXml>
     </configuration>
   </plugin>
   

7. run mvn clean install!

1. 创建文件夹
2. 添加src/main/webapp文件夹
3. 将所有 HTML、CSS 和 JS 文件添加到src/main/webapp文件夹中
4. 将一个空的web.xml文件添加到该src/main/webapp/WEB-INF目录中。
5. 添加一个Maven pom.xml

6. 将 maven-war-plugin 添加到 pom.xml 中，配置如下：

   <!--  create the war -->
   <plugin>
     <artifactId>maven-war-plugin</artifactId>
     <configuration>
       <webXml>src/main/webapp/WEB-INF/web.xml</webXml>
     </configuration>
   </plugin>
   

7. 运行 mvn 干净安装！

回答by Indu Devanath

If you are creating a war file, then you are deploying on a Java based web application server, something like Tomcator Wildfly.

如果您正在创建一个 war 文件，那么您将部署在基于 Java 的 Web 应用程序服务器上，例如Tomcat或Wildfly。

If you are using eclipse, you can do so by New > Dynamic Web Project(maybe name it foo-bar), click next, next and finish. Then open that foo-bar project and create your css and js folders under WebContent like so.

如果您使用的是 eclipse，您可以通过New > Dynamic Web Project（可能将其命名为 foo-bar），单击下一步，下一步并完成。然后打开那个 foo-bar 项目并像这样在 WebContent 下创建你的 css 和 js 文件夹。

\WebContent\css
\WebContent\js
\WebContent\index.html
\WebContent\foo-bar.html

You can right click the foo-bar project > Export > Web WAR file.

你可以right click the foo-bar project > Export > Web WAR file。

When you deploy it on say Tomcat, you can test to access your static content like so

当您将它部署在 Tomcat 上时，您可以像这样测试访问您的静态内容

http://localhost:8080/foo-bar/css/foo-bar.css
http://localhost:8080/foo-bar/js/foo-bar.js
http://localhost:8080/foo-bar/foo-bar.html

Hope this helps.

希望这可以帮助。