JSP环境下如何对LESS自动预处理

最新推荐文章于 2024-04-28 04:38:24 发布

Vilien

最新推荐文章于 2024-04-28 04:38:24 发布

阅读量2k

点赞数

分类专栏： CSS+DIV

本文链接：https://blog.csdn.net/binjly/article/details/10215119

版权

CSS+DIV 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

首先，我其实并不懂JSP，但是碍于项目需求，我不得不以一个前端的身份去研究如何在JSP环境下实施LESS。

因为我们这个项目里有用户个性化CSS文件，所以需要能够对LESS自动预处理，而不希望需要人工介入。

好了，废话不多说，以下提供我研究出来的方案。

首先是包依赖性：

apache-commons-logging.jar

log4j-1.2.17.jar

commons-lang-2.6.jar （只能用3.0以下版本，版本过高将报编译错误）

js.jar （目前可用版本为rhino1_7R3和rhino1_7R4。rhino1_7R4性能稍高，但是只报编译错误。rhino1_7R3性能稍差，但是错误信息很详细，对调试LESS很有用。）

lesscss-engine-1.3.0.jar （可选的，似乎去掉也不影响正常运行）

lesscss-servlet-1.3.0.jar （LESS解析包，这个才是关键）

将以上这些包全部放入tomcat的lib文件夹下即可。

环境配置：

只需在WEB-INF/web.xml 文件添加如下节点即可：

    <servlet>
        <servlet-name>less</servlet-name>
        <servlet-class>com.asual.lesscss.LessServlet</servlet-class>
        <init-param>
            <param-name>compress</param-name>
            <param-value>false</param-value>
        </init-param>
        <init-param>
            <param-name>cache</param-name>
            <param-value>false</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>less</servlet-name>
        <url-pattern>*.less</url-pattern>
    </servlet-mapping>

参数compress，表示是否启用压缩。生产环境建议启用。

参数cache，表示是否启用缓存。测试环境不要启用。

Okay，我们来测试一下，新建一个文件，命名为 test.less，文件内容如下：

@color: #FF0000;

#header {
    color: @color;
}

然后，启动tomcat，打开浏览器，输入：http://127.0.0.1:8080/test.less。结果应该如下：

#header {
  color: #ff0000;
}

至此，JSP环境下的LESS预处理宣告成功。