使用Maven构建RichFaces 4.x项目

开始之前

本文将简要介绍一下如何在Maven项目中引入RichFaces 4.x。部分内容参考自RichFaces的官方文档。

以下是具体的开发环境：

IntelliJ IDEA 13
Maven 3.x
JDK 1.8
WildFly 8.x
RichFaces 4.3.6.Final

第一步 - 创建Maven项目

首先要创建一个正常的Maven项目（项目名为 facesDemo ），项目建成后目录结构如下图所示：

对应的 pom.xml 文件如下：

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>

  <groupId>com.eagle</groupId>
  <artifactId>facesDemo</artifactId>
  <version>1.0-SNAPSHOT</version>
  <packaging>war</packaging>

  <build>
    <!-- 打包后的项目名 -->
    <finalName>facesDemo</finalName>
  </build>

</project>

第二步 - 添加依赖文件

RichFaces自己包含有4个库文件：

richfaces-core-api.jar
richfaces-core-impl.jar
richfaces-components-api.jar
richfaces-components-impl.jar

此外，RichFaces还依赖于一些第三方文件，这里只列出那些必须的依赖文件：

JSF 2.x的具体实现
guava.jar
cssparser.jar
sac.jar

接下来就要在 pom.xml 文件中引入这些依赖文件。首先引入RichFaces的库文件：

<properties>
  <!-- RichFaces version -->
  <richfaces.version>4.3.6.Final</richfaces.version>
  <!-- JSF version -->
  <jsf.version>2.2.6</jsf.version>
</properties>

<dependencies>
  <dependency>
    <groupId>org.richfaces.ui</groupId>
    <artifactId>richfaces-components-ui</artifactId>
    <version>${richfaces.version}</version>
  </dependency>
  <dependency>
    <groupId>org.richfaces.core</groupId>
    <artifactId>richfaces-core-impl</artifactId>
    <version>${richfaces.version}</version>
  </dependency>
</dependencies>

接下来添加JSF的具体实现。由于项目的服务器使用的是WildFly，它本身已经集成了JSF，所以将下面配置的依赖范围设为 provided （仅用于编译和测试）：

<dependency>
  <groupId>com.sun.faces</groupId>
  <artifactId>jsf-api</artifactId>
  <version>${jsf.version}</version>
  <scope>provided</scope>
</dependency>
<dependency>
  <groupId>com.sun.faces</groupId>
  <artifactId>jsf-impl</artifactId>
  <version>${jsf.version}</version>
  <scope>provided</scope>
</dependency>

由于Maven的传递性依赖机制，那些没有在 pom.xml 文件中显式引入的依赖文件也会被引入项目中（上述依赖文件的坐标都来自Maven Central Repository）。最后文件之间的依赖关系如下图所示：

第三步 - 配置RichFaces

在 web.xml 文件中配置RichFaces。

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
         version="3.1">
  <welcome-file-list>
    <welcome-file>index.xhtml</welcome-file>
  </welcome-file-list>

  <context-param>
    <param-name>javax.faces.DEFAULT_SUFFIX</param-name>
    <param-value>.xhtml</param-value>
  </context-param>
  <context-param>
    <param-name>javax.faces.PROJECT_STAGE</param-name>
    <param-value>Development</param-value>
  </context-param>

  <servlet>
    <servlet-name>facesServlet</servlet-name>
    <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
    <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>facesServlet</servlet-name>
    <url-pattern>*.xhtml</url-pattern>
  </servlet-mapping>
</web-app>

在 WEB-INF 文件夹下新建 faces-config.xml 文件。

<?xml version='1.0' encoding='UTF-8'?>
<faces-config version="2.2" xmlns="http://xmlns.jcp.org/xml/ns/javaee"
              xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
              xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee 
                                  http://xmlns.jcp.org/xml/ns/javaee/web-facesconfig_2_2.xsd">

</faces-config>

第四步 - 创建显示页面

在 webapp 目录下新建 index.xhtml 文件，内容如下：

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:a4j="http://richfaces.org/a4j"
                xmlns:rich="http://richfaces.org/rich">
  <f:view>
    <h:head></h:head>
    <h:body>
      <rich:panel header="Richfaces Demo">
        <h:outputLabel value="Hello Richfaces"/>
      </rich:panel>
    </h:body>
  </f:view>
</ui:composition>

大功告成，将项目打包部署之后就可以看到页面效果了。