28、springboot的静态模版(前端页面)重加载和 devtools开发者工具

这篇具有很好参考价值的文章主要介绍了28、springboot的静态模版(前端页面)重加载和 devtools开发者工具。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

springboot的静态模版重加载和 devtools开发者工具

总结:实现静态模板重加载的两个方法
方法1:在 yml 配置文件,关闭页面模板缓存, 再按 ctrl+f9 重新构建
方法2:直接添加 devtools 依赖,再按 ctrl+f9 重新构建

★ 热插拔

所谓热插拔,其实就是让开发者能实时看到代码修改后的结果。

热插拔是实际开发中非常重要的一个支持。

——如果没有热插拔,意味着开发者无论做了多小的修改,必须等待程序重启后才能看到结果。


hot swap——很多翻译为热交换。

★ 最基础的要求——静态模板的重加载。

要求:当开发者修改了应用的静态模板页面(Thymeleaf、freemarker、groovy template、mustache)。

只要关闭静态页面模板的缓存即可:

在yml配置文件中,各个静态页面模板对应的关闭页面缓存的配置代码:

 spring.thymeleaf.cache=false            #  Thymeleaf模
 spring.freemarker.cache=false           # FreeMarker模板
 spring.groovy.template.cache=false      # Groovy模板
 spring.mustache.template.cache=false    # Mustache模板


▲ 静态模板重加载的注意事项

Spring Boot通过监测类加载路径下文件的改变来实现模板的重加载。

 换而言之:如果类加载路径下(classes目录)的文件没有改变,那Spring Boot就不会触发静态模板的重加载

 如果只是更改了静态资源(比如图片、CSS样式单等),由于它们都不在项目的类加载路径下,
 因此它们都不会触发Spring Boot重加载静态资源。

▲ 由于Eclipse默认开启了自动构建, 因此保存模板页面后会触发重加载;

 保存页面模板 --> 自动构建 --> 类加载路径下文件发生变化 --> Spring Boot静态模板重加载

▲ 由于IDEA默认没有开启自动构建,因此要么先启用自动构建,要么每次修改页面模板后按Ctrl + F9构建项目来触发模板的重加载。

 保存页面模板(src文件发生了改变) --> 没有自动构建 --> 类加载路径下文件没有变化 --> 不触发Spring Boot静态模板重加载

 要么先启用自动构建;要么每次修改页面模板后按Ctrl + F9来构建项目,即可让静态页面重加载。

代码演示:

需求:如果前端使用到 Thymeleaf模板,然后我们在修改前端页面的时候,每次修改后想直接按浏览器的刷新就可以刷新到最新修改的页面,而不用每次都重启项目。

只需要在yml配置文件中添加一些关闭静态页面模板的缓存即可:
如:使用了 Thymeleaf模板,那么在yml配置文件中添加这个 spring.thymeleaf.cache=false配置就可以了,然后 IDEA 需要再按 按Ctrl + F9来构建项目,就可以在静态页面冲加载。

28、springboot的静态模版(前端页面)重加载和 devtools开发者工具,springboot,spring boot,前端,后端

如果使用开发者工具 spring-boot-devtools ,那么就需要上图那样在yml关闭模板缓存了,这个devtools 已经帮我们完成这些功能了。

直接添加devtools依赖就可以了,就不用在yml配置文件里面关闭模板缓存了。
但是都需要按 Ctrl + F9 来构建一下
28、springboot的静态模版(前端页面)重加载和 devtools开发者工具,springboot,spring boot,前端,后端

★ 开发者工具

spring-boot-devtools开发者工具具有如下功能:

- 模板自动重加载, 默认就关闭静态的缓存。也就是上面的设置完全可以省略。

- 应用快速重启

- 浏览器实时重加载(LiveReload)

- 各种开发时配置属性(如前面介绍的关闭模板缓存等)

- 将Web日志组(包括Spring MVC和Spring WebFlux)设为DEBUG级别

——上面这些功能,基本上都是为Spring Boot热插拔在提供支持。

★ 开发者工具的注意点

▲ 项目只要添加devtools依赖包,则自动启用devtools开发者工具。

▲ 如果以java -jar xxx.jar的形式运行Spring Boot项目,则默认被当成产品场。

  此时即使项目中包含devtools依赖包,也会自动关闭devtools开发者工具。

  可通过如下系统属性强行启用开发者工具:
  -Dspring.devtools.restart.enabled=true

