{"id":46032,"library":"react-cache-refresh","title":"react-cache-refresh","description":"A modern, lightweight React utility (v1.0.5) that automatically detects new app versions and clears browser caches (Service Worker caches, HTTP caches) to ensure users always receive the latest application version. It works by comparing a version string from a public meta.json with the current app version, and on mismatch clears caches and reloads. Key differentiators: built-in reload cooldown to prevent infinite loops, custom metadata path support, error resilience, and zero dependencies beyond React 18/19 peer dependency. Maintained with occasional releases.","status":"active","version":"1.0.5","language":"javascript","source_language":"en","source_url":"https://github.com/aravindkarteekr/react-cache-refresh","tags":["javascript","react","cache","cache-clear","cache-buster","cache-cleaner","cache-refresh","react-cache","react-cache-refresh","typescript"],"install":[{"cmd":"npm install react-cache-refresh","lang":"bash","label":"npm"},{"cmd":"yarn add react-cache-refresh","lang":"bash","label":"yarn"},{"cmd":"pnpm add react-cache-refresh","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency required for JSX and hooks.","package":"react","optional":false}],"imports":[{"note":"Named export, not default.","wrong":"import CacheBuster from 'react-cache-refresh'","symbol":"CacheBuster","correct":"import { CacheBuster } from 'react-cache-refresh'"},{"note":"Utility function is exported from a separate subpath: 'react-cache-refresh/utils'.","wrong":"import { clearAllCaches } from 'react-cache-refresh'","symbol":"clearAllCaches","correct":"import { clearAllCaches } from 'react-cache-refresh/utils'"}],"quickstart":{"code":"// 1. Install: npm install react-cache-refresh\n// 2. Create public/meta.json: { \"version\": \"1.0.0\" }\n// 3. Wrap your app with CacheBuster\nimport React from 'react';\nimport { CacheBuster } from 'react-cache-refresh';\nimport App from './App';\n\nconst VERSION = '1.0.0';\n\nfunction Root() {\n  return (\n    <CacheBuster\n      currentAppVersion={VERSION}\n      loadingComponent={<div>Checking for updates...</div>}\n    >\n      <App />\n    </CacheBuster>\n  );\n}\n\nexport default Root;","lang":"typescript","description":"Shows basic setup: create meta.json, wrap app with CacheBuster component, pass current version string."},"warnings":[{"fix":"Ensure meta.json is in public/ or set metaJsonPath prop to the correct URL path.","message":"The meta.json file must be placed in the public directory (or static serving directory) to be accessible at the root path. If placed elsewhere, use the metaJsonPath prop.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use a consistent versioning scheme and automate version bumps (e.g., CI pipeline).","message":"The currentAppVersion prop must exactly match the version string in meta.json for no cache refresh to occur. Version mismatches (e.g., '1.0.0' vs '1.0.0.0') will trigger a reload.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use import { clearAllCaches } from 'react-cache-refresh/utils'.","message":"clearAllCaches is exported from 'react-cache-refresh/utils', not from the main entry. Importing from the wrong path may cause build errors in bundlers that don't resolve subpath exports.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use import syntax. If you need CJS, consider transpiling with a bundler like webpack or esbuild.","message":"The package is ESM-only (no CommonJS). Using require('react-cache-refresh') will fail in Node.js environments (e.g., SSR). Only import syntax works.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"search_vec":"'18/19':80 'alway':29 'app':15,49 'applic':33 'automat':12 'beyond':78 'browser':19 'built':61 'built-in':60 'buster':95 'cach':3,20,23,25,55,89,91,94,97,100,104,107 'cache-bust':93 'cache-clean':96 'cache-clear':90 'cache-refresh':99 'cleaner':98 'clear':18,54,92 'compar':38 'cooldown':64 'current':48 'custom':69 'depend':77,82 'detect':13 'differenti':59 'ensur':27 'error':73 'http':24 'infinit':67 'javascript':87 'key':58 'latest':32 'lightweight':7 'loop':68 'maintain':83 'meta.json':45 'metadata':70 'mismatch':53 'modern':6 'new':14 'occasion':85 'path':71 'peer':81 'prevent':66 'public':44 'react':2,8,79,88,103,106 'react-cach':102 'react-cache-refresh':1,105 'receiv':30 'refresh':4,101,108 'releas':86 'reload':57,63 'resili':74 'servic':21 'string':41 'support':72 'typescript':109 'user':28 'util':9 'v1.0.5':10 'version':16,34,40,50 'work':36 'worker':22 'zero':76","created_at":"2026-06-07T12:57:57.158921+00:00","updated_at":"2026-06-07T12:57:57.158921+00:00","problems":[{"fix":"import { clearAllCaches } from 'react-cache-refresh/utils'","cause":"Importing clearAllCaches from the main export instead of 'react-cache-refresh/utils'.","error":"Attempted import error: 'clearAllCaches' is not exported from 'react-cache-refresh'."},{"fix":"Install the package with npm install react-cache-refresh and use import instead of require.","cause":"The package is ESM-only and require() is used, or the package is not installed.","error":"Module not found: Error: Can't resolve 'react-cache-refresh' in '/path/to/project'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://github.com/aravindkarteekr/react-cache-refresh#readme","github":"https://github.com/aravindkarteekr/react-cache-refresh","docs":null,"changelog":null,"pypi":null,"npm":"react-cache-refresh","openapi_spec":null,"status_page":null,"smithery":null,"categories":["testing"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-07","next_check":"2026-09-05","install_tag":null}}