1
resposta

Cache no React JS

Boa Tarde.

Tenho uma aplicaçāo em ambiente de homolog, e para executá-la, executamos o comando npm run build no deploy automático.

O problema é que o sistema nāo atualiza automaticamente o cache, tendo de forçar o recarregamento da página para que as alterações possuam efeito. Como posso proceder?

1 resposta

Olá.

Você pode usar uma lib chamada renamer e colcoar ela no seu processo de builder, ela irá colocar um hash no final do seus arquivos JS e CSS que permitirá que eles sejam novos sem guardar cache toda vez que você fizer um novo deploy. Primeiro instale ela como dependência do seu projeto:

npm install --save-dev renamer

Depois altere o seu npm script pra usar ela no processo de builder. Ficará algo assim:

"build-rename": "npm run build-rename-js && npm run build-rename-css" && npm run seu-processo-de-builder,
"build-rename-js": "renamer --regex --find 'main\\.[^\\.]+\\.js' --replace 'main.js' build/static/js/*.js",
"build-rename-css": "renamer --regex --find 'main\\.[^\\.]+\\.css' --replace 'main.css' build/static/css/*.css"

Você pode ver mais exemplos de como usar o renamer na documentação dele na npmjs: https://www.npmjs.com/package/renamer