springboot bootcdn使用示例详解

应用:直接使用bootcdn提供的静态资源,不需要本地存储

bootcdn 官网:https://www.bootcdn.cn/

staticfile cdn官网: http://www.staticfile.org/

常用静态资源

# layui.js
https://cdn.bootcdn.net/ajax/libs/layui/2.6.8/layui.js
https://cdn.bootcdn.net/ajax/libs/layui/2.6.8/layui.min.js

# layui.css
//unpkg.com/layui@2.6.8/dist/css/layui.css
https://www.layuicdn.com/layui-v2.6.8/css/layui.css

# jquery
https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js
https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js

# bootstrap
https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/css/bootstrap-grid.css
https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/css/bootstrap-grid.min.css

# react
https://cdn.bootcdn.net/ajax/libs/react-is/0.0.0-experimental-6f3fcbd6f-20210730/cjs/react-is.development.js
https://cdn.bootcdn.net/ajax/libs/react-is/0.0.0-experimental-6f3fcbd6f-20210730/cjs/react-is.development.min.js

# vue
https://cdn.bootcdn.net/ajax/libs/vue/3.2.0-beta.7/vue.cjs.js
https://cdn.bootcdn.net/ajax/libs/vue/3.2.0-beta.7/vue.cjs.min.js

*********************

示例

***************

配置文件

cdn.properties

layui=https://cdn.bootcdn.net/ajax/libs/layui/2.6.8/layui.min.js
jquery=https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js

***************

前端页面

index.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script th:src="${application.jquery}"></script>
    <script th:src="${application.layuijs}"></script>
    <link rel="stylesheet" th:href="${application.layuicss}">
    <!--
    <script>
        $(function (){
            $("#btn").click(function (){
                alert("hello world");
            })
        })
    </script>-->
    <script>
        layui.use('layer',function (){
            var layer=layui.layer;

            $("#btn").click(function (){
                $("#1").html("瓜田李下<br>");

                layer.msg('hello')
            })
        })
    </script>
</head>
<body>
<div th:align="center">
    <span id="1" style="background-color: purple;font-size: large"></span><br>
    <button id="btn" class="layui-btn">点击一下</button>
</div>
</body>
</html>

*********************

