[WIP] Fix: cant run locally because of outdated dependency

.eslintrc.js

@@ -2,25 +2,27 @@ module.exports = {
   root: true,
   env: {
     browser: true,
-    node: true
+    node: true,
   },
   parserOptions: {
-    parser: 'babel-eslint'
+    parser: '@babel/eslint-parser',
+    requireConfigFile: false,
   },
-  extends: ['plugin:vue/recommended', 'prettier', 'prettier/vue'],
+  extends: ['plugin:vue/recommended', 'prettier'],
   plugins: ['import', 'markdown', 'vue', 'prettier'],
   settings: {
     'import/resolver': {
       node: {
-        extensions: ['.js', '.jsx', '.vue']
-      }
-    }
+        extensions: ['.js', '.jsx', '.vue'],
+      },
+    },
   },
   rules: {
     'no-console': 1,
     'no-param-reassign': 0,
     'vue/no-v-html': 0,
     'import/no-extraneous-dependencies': 0,
-    'prettier/prettier': 'error'
-  }
+    'prettier/prettier': 'error',
+    'vue/multi-word-component-names': 0,
+  },
 }

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx lint-staged

.husky/prepare-commit-msg

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+exec < /dev/tty && node_modules/.bin/cz --hook || true

gridsome.config.js

@@ -5,8 +5,7 @@
 // To restart press CTRL + C in terminal and run `gridsome develop`
 const TITLE = 'Blog VuejsID'
 const SHORT_TITLE = 'VuejsID'
-const DESC =
-  'Sebuah blog dari VuejsID yang membahas berbagai hal mengenai Vue.js dan ekosistemnya'
+const DESC = 'Sebuah blog dari VuejsID yang membahas berbagai hal mengenai Vue.js dan ekosistemnya'
 const SITE_URL = 'https://blog.vuejs.id'
 
 module.exports = {
@@ -17,7 +16,7 @@ module.exports = {
   templates: {
     Post: '/:title',
     Tag: '/tag/:title',
-    Author: '/author/:title'
+    Author: '/author/:title',
   },
 
   plugins: [
@@ -31,20 +30,20 @@ module.exports = {
           // Creates a GraphQL collection from 'tags' in front-matter and adds a reference.
           tags: {
             typeName: 'Tag',
-            create: true
+            create: true,
           },
           author: {
             typeName: 'Author',
-            create: true
-          }
-        }
-      }
+            create: true,
+          },
+        },
+      },
     },
     {
       use: '@gridsome/plugin-google-analytics',
       options: {
-        id: 'UA-166364803-1'
-      }
+        id: 'UA-166364803-1',
+      },
     },
     {
       use: '@gridsome/plugin-sitemap',
@@ -54,14 +53,14 @@ module.exports = {
         config: {
           '/articles/*': {
             changefreq: 'weekly',
-            priority: 0.5
+            priority: 0.5,
           },
           '/about': {
             changefreq: 'monthly',
-            priority: 0.7
-          }
-        }
-      }
+            priority: 0.7,
+          },
+        },
+      },
     },
     {
       use: 'gridsome-plugin-pwa',
@@ -77,7 +76,7 @@ module.exports = {
         backgroundColor: '#ffffff',
         icon: './static/logo.png',
         cachedFileTypes: 'js,json,css,png,jpg,jpeg,svg',
-      }
+      },
     },
     {
       use: 'gridsome-plugin-feed',
@@ -88,21 +87,21 @@ module.exports = {
         // See https://www.npmjs.com/package/feed#example for available properties
         feedOptions: {
           title: TITLE,
-          description: DESC
+          description: DESC,
         },
         // === All options after this point show their default values ===
         // Optional; opt into which feeds you wish to generate, and set their output path
         rss: {
           enabled: true,
-          output: '/feed.xml'
+          output: '/feed.xml',
         },
         atom: {
           enabled: true,
-          output: '/feed.atom'
+          output: '/feed.atom',
         },
         json: {
           enabled: true,
-          output: '/feed.json'
+          output: '/feed.json',
         },
         // Optional: the maximum number of items to include in your feed
         maxItems: 25,
@@ -114,17 +113,17 @@ module.exports = {
         enforceTrailingSlashes: false,
         // Optional: a method that accepts a node and returns true (include) or false (exclude)
         // Example: only past-dated nodes: `filterNodes: (node) => node.date <= new Date()`
-        filterNodes: node => true,
+        filterNodes: (node) => true,
         // Optional: a method that accepts a node and returns an object for `Feed.addItem()`
         // See https://www.npmjs.com/package/feed#example for available properties
         // NOTE: `date` field MUST be a Javascript `Date` object
-        nodeToFeedItem: node => ({
+        nodeToFeedItem: (node) => ({
           title: node.title,
           date: node.date || new Date(),
-          content: node.content
-        })
-      }
-    }
+          content: node.content,
+        }),
+      },
+    },
   ],
 
   transformers: {
@@ -133,7 +132,7 @@ module.exports = {
       externalLinksTarget: '_blank',
       externalLinksRel: ['nofollow', 'noopener', 'noreferrer'],
       anchorClassName: 'icon icon-link',
-      plugins: ['@gridsome/remark-prismjs']
-    }
-  }
+      plugins: ['@gridsome/remark-prismjs'],
+    },
+  },
 }

