{"id":3847,"date":"2016-04-21T01:49:47","date_gmt":"2016-04-21T01:49:47","guid":{"rendered":"http:\/\/www.garysieling.com\/blog\/?p=3847"},"modified":"2016-04-21T01:49:47","modified_gmt":"2016-04-21T01:49:47","slug":"react-cloudflare-bundle-js38-uncaught-invariant-violation-unable-find-element-id-18","status":"publish","type":"post","link":"https:\/\/www.garysieling.com\/blog\/react-cloudflare-bundle-js38-uncaught-invariant-violation-unable-find-element-id-18\/","title":{"rendered":"React and Cloudflare, &#8220;bundle.js:38 Uncaught Invariant Violation: Unable to find element with ID 18&#8221;"},"content":{"rendered":"<p>Running a server-side rendered application with CloudFlare in front, I have seen this error:<\/p>\n<pre>\nbundle.js:38 Uncaught Invariant Violation: Unable to find element with ID 18.\n<\/pre>\n<p>Noticeably, since I have several domains on the server, I can the app from non-Cloudflare domains and the app works.<\/p>\n<p>This is a somewhat confusing problem, because Cloudflare has several options that are relatively cryptic (caching is affected by the structure of the URL). They have a feature they call &#8220;Rocket Loader&#8221; which does not seem to be the culprit (although in future this may change).<\/p>\n<p>I believe you can fix this issue by doing two things:<\/p>\n<ul>\n<li>Disable HTML minification<\/li>\n<li>Reset the cache for the URL(s) affected<\/li>\n<\/ul>\n<p>React is currently incredibly sensitive to having it&#8217;s pages messed with, and this does not play well with Cloudflare always.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Fixing a common error in React that is actually caused by CloudFlare<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[9],"tags":[113,302,421,455],"aioseo_notices":[],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.garysieling.com\/blog\/wp-json\/wp\/v2\/posts\/3847"}],"collection":[{"href":"https:\/\/www.garysieling.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.garysieling.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.garysieling.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.garysieling.com\/blog\/wp-json\/wp\/v2\/comments?post=3847"}],"version-history":[{"count":0,"href":"https:\/\/www.garysieling.com\/blog\/wp-json\/wp\/v2\/posts\/3847\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.garysieling.com\/blog\/wp-json\/wp\/v2\/media?parent=3847"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.garysieling.com\/blog\/wp-json\/wp\/v2\/categories?post=3847"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.garysieling.com\/blog\/wp-json\/wp\/v2\/tags?post=3847"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}