到此这篇关于springboot bootcdn使用的文章就介绍到这了,更多相关springboot bootcdn内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • Spring Boot中如何使用Swagger详解

    目录 Swagger 简介 配置 Swagger 添加依赖 为项目开启 Swagger 创建 SwaggerConfig 配置类 访问 Swagger 前端页面 控制器相关注解 实体相关注解 总结 Swagger 简介 Swagger 是一个方便 API 开发的框架,它有以下优点: 自动生成在线文档,后端开发人员的改动可以立即反映到在线文档,并且不用单独编写接口文档,减轻了开发负担 支持通过 Swagger 页面直接调试接口,方便前端开发人员进行测试 配置 Swagger Swagger 目前有

  • 在Spring-Boot中如何使用@Value注解注入集合类

    我们在使用spring框架进行开发时,有时候需要在properties文件中配置集合内容并注入到代码中使用.本篇文章的目的就是给出一种可行的方式. 1.注入 通常来说,我们都使用@Value注解来注入properties文件中的内容,注入集合类时,我们也使用@Value来注入. properties文件中的内容如下: my.set=foo,bar my.list=foo,bar my.map={"foo": "bar"} 分别是我们要注入的Set,List,Map中

  • springboot bootcdn使用示例详解

    应用:直接使用bootcdn提供的静态资源,不需要本地存储 bootcdn 官网:https://www.bootcdn.cn/ staticfile cdn官网: http://www.staticfile.org/ 常用静态资源 # layui.js https://cdn.bootcdn.net/ajax/libs/layui/2.6.8/layui.js https://cdn.bootcdn.net/ajax/libs/layui/2.6.8/layui.min.js # layui.

  • SpringBoot集成MQTT示例详解

    目录 引言 MQTT 特点 Apache-Apollo 下载 配置与启动 SpringBoot2的开发 添加依赖 自定义配置 配置MQTT发布和订阅 消息发布器 发送消息 入口类 引言 特别提醒: 文中提到的MQTT服务器Apache-Apollo,现在已经不维护.但是客户端的写法是通用的.目前我常用的是RabbitMQ加mqtt插件. MQTT MQTT(消息队列遥测传输)是ISO标准(ISO/IEC PRF 20922)下基于发布/订阅范式的消息协议.它工作在 TCP/IP协议族上,是为硬件

  • Springboot - Fat Jar示例详解

    目录 导读 JAR 是什么 JAR简介 JAR结构 包结构 描述文件MANIFEST.MF FatJar有什么不同 什么是FatJar? SpringBoot FatJar解决方案 spring-boot-maven-plugin打包过程 打包结果 启动时的类加载原理 启动的整个流程 参考资料 导读 Spring Boot应用可以使用spring-boot-maven-plugin快速打包,构建一个可执行jar.Spring Boot内嵌容器,通过java -jar命令便可以直接启动应用. 虽然

  • Springboot自动扫描包路径来龙去脉示例详解

    我们暂且标注下Springboot启动过程中较为重要的逻辑方法,源码对应的spring-boot-2.2.2.RELEASE版本 public ConfigurableApplicationContext run(String... args) { StopWatch stopWatch = new StopWatch(); stopWatch.start(); ConfigurableApplicationContext context = null; Collection<SpringBoo

  • springboot项目配置swagger2示例详解

    swagger简介 Swagger是一款RESTful接口的文档在线自动生成.功能测试功能框架.一个规范和完整的框架,用于生成.描述.调用和可视化RESTful风格的Web服务,加上swagger-ui,可以有很好的呈现. 当我们在后台的接口修改了后,swagger可以实现自动的更新,而不需要人为的维护这个接口进行测试. 一.swagger2中常用的注解作用 注解 作用 @Api 修饰整个类,描述Controller的作用 ,表示标识这个类是swagger的资源 @ApiOperation 描述

  • SpringBoot使用GTS的示例详解

    1. 依赖类库txc-client.jar, txt-client-spring-cloud-2.0.1.jar 2. 使用TxcDataSource代理源数据源[注意:dbcp2.BasicDataSource不支持,可以使用DruidDataSource] 3. 添加自动配置类文件 package com.bodytrack.restapi; import com.taobao.txc.client.aop.TxcTransactionScaner; import com.taobao.tx

  • SpringBoot框架集成ElasticSearch实现过程示例详解

    目录 依赖 与SpringBoot集成 配置类 实体类 测试例子 RestHighLevelClient直接操作 索引操作 文档操作 检索操作 依赖 SpringBoot版本:2.4.2 <dependencies> <!--lombok--> <dependency> <groupId>org.projectlombok</groupId> <artifactId>lombok</artifactId> <opti

  • springboot使用nacos的示例详解

    1.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/PO

  • SpringBoot集成POI实现Excel导入导出的示例详解

    目录 知识准备 什么是POI POI中基础概念 实现案例 Pom依赖 导出Excel 导入Excel 示例源码 知识准备 需要了解POI工具,以及POI对Excel中的对象的封装对应关系. 什么是POI Apache POI 是用Java编写的免费开源的跨平台的 Java API,Apache POI提供API给Java程序对Microsoft Office格式档案读和写的功能.POI为“Poor Obfuscation Implementation”的首字母缩写,意为“简洁版的模糊实现”. A

  • SpringBoot集成本地缓存性能之王Caffeine示例详解

    目录 引言 Spring Cache 是什么 集成 Caffeine 核心原理 引言 使用缓存的目的就是提高性能,今天码哥带大家实践运用 spring-boot-starter-cache 抽象的缓存组件去集成本地缓存性能之王 Caffeine. 大家需要注意的是:in-memeory 缓存只适合在单体应用,不适合与分布式环境. 分布式环境的情况下需要将缓存修改同步到每个节点,需要一个同步机制保证每个节点缓存数据最终一致. Spring Cache 是什么 不使用 Spring Cache 抽象

随机推荐