package.json

@@ -1,59 +1,56 @@
 {
-	"name": "gridsome-blog",
-	"private": true,
-	"scripts": {
-		"cz": "cz",
-		"build": "gridsome build",
-		"dev": "gridsome develop",
-		"explore": "gridsome explore",
-		"lint": "eslint src/**/*.{vue,js}",
-		"lint:fix": "eslint src/**/*.{vue,js} --fix"
-	},
-	"dependencies": {
-		"@gridsome/plugin-google-analytics": "0.1.2",
-		"@gridsome/plugin-sitemap": "0.4.0",
-		"@gridsome/remark-prismjs": "0.4.0",
-		"@gridsome/source-filesystem": "0.6.2",
-		"@gridsome/transformer-remark": "0.6.3",
-		"gridsome": "0.7.21",
-		"gridsome-plugin-feed": "^1.0.2",
-		"gridsome-plugin-pwa": "^0.0.18"
-	},
-	"devDependencies": {
-		"babel-eslint": "^10.1.0",
-		"eslint": "^7.10.0",
-		"eslint-config-prettier": "^6.12.0",
-		"eslint-config-standard": "^14.1.1",
-		"eslint-plugin-import": "^2.22.1",
-		"eslint-plugin-markdown": "^1.0.2",
-		"eslint-plugin-node": "^11.1.0",
-		"eslint-plugin-prettier": "^3.1.4",
-		"eslint-plugin-promise": "^4.2.1",
-		"eslint-plugin-vue": "^7.0.0",
-		"cz-conventional-changelog": "^3.3.0",
-		"husky": "^4.3.0",
-		"lint-staged": "^10.4.0",
-		"node-sass": "4.14.1",
-		"prettier": "^2.1.2",
-		"sass-loader": "10.0.2",
-		"slugify": "^1.4.5"
-	},
-	"config": {
-		"commitizen": {
-			"path": "cz-conventional-changelog"
-		}
-	},
-	"husky": {
-		"hooks": {
-			"prepare-commit-msg": "exec < /dev/tty && git cz --hook || true",
-			"pre-commit": "lint-staged"
-		}
-	},
-	"lint-staged": {
-		"*.{js,vue}": [
-			"prettier --write",
-			"eslint --fix",
-			"git add"
-		]
-	}
+  "name": "gridsome-blog",
+  "private": true,
+  "scripts": {
+    "cz": "cz",
+    "build": "gridsome build",
+    "dev": "gridsome develop",
+    "explore": "gridsome explore",
+    "lint": "eslint src/**/*.{vue,js}",
+    "lint:fix": "eslint src/**/*.{vue,js} --fix",
+    "prepare": "husky install"
+  },
+  "dependencies": {
+    "@gridsome/plugin-google-analytics": "0.1.2",
+    "@gridsome/plugin-sitemap": "0.4.0",
+    "@gridsome/remark-prismjs": "0.5.0",
+    "@gridsome/source-filesystem": "0.6.2",
+    "@gridsome/transformer-remark": "0.6.4",
+    "gridsome": "0.7.23",
+    "gridsome-plugin-feed": "^1.0.2",
+    "gridsome-plugin-pwa": "^0.0.22"
+  },
+  "devDependencies": {
+    "@babel/eslint-parser": "^7.16.3",
+    "commitizen": "^4.2.4",
+    "cz-conventional-changelog": "^3.3.0",
+    "eslint": "^8.15.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-config-standard": "^17.0.0",
+    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-markdown": "^2.2.1",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-promise": "^6.0.0",
+    "eslint-plugin-vue": "^8.7.1",
+    "husky": "^7.0.0",
+    "lint-staged": "^12.4.1",
+    "node-sass": "7.0.1",
+    "prettier": "^2.6.2",
+    "sass": "^1.51.0",
+    "sass-loader": "^10.1.1",
+    "slugify": "^1.6.5"
+  },
+  "config": {
+    "commitizen": {
+      "path": "cz-conventional-changelog"
+    }
+  },
+  "lint-staged": {
+    "*.{js,vue}": [
+      "prettier --write",
+      "eslint --fix",
+      "git add"
+    ]
+  }
 }