Switching to eslint parser to babel-eslint

.eslintrc.json

@@ -1,4 +1,14 @@
 {
+  "parser": "babel-eslint",
+  "parserOptions": {
+    "ecmaVersion": 6,
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "jsx": true,
+      "modules": true,
+      "experimentalObjectRestSpread": true
+    }
+  },
   "extends": ["airbnb", "prettier"],
   "plugins": ["react", "jsx-a11y", "import"],
   "rules": {

data/SiteConfig.js

@@ -4,12 +4,13 @@ module.exports = {
   blogAuthorId: "casper", // The default and fallback author ID used for blog posts without a defined author.
   siteTitle: "Gatsby Casper Starter", // Site title.
   siteTitleAlt: "GatsbyJS Casper Theme Starter", // Alternative site title for SEO.
-  siteLogo: "https://raw.githubusercontent.com/gatsbyjs/gatsby/master/www/static/android-chrome-512x512.png", // Logo used for SEO and manifest. e.g. "/logos/logo-1024.png",
+  siteLogo:
+    "https://raw.githubusercontent.com/gatsbyjs/gatsby/master/www/static/android-chrome-512x512.png", // Logo used for SEO and manifest. e.g. "/logos/logo-1024.png",
   siteUrl: "https://haysclark.github.io", // Domain of your website without pathPrefix.
   pathPrefix: "/gatsby-starter-casper", // Prefixes all links. For cases when deployed to example.github.io/gatsby-starter-casper/.
   siteDescription:
     "A Casper themed GatsbyJS stater based on the Advanced Starter.", // Website description used for RSS feeds/meta description tag.
-  siteCover: "https://unsplash.it/1280/500/?random?gatsby-starter-casper", // optional, the cover image used in header for home page. e.g: "/images/blog-cover.jpg",
+  siteCover: "https://unsplash.it/1280/500/?random?gatsby-starter-casper", // Optional, the cover image used in header for home page. e.g: "/images/blog-cover.jpg",
   siteNavigation: true, // If navigation is enabled the Menu button will be visible
   siteRss: "/rss.xml", // Path to the RSS file.
   siteRssAuthor: "Casper User", // The author name used in the RSS file
@@ -42,7 +43,7 @@ module.exports = {
   ],
   // Copyright string for the footer of the website and RSS feed.
   copyright: {
-    label: "Gatsby Casper Starter" // label used before the year
+    label: "Gatsby Casper Starter" // Label used before the year
     // year: "2018" // optional, set specific copyright year or range of years, defaults to current year
     // url: "https://www.gatsbyjs.org/" // optional, set link address of copyright, defaults to site root
   },

gatsby-node.js

@@ -1,7 +1,7 @@
 const path = require("path");
 const _ = require("lodash");
 const webpackLodashPlugin = require("lodash-webpack-plugin");
-const config = require("./data/SiteConfig");
+const siteConfig = require("./data/SiteConfig");
 const {
   createPaginationPages,
   createLinkedPages
@@ -85,7 +85,7 @@ exports.createPages = ({ graphql, boundActionCreators }) => {
           createPage,
           edges: result.data.allMarkdownRemark.edges,
           component: indexPage,
-          limit: config.sitePaginationLimit
+          limit: siteConfig.sitePaginationLimit
         });
 
         // Creates Posts
@@ -106,7 +106,7 @@ exports.createPages = ({ graphql, boundActionCreators }) => {
         const tagMap = new Map();
         const categorySet = new Set();
         const authorSet = new Set();
-        authorSet.add(config.blogAuthorId);
+        authorSet.add(siteConfig.blogAuthorId);
 
         result.data.allMarkdownRemark.edges.forEach(edge => {
           if (edge.node.frontmatter.tags) {
@@ -138,7 +138,7 @@ exports.createPages = ({ graphql, boundActionCreators }) => {
             edges: tagMap.get(tag),
             component: tagPage,
             pathFormatter: tagFormatter(tag),
-            limit: config.sitePaginationLimit,
+            limit: siteConfig.sitePaginationLimit,
             context: {
               tag
             }

package.json

@@ -4,6 +4,7 @@
   "version": "1.0.0",
   "author": "Hays Clark <hays.clark@gmail.com>",
   "dependencies": {
+    "babel-eslint": "^8.1.2",
     "babel-plugin-lodash": "^3.2.11",
     "classnames": "^2.2.5",
     "gatsby": "^1.9.130",

src/components/PostShare/PostShare.jsx

@@ -5,13 +5,13 @@ import "./PostShare.css";
 const formatSiteUrl = (siteUrl, pathPrefix, path) =>
   siteUrl + (pathPrefix === "/" ? "" : pathPrefix) + path;
 
-const getCover = post => {
-  const { cover } = post;
-  if (cover && cover.childImageSharp && cover.childImageSharp.original) {
-    return cover.childImageSharp.original.src;
-  }
-  return "";
-};
+// const getCover = post => {
+//   const { cover } = post;
+//   if (cover && cover.childImageSharp && cover.childImageSharp.original) {
+//     return cover.childImageSharp.original.src;
+//   }
+//   return "";
+// };
 
 class PostShare extends React.Component {
   render() {

src/templates/author.jsx

@@ -92,10 +92,10 @@ class AuthorTemplate extends React.Component {
           {/* PostListing component renders all the posts */}
           <PostListing postEdges={postEdges} postAuthors={authorsEdges} />
 
-          {/*Social information here*/}
+          {/* Social information here */}
           <SocialMediaIcons urls={getAuthor().socialUrls} />
 
-          {/*The tiny footer at the very bottom*/}
+          {/* The tiny footer at the very bottom */}
           <Footer
             copyright={config.copyright}
             promoteGatsby={config.promoteGatsby}
@@ -106,7 +106,7 @@ class AuthorTemplate extends React.Component {
   }
 }
 
-/* eslint no-undef: "off"*/
+/* eslint no-undef: "off" */
 export const pageQuery = graphql`
   query AuthorPage($author: String) {
     allMarkdownRemark(

src/templates/index.jsx

@@ -67,7 +67,7 @@ class IndexTemplate extends React.Component {
         <SiteWrapper>
           {/* All the main content gets inserted here */}
           <div className="home-template">
-            {/*The big featured header*/}
+            {/* The big featured header */}
             <MainHeader cover={config.siteCover}>
               <MainNav overlay={config.siteCover}>
                 <BlogLogo logo={config.siteLogo} title={config.siteTitle} />
@@ -90,8 +90,8 @@ class IndexTemplate extends React.Component {
                 className="scroll-down icon-arrow-left"
                 to="content"
                 data-offset="-45"
-                spy={true}
-                smooth={true}
+                spy
+                smooth
                 duration={500}
               >
                 <span className="hidden">Scroll Down</span>
@@ -111,7 +111,7 @@ class IndexTemplate extends React.Component {
             </PaginatedContent>
           </div>
 
-          {/*The tiny footer at the very bottom*/}
+          {/* The tiny footer at the very bottom */}
           <Footer
             copyright={config.copyright}
             promoteGatsby={config.promoteGatsby}
@@ -122,7 +122,7 @@ class IndexTemplate extends React.Component {
   }
 }
 
-/* eslint no-undef: "off"*/
+/* eslint no-undef: "off" */
 export const pageQuery = graphql`
   query IndexQuery {
     allMarkdownRemark(

src/templates/post.jsx

@@ -69,11 +69,11 @@ class PostTemplate extends React.Component {
       config.blogAuthorId
     );
 
-    const formatReadNext = data => ({
-      path: data.fields.slug,
-      title: data.frontmatter.title,
-      cover: data.frontmatter.cover,
-      excerpt: data.excerpt
+    const formatReadNext = value => ({
+      path: value.fields.slug,
+      title: value.frontmatter.title,
+      cover: value.frontmatter.cover,
+      excerpt: value.excerpt
     });
     const getNextData = () => (next ? formatReadNext(data.next) : null);
     const getPrevData = () => (prev ? formatReadNext(data.prev) : null);
@@ -126,7 +126,7 @@ class PostTemplate extends React.Component {
           </MainContent>
           <ReadNext next={getNextData()} prev={getPrevData()} />
 
-          {/*The tiny footer at the very bottom*/}
+          {/* The tiny footer at the very bottom */}
           <Footer
             copyright={config.copyright}
             promoteGatsby={config.promoteGatsby}
@@ -137,7 +137,7 @@ class PostTemplate extends React.Component {
   }
 }
 
-/* eslint no-undef: "off"*/
+/* eslint no-undef: "off" */
 export const pageQuery = graphql`
   query BlogPostBySlug($slug: String!, $next: String, $prev: String) {
     markdownRemark(fields: { slug: { eq: $slug } }) {