我的页面在我修改样式后无法加载新样式。

huangapple go评论57阅读模式
英文:

My page doesnt load new styles, after I changed them

问题

I'm having a problem inside wordpress custom-theme, where I enqueued style, but it doesn't seem to work without linking it in the index.php , when I edit the css I have to shift+f5 to see the changes, basically clearing the browser cache. My question is if there is any way to do this automatically.

我的页面在我修改样式后无法加载新样式。

Oh and also I forgot to mention, that I'm using WinSCP for reaching the FTP server of my wordpress website.

I tried to do the auto-clear cache using php, but with many attempts it didn't do anything or even better, prevented me from manually clearing the cache.

我的页面在我修改样式后无法加载新样式。
我的页面在我修改样式后无法加载新样式。
我的页面在我修改样式后无法加载新样式。
我的页面在我修改样式后无法加载新样式。

What I&#39m hoping for is 2 things: 1. My enqueued styles would work without linking them in html
2. The automatic clear-cache upon updating code using php

英文:

I'm having a problem inside wordpress custom-theme, where I enqueued style, but it doesn't seem to work without linking it in the index.php , when I edit the css I have to shift+f5 to see the changes, basically clearing the browser cache. My question is if there is any way to do this automatically.
我的页面在我修改样式后无法加载新样式。

Oh and also I forgot to mention, that I'm using WinSCP for reaching the FTP server of my wordpress website.

I tried to do the auto-clear cache using php, but with many attempts it didn't do anything or even better, prevented me from manually clearing the cache.
我的页面在我修改样式后无法加载新样式。
我的页面在我修改样式后无法加载新样式。
我的页面在我修改样式后无法加载新样式。
我的页面在我修改样式后无法加载新样式。

What I'm hoping for is 2 things: 1. My enqueued styles would work without linking them in html
2. The automatic clear-cache upon updating code using php

答案1

得分: 1

TL;DR 在开发 CSS 时,经常使用 Shift-F5 并在开发任何内容时禁用网站上的任何缓存插件。

Shift-F5 清除您的浏览器缓存。该缓存保存诸如您的 CSS 文件之类的对象,因此当用户在您的网站页面之间导航,甚至在以后返回到您的网站时,他们的浏览器就不必重新下载这些文件。这意味着 CSS 文件是“粘性”的。在开发 CSS 时使用 Shift-F5 是网页开发的固有部分。没有可靠的方法可以自动清除 CSS 对象。

您的示例代码清除了一些缓存插件提供的服务器端缓存。要避免这样做。相反,在处理 CSS 时禁用那种缓存。

WP_CACHE 阻止 WordPress 的持久对象缓存的使用,它处理的数据类型与 CSS 完全不同。要让其发挥作用,需要在 wp-config.php 中定义它,因为持久对象缓存的实现方式非常复杂(通过早期加载的“插件”模块)。如果“持久对象缓存”这些词对您毫无意义,那就不要对 WP_CACHE 进行任何操作。

最后,您的 header() 调用将标题放在您生成的 HTML 页面上,而不是您的 CSS、JavaScript 或媒体对象上。因此,它们并不适用于防止浏览器缓存您的 CSS。

在典型的 WordPress / PHP / Apache 网站中,WordPress 从不触及 CSS 的内容:浏览器直接从 Web 服务器请求这些文件。一些缓存插件会调整 CSS、JavaScript 和媒体的缓存标头。它们通过将 Web 服务器指令插入到您网站的.htaccess文件中来实现。在开发 CSS 时禁用这些插件有助于避免缓存混淆。

您的浏览器开发工具的“网络”选项卡会告诉您浏览器从缓存中检索了哪些对象。这对开发可缓存对象非常有帮助。

英文:

TL;DR Use Shift-F5 liberally when developing css, and disable any caching plugins on your site when developing anything.

Shift-F5 clears your browser cache. That cache holds objects like your css files, so your users' browsers don't have to download them again as they navigate from page to page on your site, or even when they return to your site later. That means css files are sticky. Using shift-F5 while working on your css is an inherent part of web development. There's no reliable way to clear css objects automatically.

Your sample code clears the server-side caches provided by a couple of caching plugins. Avoid that. Instead disable that kind of cache while hammering out your css.

WP_CACHE prevents the use of WordPress's persistent object cache, which handles entirely different kinds of data than CSS. It needs to be defined in wp-config.php to be useful, due to the arcane way persistent object caches are implemented (via an early-loading "drop-in" module). If the words "persistent object cache" don't mean anything to you, don't do anything with WP_CACHE.

Finally, your header() calls put headers on the HTML page you're generating, not not your css, javascript, or media objects. So, they're not useful for preventing browsers from caching your css.

In a typical WordPress / php / apache web server site, WordPress never touches the content of css: the browser requests those files directly from the web server. Some caching plugins adjust the caching headers on css, javascript and media. They do that by inserting web server directives into your site's .htaccess file. Disabling those plugins during css development helps avoid caching confusion.

Your browser devtools Network tab tells you which objects the browser retrieved from cache. It's super helpful when developing with cacheable objects.

huangapple
  • 本文由 发表于 2023年2月19日 19:48:08
  • 转载请务必保留本文链接:https://go.coder-hub.com/75499919.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定