build: fix build error

- update required node version to 16
- update all npm packages to latest
- fix quotation style in gridsome.config.js

.node-version

@@ -1 +1 @@
-14
+16

gridsome.config.js

@@ -5,78 +5,75 @@
 // To restart press CTRL + C in terminal and run `gridsome develop`
 
 module.exports = {
-  siteName: 'Keebfol.io',
-  siteDescription: 'Curated list of mechanical keyboard resources.',
-  siteUrl: 'https://keebfol.io',
+  siteName: "Keebfol.io",
+  siteDescription: "Curated list of mechanical keyboard resources.",
+  siteUrl: "https://keebfol.io",
   chainWebpack(config) {
-    config.mode('development')
-    const svgRule = config.module.rule('svg')
-    svgRule.uses.clear()
-    svgRule
-      .use('vue-svg-loader')
-      .loader('vue-svg-loader')
+    config.mode("development");
+    const svgRule = config.module.rule("svg");
+    svgRule.uses.clear();
+    svgRule.use("vue-svg-loader").loader("vue-svg-loader");
   },
-  plugins: [{
-      use: 'gridsome-plugin-tailwindcss',
+  plugins: [
+    {
+      use: "gridsome-plugin-tailwindcss",
       options: {
-        // tailwindConfig: './some/file/js',
-        // purgeConfig: {},
-        // presetEnvConfig: {},
-        shouldPurge: false, // https://www.purgecss.com/with-postcss
-        shouldImport: true, // https://github.com/postcss/postcss-import
-        shouldTimeTravel: true, // https://github.com/csstools/postcss-preset-env
-      }
+        tailwindConfig: "./tailwind.config.js",
+        presetEnvConfig: {},
+        shouldImport: false,
+        shouldTimeTravel: false,
+      },
     },
     {
-      use: '@gridsome/source-filesystem',
+      use: "@gridsome/source-filesystem",
       options: {
-        index: ['README'],
-        path: '**/*.md',
-        baseDir: './docs',
-        typeName: 'DocPage',
+        index: ["README"],
+        path: "**/*.md",
+        baseDir: "./docs",
+        typeName: "DocPage",
         remark: {
           autolinkHeadings: {
             content: {
-              type: 'text',
-              value: '#',
-            }
-          }
-        }
-      }
+              type: "text",
+              value: "#",
+            },
+          },
+        },
+      },
     },
     {
-      use: 'gridsome-plugin-rss',
+      use: "gridsome-plugin-rss",
       options: {
-        contentTypeName: 'CommitMessages',
+        contentTypeName: "CommitMessages",
         feedOptions: {
-          title: 'Keebfol.io - A Mechanical Keyboard Wiki',
-          feed_url: 'https://keebfol.io/rss.xml',
-          site_url: 'https://keebfol.io',
+          title: "Keebfol.io - A Mechanical Keyboard Wiki",
+          feed_url: "https://keebfol.io/rss.xml",
+          site_url: "https://keebfol.io",
         },
-        feedItemOptions: node => ({
+        feedItemOptions: (node) => ({
           guid: node.id,
           date: node.date,
           title: node.message,
           description: node.body,
           author: node.author,
-          url: 'https://keebfol.io/',
+          url: "https://keebfol.io/",
         }),
         output: {
-          dir: './static/',
-          name: 'rss.xml',
+          dir: "./static/",
+          name: "rss.xml",
         },
         latest: true,
-      }
+      },
     },
     {
-      use: 'gridsome-plugin-modal',
+      use: "gridsome-plugin-modal",
     },
   ],
   transformers: {
     remark: {
-      externalLinksTarget: '_blank',
-      externalLinksRel: ['nofollow', 'noopener', 'noreferrer'],
-      anchorClassName: 'icon icon-link',
-    }
-  }
-}
+      externalLinksTarget: "_blank",
+      externalLinksRel: ["nofollow", "noopener", "noreferrer"],
+      anchorClassName: "icon icon-link",
+    },
+  },
+};

package.json

@@ -23,21 +23,19 @@
     "explore": "gridsome explore"
   },
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^1.2.34",
-    "@fortawesome/free-brands-svg-icons": "^5.15.2",
-    "@fortawesome/free-regular-svg-icons": "^5.15.2",
-    "@fortawesome/free-solid-svg-icons": "^5.15.2",
-    "@fortawesome/vue-fontawesome": "^2.0.2",
-    "@tailwindcss/postcss7-compat": "^2.0.2",
-    "autoprefixer": "^9.8.6",
-    "axios": "^0.21.1",
+    "@fortawesome/fontawesome-svg-core": "^1.2.36",
+    "@fortawesome/free-brands-svg-icons": "^5.15.4",
+    "@fortawesome/free-regular-svg-icons": "^5.15.4",
+    "@fortawesome/free-solid-svg-icons": "^5.15.4",
+    "@fortawesome/vue-fontawesome": "^2.0.3",
+    "@tailwindcss/postcss7-compat": "^2.2.17",
+    "autoprefixer": "^10.3.7",
+    "axios": "^0.23.0",
     "gridsome": "^0.7.23",
     "gridsome-plugin-modal": "^0.1.1",
-    "gridsome-plugin-tailwindcss": "^3.0.1",
-    "lodash": "^4.17.19",
-    "postcss": "^7.0.35",
-    "tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.0.2",
-    "vue-js-modal": "^1.3.35",
+    "lodash": "^4.17.21",
+    "postcss": "^8.3.9",
+    "vue-js-modal": "^2.0.1",
     "vuetable-2": "^2.0.0-beta.4"
   },
   "devDependencies": {
@@ -46,10 +44,14 @@
     "@gridsome/transformer-csv": "^0.2.2",
     "@gridsome/transformer-remark": "^0.6.4",
     "@gridsome/transformer-yaml": "^0.2.1",
-    "fs-extra": "^9.1.0",
-    "graphql-request": "^3.4.0",
+    "fs-extra": "^10.0.0",
+    "graphql-request": "^3.6.0",
     "gridsome-plugin-rss": "^1.2.0",
-    "js-yaml": "^4.0.0",
+    "gridsome-plugin-tailwindcss": "^4.1.1",
+    "js-yaml": "^4.1.0",
+    "postcss-import": "^14.0.2",
+    "postcss-preset-env": "^6.7.0",
+    "tailwindcss": "^2.2.17",
     "vue-svg-loader": "^0.16.0"
   }
 }