{"componentChunkName":"component---src-templates-docs-js","path":"/docs/javascript-environment-requirements.html","result":{"data":{"markdownRemark":{"html":"<p>O React 16 depende de uma coleção de tipos <a href=\"https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Map\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Map</a> e <a href=\"https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Set\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Set</a>. Se você precisa manter o suporte para navegadores antigos e dispositivos que podem não disponibilizar esses recursos (ex. IE &#x3C; 11) ou tenham uma implementação que não seja padrão (ex. IE 11), considere incluir um polyfill global no bundle de sua aplicação, tal como o pacote <a href=\"https://github.com/zloirock/core-js\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">core-js</a>.</p>\n<p>Um ambiente com polyfill incluido para o React 16, usando core-js para prestar suporte a navegadores antigos, pode parecer assim:</p>\n<div class=\"gatsby-highlight\" data-language=\"jsx\"><pre class=\"gatsby-code-jsx\"><code class=\"gatsby-code-jsx\"><span class=\"token keyword\">import</span> <span class=\"token string\">'core-js/es/map'</span><span class=\"token punctuation\">;</span>\n<span class=\"token keyword\">import</span> <span class=\"token string\">'core-js/es/set'</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token keyword\">import</span> React <span class=\"token keyword\">from</span> <span class=\"token string\">'react'</span><span class=\"token punctuation\">;</span>\n<span class=\"token keyword\">import</span> ReactDOM <span class=\"token keyword\">from</span> <span class=\"token string\">'react-dom'</span><span class=\"token punctuation\">;</span>\n\nReactDOM<span class=\"token punctuation\">.</span><span class=\"token function\">render</span><span class=\"token punctuation\">(</span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span><span class=\"token punctuation\">></span></span><span class=\"token plain-text\">Olá, mundo!</span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">></span></span><span class=\"token punctuation\">,</span>\n  document<span class=\"token punctuation\">.</span><span class=\"token function\">getElementById</span><span class=\"token punctuation\">(</span><span class=\"token string\">'root'</span><span class=\"token punctuation\">)</span>\n<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span></code></pre></div>\n<p>O React também depende da função <code class=\"gatsby-code-text\">requestAnimationFrame</code> (mesmo em ambiente de teste).<br>\nVocê pode usar o pacote <a href=\"https://www.npmjs.com/package/raf\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">raf</a> como substituto para a função <code class=\"gatsby-code-text\">requestAnimationFrame</code>:</p>\n<div class=\"gatsby-highlight\" data-language=\"jsx\"><pre class=\"gatsby-code-jsx\"><code class=\"gatsby-code-jsx\"><span class=\"token keyword\">import</span> <span class=\"token string\">'raf/polyfill'</span><span class=\"token punctuation\">;</span></code></pre></div>","frontmatter":{"title":"Requisitos de Ambiente JavaScript","next":null,"prev":null},"fields":{"path":"content/docs/reference-javascript-environment-requirements.md","slug":"docs/javascript-environment-requirements.html"}}},"pageContext":{"slug":"docs/javascript-environment-requirements.html"}},"staticQueryHashes":[]}