Package Upgrades

gridsome.config.js

@@ -18,7 +18,7 @@ module.exports = {
 
     if (isServer) {
       config.externals(nodeExternals({
-        whitelist: [
+        allowlist: [
           /\.css$/,
           /\?vue&type=style/,
           /vue-instantsearch/,

gridsome.server.js

@@ -28,7 +28,7 @@ module.exports = function (api) {
     // contributors
     const authorsPath = path.join(__dirname, 'contributors/contributors.yaml')
     const authorsRaw = await fs.readFile(authorsPath, 'utf8')
-    const authorsJson = yaml.safeLoad(authorsRaw)
+    const authorsJson = yaml.load(authorsRaw)
     const authors = addCollection('Contributor')
 
     authorsJson.forEach(({ id, name: title, ...fields }) => {
@@ -45,7 +45,7 @@ module.exports = function (api) {
     // Starters
     const startersPath = path.join(__dirname, 'starters/starters.yaml')
     const startersRaw = await fs.readFile(startersPath, 'utf8')
-    const startersJson = yaml.safeLoad(startersRaw)
+    const startersJson = yaml.load(startersRaw)
     const starters = addCollection('Starter')
 
     // Connect author field to Contributors & Platforms
@@ -65,7 +65,7 @@ module.exports = function (api) {
     // Platforms
     const platformsPath = path.join(__dirname, 'platforms/platforms.yaml')
     const platformsRaw = await fs.readFile(platformsPath, 'utf8')
-    const platformsJson = yaml.safeLoad(platformsRaw)
+    const platformsJson = yaml.load(platformsRaw)
     const platforms = addCollection('Platform')
 
     // Connect author field to Contributors

package.json

@@ -10,33 +10,33 @@
     "markdown:fix": "markdownlint '**/*.md' --ignore node_modules --fix"
   },
   "dependencies": {
-    "@gridsome/plugin-google-analytics": "^0.1.0",
-    "algoliasearch": "^3.32.0",
-    "clipboard-copy": "^3.0.0",
-    "docsearch.js": "^2.6.2",
-    "gridsome": "^0.7.0",
-    "marked": "^0.7.0",
-    "typography": "^0.16.18",
-    "vue-instantsearch": "^2.0.0",
-    "vue-lazy-hydration": "^1.0.0-beta.7",
+    "@gridsome/plugin-google-analytics": "^0.1.2",
+    "algoliasearch": "^4.8.5",
+    "clipboard-copy": "^4.0.1",
+    "docsearch.js": "^2.6.3",
+    "gridsome": "^0.7.23",
+    "marked": "^2.0.0",
+    "typography": "^0.16.19",
+    "vue-instantsearch": "^3.4.3",
+    "vue-lazy-hydration": "2.0.0-beta.4",
     "vue-popover": "^1.6.2",
-    "vue-scrollto": "^2.13.0"
+    "vue-scrollto": "^2.20.0"
   },
   "devDependencies": {
     "@gridsome/plugin-critical": "^0.2.0",
-    "@gridsome/remark-prismjs": "^0.4.0",
-    "@gridsome/source-filesystem": "^0.6.0",
-    "@gridsome/transformer-remark": "^0.6.2",
-    "@gridsome/vue-remark": "^0.2.4",
-    "execa": "^4.0.2",
-    "fs-extra": "^9.0.1",
-    "js-yaml": "^3.14.0",
-    "markdownlint-cli": "0.23.2",
-    "node-sass": "^4.14.1",
-    "raw-loader": "^4.0.1",
-    "sass-loader": "^7.1.0",
+    "@gridsome/remark-prismjs": "^0.5.0",
+    "@gridsome/source-filesystem": "^0.6.2",
+    "@gridsome/transformer-remark": "^0.6.4",
+    "@gridsome/vue-remark": "^0.2.6",
+    "execa": "^5.0.0",
+    "fs-extra": "^9.1.0",
+    "js-yaml": "^4.0.0",
+    "markdownlint-cli": "0.26.0",
+    "node-sass": "^5.0.0",
+    "raw-loader": "^4.0.2",
+    "sass-loader": "^10.1.1",
     "svg-to-vue-component": "^0.3.8",
-    "webpack-node-externals": "^1.7.2"
+    "webpack-node-externals": "^2.5.2"
   },
   "engines": {
     "node": ">=14"

src/layouts/partials/Header.vue

@@ -89,7 +89,6 @@ import ToggleTheme from '@/components/ToggleTheme.vue'
 import GithubLogo from '@/assets/images/github-logo.svg'
 import TwitterLogo from '@/assets/images/twitter-logo.svg'
 import DiscordLogo from '@/assets/images/discord-logo.svg'
-import LazyHydrate from 'vue-lazy-hydration'
 
 export default {
   components: {
@@ -99,8 +98,7 @@ export default {
     ToggleTheme,
     DiscordLogo,
     SearchForm,
-    Nav,
-    LazyHydrate
+    Nav
   }
 }
 </script>

src/templates/Plugin.vue

@@ -1,7 +1,7 @@
 <template>
   <Layout :footer="false">
     <div class="plugins container flex flex-align-top" style="position: relative;">
-      
+
       <AisInstantSearchSsr class="sidebar plugins__sidebar">
         <AisConfigure
           :hitsPerPage="hitsPerPage"
@@ -58,7 +58,7 @@
                 </span>
               </div>
 
-            
+
             </div>
             <div class="plugin-post__meta_right">
               <a
@@ -102,7 +102,7 @@ import BitbucketLogo from '~/assets/images/bitbucket.svg'
 import Connect from '~/components/Connect.vue'
 
 import {
-  createInstantSearch,
+  createServerRootMixin,
   AisInstantSearchSsr,
   AisStateResults,
   AisInfiniteHits,
@@ -116,12 +116,6 @@ const searchClient = algoliasearch(
   'OFCNCOG2CU',
   'e0925566b9cfa7d0d21586a0b365d78c'
 )
-
-const { instantsearch, rootMixin } = createInstantSearch({
-  indexName: 'npm-search',
-  searchClient
-})
-
 export default {
   components: {
     Connect,
@@ -134,7 +128,12 @@ export default {
     AisInstantSearchSsr
   },
 
-  mixins: [rootMixin],
+  mixins: [
+    createServerRootMixin({
+      indexName: 'npm-search',
+      searchClient
+    })
+  ],
 
   data () {
     return {
@@ -144,13 +143,6 @@ export default {
     }
   },
 
-  serverPrefetch () {
-    return instantsearch.findResultsState({
-      hitsPerPage: this.hitsPerPage,
-      filters: this.filters
-    })
-  },
-
   computed: {
     isSingle () {
       return Boolean(this.$route.params.id)