gatsby-config.ts + gatsby-node.ts (#97) 🚀

* Updated gatsby to 4.9.0

* Migrated gatsby config to typescript 🚀

* gatsby-node migrated 🚀

* Fixed types for gatsby plugin feed 🚀

Author: chicio

CHANGELOG.md

@@ -1,6 +1,14 @@
 # Change Log
 All changes to Chicio coding will be documented in this file.
 
+## [5.4.0](https://github.com/chicio/chicio.github.io/releases/tag/v5.4.0)
+Release date: 2021-03-xx
+
+#### Added
+
+- gatsby-config migrated to typescript
+- gatsby-node migrated to typescript
+
 ## [5.3.0](https://github.com/chicio/chicio.github.io/releases/tag/v5.3.0)
 Release date: 2021-12-03
 

__tests__/slug.test.js __tests__/slug.test.ts__tests__/slug.test.js renamed to __tests__/slug.test.ts

@@ -1,6 +1,15 @@
+import { GatsbyConfig } from "gatsby";
+
 require("dotenv").config();
 
-module.exports = {
+interface GatsbyPluginFeed {
+  query: {
+    site: any;
+    allMarkdownRemark: any;
+  };
+}
+
+const config: GatsbyConfig = {
   siteMetadata: {
     title:
       "Fabrizio Duroni | Fabrizio Duroni ‘Chicio Coding’ official site with profile details. Official blog chicio coding. Main skills: mobile application development, computer graphics, web development.",
@@ -68,23 +77,20 @@ module.exports = {
         name: "images",
         path: "./src/images/",
       },
-      __key: "images",
     },
     {
       resolve: "gatsby-source-filesystem",
       options: {
         name: "pages",
         path: "./src/pages/",
       },
-      __key: "pages",
     },
     {
       resolve: `gatsby-source-filesystem`,
       options: {
         path: `./src/posts`,
         name: `posts`,
       },
-      __key: "posts",
     },
     {
       resolve: `gatsby-transformer-remark`,
@@ -163,13 +169,17 @@ module.exports = {
         `,
         feeds: [
           {
-            serialize: ({ query: { site, allMarkdownRemark } }) => {
-              return allMarkdownRemark.edges.map((edge) => {
+            serialize: (data: GatsbyPluginFeed) => {
+              return data.query.allMarkdownRemark.edges.map((edge: any) => {
                 return Object.assign({}, edge.node.frontmatter, {
                   description: edge.node.excerpt,
                   date: edge.node.frontmatter.date,
-                  url: site.siteMetadata.siteUrl + edge.node.fields.slug,
-                  guid: site.siteMetadata.siteUrl + edge.node.fields.slug,
+                  url:
+                    data.query.site.siteMetadata.siteUrl +
+                    edge.node.fields.slug,
+                  guid:
+                    data.query.site.siteMetadata.siteUrl +
+                    edge.node.fields.slug,
                   custom_elements: [{ "content:encoded": edge.node.html }],
                 });
               });
@@ -212,3 +222,5 @@ module.exports = {
     },
   ],
 };
+
+export default config;

gatsby-config.js gatsby-config.tsgatsby-config.js renamed to gatsby-config.ts

@@ -1,15 +1,16 @@
-const path = require("path");
-const readingTime = require("reading-time");
-const {
-  slugs,
-  generateTagSlug,
-  generatePostSlug,
-} = require("./src/logic/slug");
-const { createFilePath } = require("gatsby-source-filesystem");
+import { GatsbyNode } from "gatsby";
+import readingTime from "reading-time";
+import * as path from "path";
+import { createFilePath } from "gatsby-source-filesystem";
+import { generatePostSlug, generateTagSlug, slugs } from "./src/logic/slug";
 
-exports.createPages = async ({ graphql, actions, reporter }) => {
+export const createPages: GatsbyNode["createPages"] = async ({
+  graphql,
+  actions,
+  reporter,
+}) => {
   const { createPage } = actions;
-  const result = await graphql(
+  const result: any = await graphql(
     `
       {
         allMarkdownRemark(
@@ -41,12 +42,12 @@ exports.createPages = async ({ graphql, actions, reporter }) => {
   const posts = result.data.allMarkdownRemark.edges;
 
   //Create posts pages
-  posts.forEach(({ node }) => {
+  posts.forEach((post: any) => {
     createPage({
-      path: node.fields.slug,
+      path: post.node.fields.slug,
       component: path.resolve(`./src/templates/post.tsx`),
       context: {
-        slug: node.fields.slug,
+        slug: post.node.fields.slug,
       },
     });
   });
@@ -68,8 +69,8 @@ exports.createPages = async ({ graphql, actions, reporter }) => {
   });
 
   //Create tag pages
-  const tags = result.data.tagsGroup.group;
-  tags.forEach((tag) => {
+  const tags: any = result.data.tagsGroup.group;
+  tags.forEach((tag: any) => {
     createPage({
       path: generateTagSlug(tag.fieldValue),
       component: path.resolve("./src/templates/tag.tsx"),
@@ -80,15 +81,19 @@ exports.createPages = async ({ graphql, actions, reporter }) => {
   });
 };
 
-exports.onCreateNode = ({ node, actions, getNode }) => {
+export const onCreateNode: GatsbyNode["onCreateNode"] = ({
+  node,
+  actions,
+  getNode,
+}) => {
   const { createNodeField } = actions;
   if (node.internal.type === `MarkdownRemark`) {
     const filename = createFilePath({ node, getNode, basePath: `pages` });
     createNodeField({ node, name: `slug`, value: generatePostSlug(filename) });
     createNodeField({
       node,
       name: `readingTime`,
-      value: readingTime(node.rawMarkdownBody),
+      value: readingTime(node.rawMarkdownBody as string),
     });
   }
 };