使用CRA React进行缓存清除 [英] Cache busting with CRA React
问题描述
当我更新站点时，运行npm run build并将新文件上传到服务器，但我仍在查找站点的旧版本。
When I updated my site, run npm run build and upload the new files to the server I am still looking the old version of my site.
在没有React的情况下，我可以看到带有缓存清除功能的网站的新版本。我这样做：
Without React, I can see the new version of my site with cache-busting. I do this:
上一个文件
<link rel="stylesheet" href="/css/styles.css">
新文件
<link rel="stylesheet" href="/css/styles.css?abcde">
我该怎么做或通过create react app实现缓存清除？
How can I do something like this or to achieve cache busting with create react app?
在GitHub上有很多关于create react app的线程，但是没有人给出正确/简单的答案。
There are many threads in the GitHub of create react app about this but no one has a proper/simple answer.
推荐答案
编辑：现在，默认情况下，create-react-app v2的服务工作者默认处于禁用状态
create-react-app v2 now have the service worker disabled by default
此答案仅适用于CRA v1
这可能是因为您的网络工作者。
This is probably because of your web worker.
如果您查看index.js文件，您将看到
If you look into your index.js file you can see
registerServiceWorker();
从来没有想过它做了什么吗？如果我们查看从中导入的文件，就可以看到
Never wondered what it did? If we take a look at the file it got imported from we can see
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read {URL}
// This link also includes instructions on opting out of this behavior.
如果要删除网络工作者，请不要删除该行。
If you want to delete the web worker, don't just delete the line. Import unregister and call it in your file instead of the register.
import { unregister } from './registerServiceWorker';
然后致电
unregister()
PS取消注册后，至少需要刷新一次才能使它生效
P.S. When you unregister, it will take at least one refresh to make it work
这篇关于使用CRA React进行缓存清除的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
