var Component=(()=>{var h=Object.create;var c=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty;var g=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),u=(n,e)=>{for(var o in e)c(n,o,{get:e[o],enumerable:!0})},a=(n,e,o,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of p(e))!m.call(n,r)&&r!==o&&c(n,r,{get:()=>e[r],enumerable:!(t=F(e,r))||t.enumerable});return n};var f=(n,e,o)=>(o=n!=null?h(y(n)):{},a(e||!n||!n.__esModule?c(o,"default",{value:n,enumerable:!0}):o,n)),C=n=>a(c({},"__esModule",{value:!0}),n);var i=g((S,s)=>{s.exports=_jsx_runtime});var x={};u(x,{default:()=>w,frontmatter:()=>b});var l=f(i()),b={title:"React CRA and SEO 2019",description:"I found React's CRA (Create React App) to be interesting when it comes to SEO/SMO and getting it to work with..",date:"2019-08-31"};function d(n){let e=Object.assign({p:"p",em:"em",a:"a",code:"code",img:"img",div:"div",pre:"pre",span:"span",h4:"h4"},n.components);return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(e.p,{children:(0,l.jsx)(e.em,{children:"Warning this is pretty old. You should probably use NextJS and leave CRA behind."})}),` `,(0,l.jsxs)(e.p,{children:["I found React's CRA (Create React App) to be interesting when it comes to SEO/SMO and getting it to work with ",(0,l.jsx)(e.a,{href:"https://search.google.com/search-console/about",children:"Search Console"})," and ",(0,l.jsx)(e.a,{href:"https://analytics.google.com/analytics/web/",children:"Analytics"}),` for individual pages. For a starting point you'll want to make sure you're using the `,(0,l.jsx)(e.code,{children:"create-react-app"})," setup for the following guide, Parcel and Webpack have similar ways of accomplishing the following, however for the sake of time we will use create-react-app."]}),` `,(0,l.jsx)(e.p,{children:(0,l.jsx)(e.img,{src:"https://res.cloudinary.com/dcjkklmlz/image/upload/v1693963756/robSturcke/IMG_0226_cmfrub.jpg",alt:"What"})}),` `,(0,l.jsxs)(e.p,{children:["If you haven't done so already, check out ",(0,l.jsxs)(e.a,{href:"https://github.com/nfl/react-helmet",children:["NFL's ",(0,l.jsx)(e.code,{children:"react-helmet"})]})," package for getting the DOM to recognize your individual page ",(0,l.jsx)(e.code,{children:"title"}),", ",(0,l.jsx)(e.code,{children:"description"})," tags etc."]}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{style:{backgroundColor:"#282A36"},tabIndex:"0","data-language":"jsx","data-theme":"default",children:(0,l.jsx)(e.code,{"data-language":"jsx","data-theme":"default",children:(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" { Helmet } "}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"react-helmet"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"})]})})})}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{style:{backgroundColor:"#282A36"},tabIndex:"0","data-language":"jsx","data-theme":"default",children:(0,l.jsxs)(e.code,{"data-language":"jsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#8BE9FD",fontStyle:"italic"},children:"Helmet"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"title"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:">ABOUT PAGE"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:""})]})]})})}),` `,(0,l.jsxs)(e.p,{children:["Now we need to install ",(0,l.jsx)(e.code,{children:"react-snap"})," to enable SEO and SMO for our React app:"]}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{style:{backgroundColor:"#282A36"},tabIndex:"0","data-language":"shell","data-theme":"default",children:(0,l.jsx)(e.code,{"data-language":"shell","data-theme":"default",children:(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#50FA7B"},children:"npm"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"i"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#BD93F9"},children:"--dev"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"react-snap"})]})})})}),` `,(0,l.jsxs)(e.p,{children:["While that's installing, go into your ",(0,l.jsx)(e.code,{children:"package.json"})," and add the following to your scripts:"]}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{style:{backgroundColor:"#282A36"},tabIndex:"0","data-language":"json","data-theme":"default",children:(0,l.jsxs)(e.code,{"data-language":"json","data-theme":"default",children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"scripts"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:": {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#8BE9FE"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#8BE9FD"},children:"postbuild"}),(0,l.jsx)(e.span,{style:{color:"#8BE9FE"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"react-snap"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"}"})})]})})}),` `,(0,l.jsxs)(e.p,{children:["Then change your ",(0,l.jsx)(e.code,{children:"scr/index.js"})," imports for ",(0,l.jsx)(e.code,{children:"react-dom"})," and add the following for React 16+:"]}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{style:{backgroundColor:"#282A36"},tabIndex:"0","data-language":"jsx","data-theme":"default",children:(0,l.jsx)(e.code,{"data-language":"jsx","data-theme":"default",children:(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" { hydrate, render } "}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"react-dom"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"})]})})})}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{style:{backgroundColor:"#282A36"},tabIndex:"0","data-language":"jsx","data-theme":"default",children:(0,l.jsxs)(e.code,{"data-language":"jsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" rootElement "}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" document."}),(0,l.jsx)(e.span,{style:{color:"#50FA7B"},children:"getElementById"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"root"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:")"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"if"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" (rootElement."}),(0,l.jsx)(e.span,{style:{color:"#50FA7B"},children:"hasChildNodes"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"()) {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#50FA7B"},children:"hydrate"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"(<"}),(0,l.jsx)(e.span,{style:{color:"#8BE9FD",fontStyle:"italic"},children:"App"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" />, rootElement)"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"} "}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"else"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#50FA7B"},children:"render"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"(<"}),(0,l.jsx)(e.span,{style:{color:"#8BE9FD",fontStyle:"italic"},children:"App"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" />, rootElement)"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"}"})})]})})}),` `,(0,l.jsx)(e.p,{children:"Adding React Snap will prep your app for SEO and SMO, along with performance optimizations on loading times."}),` `,(0,l.jsxs)(e.p,{children:["Assuming you have your ",(0,l.jsx)(e.a,{href:"https://analytics.google.com/analytics/web/",children:"Analytics tags"})," in your ",(0,l.jsx)(e.a,{href:"https://github.com/robSturcke/seo_example/blob/master/public/index.html",children:(0,l.jsx)(e.code,{children:"public/index.html"})}),", you can move on to installing a few polyfills to help get your pages indexed. But first you need to install 2 packages:"]}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{style:{backgroundColor:"#282A36"},tabIndex:"0","data-language":"shell","data-theme":"default",children:(0,l.jsx)(e.code,{"data-language":"shell","data-theme":"default",children:(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#50FA7B"},children:"npm"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"i"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#BD93F9"},children:"--s"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"babel-polyfill"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"whatwg-fetch"})]})})})}),` `,(0,l.jsxs)(e.p,{children:["Once you've installed those packages, create a file in your ",(0,l.jsx)(e.code,{children:"config"})," directory called ",(0,l.jsx)(e.code,{children:"polyfill.js"}),", and fill in the following:"]}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{style:{backgroundColor:"#282A36"},tabIndex:"0","data-language":"js","data-theme":"default",children:(0,l.jsxs)(e.code,{"data-language":"js","data-theme":"default",children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#50FA7B"},children:"require"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"babel-polyfill"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:")"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#50FA7B"},children:"require"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"whatwg-fetch"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:")"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"if"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" (process.env."}),(0,l.jsx)(e.span,{style:{color:"#BD93F9"},children:"NODE_ENV"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"==="}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"test"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:") {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#50FA7B"},children:"require"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"raf"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:")."}),(0,l.jsx)(e.span,{style:{color:"#50FA7B"},children:"polyfill"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"(global)"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"}"})})]})})}),` `,(0,l.jsxs)(e.p,{children:["This ",(0,l.jsxs)(e.a,{href:"https://github.com/WoWAnalyzer/WoWAnalyzer/blob/2c67a970f8bd9026fa816d31201c42eb860fe2a3/config/polyfills.js#L1",children:["polyfill from ",(0,l.jsx)(e.code,{children:"WoWAnalyzer"})]})," uses ",(0,l.jsx)(e.code,{children:"babel-polyfill"})," and ",(0,l.jsx)(e.code,{children:"whatwg-fetch"})," and has tons of comments to give a great explanation for the polyfill service. [",(0,l.jsx)(e.a,{href:"https://www.reddit.com/r/reactjs/comments/825n75/google_doesnt_index_my_react_app/",children:"Reference to the source in comments of this Reddit thread."}),"]"]}),` `,(0,l.jsxs)(e.p,{children:["Now add the polyfill imports to the top of your ",(0,l.jsx)(e.code,{children:"index.js"})," to continue on."]}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{style:{backgroundColor:"#282A36"},tabIndex:"0","data-language":"jsx","data-theme":"default",children:(0,l.jsxs)(e.code,{"data-language":"jsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"babel-polyfill"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"./config/polyfills"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:"'"})]})]})})}),` `,(0,l.jsxs)(e.p,{children:["For the next step you could install yet another package, however I found that just writing out a ",(0,l.jsx)(e.code,{children:"sitemap.xml"})," file to put in the ",(0,l.jsx)(e.code,{children:"public"})," directory is simple enough to not require more dependencies."]}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{style:{backgroundColor:"#282A36"},tabIndex:"0","data-language":"xml","data-theme":"default",children:(0,l.jsxs)(e.code,{"data-language":"xml","data-theme":"default",children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:""})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"urlset"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"xmlns"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"http://www.sitemaps.org/schemas/sitemap/0.9"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"xmlns"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6",fontStyle:"italic"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"news"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"http://www.google.com/schemas/sitemap-news/0.9"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"xmlns"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6",fontStyle:"italic"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"xhtml"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"http://www.w3.org/1999/xhtml"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"xmlns"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6",fontStyle:"italic"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"mobile"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"http://www.google.com/schemas/sitemap-mobile/1.0"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"xmlns"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6",fontStyle:"italic"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"image"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"http://www.google.com/schemas/sitemap-image/1.1"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" "}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"xmlns"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6",fontStyle:"italic"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#50FA7B",fontStyle:"italic"},children:"video"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F1FA8C"},children:"http://www.google.com/schemas/sitemap-video/1.1"}),(0,l.jsx)(e.span,{style:{color:"#E9F284"},children:'"'}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"url"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"> <"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"loc"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:">https://www.some-react-example.com/ "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"url"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"> <"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"loc"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:">https://www.some-react-example.com/about "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"url"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"> <"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"loc"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:">https://www.some-react-example.com/random "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"url"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:"> <"}),(0,l.jsx)(e.span,{style:{color:"#FF79C6"},children:"loc"}),(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:">https://www.some-react-example.com/404 "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F8F8F2"},children:""})]})]})})}),` `,(0,l.jsxs)(e.h4,{id:"troubleshooting",children:[(0,l.jsx)(e.a,{className:"anchor",href:"#troubleshooting",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"Troubleshooting:"]}),` `,(0,l.jsxs)(e.p,{children:["If you're still having issues with your ",(0,l.jsx)(e.a,{href:"https://analytics.google.com/analytics/web/",children:"Analytics tags"}),", try deleting property then re-creating the property. Don't forget to add the new analytics ID to your ",(0,l.jsx)(e.a,{href:"https://github.com/robSturcke/seo_example/blob/master/public/index.html",children:(0,l.jsx)(e.code,{children:"public/index.html"})})," and run build a fresh ",(0,l.jsx)(e.code,{children:"build"}),"."]}),` `,(0,l.jsxs)(e.p,{children:["If Search Console isn't recognizing anything still, try installing ",(0,l.jsx)(e.a,{href:"https://github.com/facebook/create-react-app/tree/master/packages/react-app-polyfill",children:(0,l.jsx)(e.code,{children:"react-app-polyfill"})}),"."]}),` `,(0,l.jsxs)(e.p,{children:["I've also created a ",(0,l.jsxs)(e.a,{href:"https://github.com/robSturcke/seo_example",children:["Github repo ",(0,l.jsx)(e.code,{children:"example"})]})," for your reference."]})]})}function A(n={}){let{wrapper:e}=n.components||{};return e?(0,l.jsx)(e,Object.assign({},n,{children:(0,l.jsx)(d,n)})):d(n)}var w=A;return C(x);})(); ;return Component;

Posts

AI Terminal Productivity with Warp

React CRA and SEO 2019