{"componentChunkName":"component---src-templates-docs-js","path":"/docs/javascript-environment-requirements.html","result":{"data":{"markdownRemark":{"html":"<p>React 16 залежить від типів колекцій <a href=\"https://developer.mozilla.org/uk/docs/Web/JavaScript/Reference/Global_Objects/Map\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Map</a> та <a href=\"https://developer.mozilla.org/uk/docs/Web/JavaScript/Reference/Global_Objects/Set\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Set</a>. Якщо ви підтримуєте старі браузери та пристрої, що не можуть надати їх (напр. IE &#x3C; 11) або мають певні невідповідності у реалізації (напр. IE 11), подумайте про додавання глобального поліфілу (polyfill) у ваш додаток, наприклад, <a href=\"https://github.com/zloirock/core-js\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">core-js</a> чи <a href=\"https://babeljs.io/docs/usage/polyfill/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">babel-polyfill</a>.</p>\n<p>JavaScript середовище з поліфілом для React 16, що використовує core-js для підтримки старих браузерів може виглядати так:</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\">Привіт, світ!</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>React також залежить від <code class=\"gatsby-code-text\">requestAnimationFrame</code> (навіть у тестових середовищах).<br>\nВи можете використовувати пакунок <a href=\"https://www.npmjs.com/package/raf\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">raf</a> для підключення <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":"Вимоги до 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":[]}