Package Exports

react-seo-component

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-seo-component) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

A `react-seo-component`

bundlephobia min bundlephobia minzip

Use it for adding canonical links, metadata and OpenGraph information to your react projects!

Use it!

Install it from npm!

yarn add react-seo-component

If you are using it with Gatsby you will need to install gatsby-plugin-react-helmet to have the meta tags generated at build time.

Examples:

For an index page:

<SEO
  title={title}
  titleTemplate={siteName}
  description={description || 'nothin’'}
  image={image}
  pathname={siteUrl}
  siteLanguage={siteLanguage}
  siteLocale={siteLocale}
  twitterUsername={twitterUsername}
/>

For a blog post:

<SEO
  title={title}
  titleTemplate={siteName}
  description={description}
  image={image}
  pathname={siteUrlPlusSlug}
  siteLanguage={siteLanguage}
  siteLocale={siteLocale}
  twitterUsername={twitterUsername}
  author={authorName}
  article={true}
  publishedDate={createdDate}
  modifiedDate={updatedDate}
/>

Dependencies

Presumes you already have the following installed:

prop-types
react
react-helmet

Props

Prop	Type	Default
title	Page title	''
titleTemplate	Page Title + Site title	''
description	Page description	''
pathname	Full Page URL	''
article	`article` or `website`	`website`
image	Full image URL	''
siteLanguage	Content Language	`en`
siteLocale	Content Locale	`en_gb`
twitterUsername	can be empty	''
author	can not be empty	'J Doe'
datePublished	ISO date string	`Date.now()`
dateModified	ISO date string	`Date.now()`

Thanks

Thanks to @LekoArts for the initial components detailed in his Gatsby Prismic starter.

Resources

https://medium.com/recraftrelic/building-a-react-component-as-a-npm-module-18308d4ccde9

https://github.com/recraftrelic/dummy-react-npm-module/blob/master/package.json

react-seo-component