▲ 为避免安全隐患,打包Spring Boot应用时会自动排除devtools工具。文章来源地址https://www.toymoban.com/news/detail-654698.html

  如要远程使用devtools功能,这时就需要强制将devtools工具打包进去,

  - 对于Maven构建工具,则需将excludeDevtools属性设为false即可

  - 对于Gradle工具,则需要指定包含developmentOnly依赖库。

到了这里,关于28、springboot的静态模版(前端页面)重加载和 devtools开发者工具的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 浏览器开发者工具DevTools中提升效率的小技巧

    DevTools 非常强大除了常用的查看元素,进行断点调试或许还有些你不知道的小技巧,小功能。如可以快速的重新发送请求,快速选择元素,在控制台中使用npm库等,让你能够更加高效的进行开发。不定时更新~ 使用快捷键能快速打开 DevTools,但不同的快捷键可以打开不同的

    2024年04月28日
    浏览(65)
  • 前端静态登录页面实现

    2024年02月14日
    浏览(46)
  • vue项目 前端加前缀(包括页面及静态资源)

    具体步骤 (1)更改router模式,添加前缀 位置:router文件夹下面的index.js (2)实现静态文件加前缀 位置:vue.config.js 静态资源css,js之类的的src或href引用位置会加上这个前缀,会体现在打包后的index.html文件内容 例如 (3)nignx配置

    2024年02月04日
    浏览(54)
  • 后端请求转发与请求重定对于向前端静态资源的加载影响

    虽然在实际开发过程中用的很少,这里记录一下遇到的问题。因为有一次导致前端CSS样式文件无法加载,最后找出BUG的步骤 后端代码 前端代码 前端文件路径 URL变化:127.0.0.1:8080/test/hello 不改变 发现前端样式已经丢失,html加载的css,js和图片资源出现了404:因为转发依靠的是

    2024年02月21日
    浏览(58)
  • 前端面试:【性能优化】页面加载性能、渲染性能、资源优化

    嗨,亲爱的前端开发者!在今天的Web世界中,用户期望页面加载速度快、交互流畅。因此,前端性能优化成为了至关重要的任务。本文将探讨三个关键方面的性能优化:页面加载性能、渲染性能以及资源优化,以帮助你构建更快速、响应更快的Web应用程序。 1. 页面加载性能:

    2024年02月11日
    浏览(54)
  • B048-cms03-前端首页文章列表展示 页面静态化

    抽取公共资源 抽取导航条和侧边栏 1.新建/WEB-INF/views/common文件夹 2.新建header.jsp和leftMenu.jsp 3.引入Index.jsp和Article.jsp 抽取静态资源 新建topStatic.jsp文件 引入Index.jsp和Article.jsp 新建buttomStatic.jsp 引入Index.jsp和Article.jsp 抽取js文件 在WEB-INF外部/WebContent/static/system/js下新建article文件夹

    2024年02月11日
    浏览(48)
  • HTML+CSS+ElementUI搭建个人博客静态页面展示(纯前端)

    登录页面 门户页面 博客页面 技术选取: HTML/CSS + VUE2 + ElementUI(Version - 2.15.14) 编程软件: VSCode 环境配置与搭建 安装指令 ELement 在 node 下载后,会发现 node_modules/element-ui 文件夹,直接复制到本地,之后按照文件路径引用并配置 [1]ElementUI - 2.15.14官网 [2] 获取图片网址 [3] 登录页面获

    2024年02月05日
    浏览(87)
  • 10SpringBoot 静态资源访问 11Springboot的默认配置文件和外部配置文件及加载顺序

            做web开发的时候,我们往往会有很多静态资源,如html、图片、css等。那如何向前端返回静态资源呢?        以前做过web开发的同学应该知道,我们以前创建的web工程下面会有一个webapp的目录,我们只要把静态资源放在该目录下就可以直接访问。        但是,基

    2023年04月08日
    浏览(59)
  • 前端页面点击刷新-触发vue生命周期加载最新数据

    需求背景:layout布局,页面头部通过定时器获取后端消息的伪消息通知功能,在点击消息时获取所有消息总数并且刷新页面,以便触发vue的生命周期重新获取所有消息,消息展示在content中。  要触发页面刷新,可以使用vue路由的router.push方法,添加一个动态的query参数,可以

    2024年02月21日
    浏览(53)
  • 在Chrome(谷歌浏览器)中安装Vue.js devtools开发者工具及解决Vue.js not detected报错

    提示:先安装谷歌助手的原因是:不安装谷歌助手无法打开谷歌应用商店,导致无法下载Vue.js devtools开发者工具。

    2024年02月15日
    浏览(71)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包