如何把Bootstrap和JQuery在不能上网环境中生效并用Maven来管理版本?

原创 2017年05月07日 01:22:05

有的时候,我们的代码开发和部署环境有可能是上不了互联网。但是我们的代码中有引用了BootStrap或者JQuery等一些前端框架;一个办法就是把BootStrap或者JQuery的css或者JavaScript文件复制到Web项目中,并且放到一个相对路径,然后在我们的网页中加入引用,这是一个方法,但是如果以后BootStrap版本需要升级了,我们开发人员有需要新手工替换其css或者JavaScript文件;必须手工的管理器版本;那么有没有一个好的方法来进行管理呢?比如通过Maven的方式? 结果是肯定的,那就是找webjar。WebJars是将这些通用的Web前端资源打包成Java的Jar包,然后借助Maven工具对其管理,保证这些Web资源版本唯一性,升级也比较容易。关于webjars资源,有一个专门的网站http://www.webjars.org/,我们可以到这个网站上找到自己需要的资源,在自己的工程中添加入maven依赖,即可直接使用这些资源了。下面以SpringBoot项目为例子(SpringMVC项目也行),其具体步骤如下:

@添加Maven的依赖

 <dependency>
   <groupId>org.webjars</groupId>
   <artifactId>bootstrap</artifactId>
   <version>3.3.7</version>
</dependency>
<dependency>
   <groupId>org.webjars</groupId>
   <artifactId>jquery</artifactId>
   <version>3.1.1</version>
</dependency>

@新建一个WebConfig的类

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

@Configuration
@EnableWebMvc
public class WebConfig extends WebMvcConfigurerAdapter {
 
    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");
    }
}
通过上面新建的一个WebConfig类,将对/webjars的访问重定向到/META-INF/resources/webjars/。

@在网页中,加入下面的链接

    <link rel="stylesheet" href="/webjars/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="/webjars/bootstrap/3.3.7/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="/webjars/bootstrap/3.3.7/js/bootstrap.min.js">
    <link rel="stylesheet" href="/webjars/jquery/3.1.1/jquery.min.js">

@ 通过JQuery的例子进行测试

<!DOCTYPE HTML>
<html>
<head>
    <title>Getting Started: Spring Boot CLI + Javascript</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script src="/webjars/jquery/3.1.1/jquery.min.js" type="text/javascript"></script>
    <script src="/webjars/jquery/3.1.1/jquery.min.js" type="text/javascript"></script>
    <!-- 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
     -->
    <script type="text/javascript">
        $(document).ready(function() {
            $('p').animate({
                fontSize: '48px'
            }, "slow");
        });
    </script>
</head>
<body>
    <p th:text="'Hello, ' + ${name} + '!'" />
</body>
</html>

将会看到字体逐步变大的有JQuery渲染的动画效果。


版权声明:本文为博主原创文章,未经博主允许不得转载。

JavaWeb开发分享:WebJars

使用WebJars简化Java Web开发当中Javascripts和CSS文件的管理维护

ssm+maven+bootstrap尝试

谨以此篇文章来记录4月份开发那点事儿。      从去年12月份换工作到现在,主要内容是做接口开发,调用阿里云,Azure,vmware,openstack等国内外云平台restful接口,主要包括...

Delphi7高级应用开发随书源码

  • 2003年04月30日 00:00
  • 676KB
  • 下载

SpringMVC 引用BootStrap和jQuery

无意中在Maven公服中发现bootstrap了,发现已经被打包到jar中了。 http://mvnrepository.com/artifact/org.webjars/bootstrap 添加依赖...
  • wncnke
  • wncnke
  • 2017年01月13日 14:14
  • 1919

ssm+maven+bootstrap搭建

ssm+maven+bootstrap搭建 搭建中。。。 一、架构特点 1、用MAVEN做依赖管理,分为父子工程。 2、基础框架SSM(SpringMVC+Spring+mybatis) 3、前...

Hibernate一对多关联映射(注解)

Hibernate一对多关联映射,维护端(一方,无外键方)可以进行关联移除,级联删除,级联保存,级联更新,级联刷新。被维护端(多方,外键方),不可以进行关联移除,级联操作,只能级联刷新。   ...

hibernate注解实体类(Emp.java)

Emp.java     员工信息表的注解实体类详情: package cn.bdqn.hibernate_Criteria.entity; import java.util.Date; imp...

如何在eclipse中开发多个聚合关系的maven项目并用git管理

如何在eclipse中开发多个聚合关系的maven项目并用git管理

通过环境变量修改java版本不生效

本机依次安装了 jdk1.8、jdk1.6 和 jdk1.7 三个版本的 jdk,由于maven打包android程序最高只支持到 jdk1.7,因此需要将jdk版本该为1.7。修改环境变量,将JAV...

通过环境变量修改java版本不生效

本机依次安装了 jdk1.8、jdk1.6 和 jdk1.7 三个版本的 jdk,由于maven打包android程序最高只支持到 jdk1.7,因此需要将jdk版本该为1.7。修改环境变量,将JAV...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:如何把Bootstrap和JQuery在不能上网环境中生效并用Maven来管理版本?
举报原因:
原因补充:

(最多只允许输入30个字)