chore: upgrade dependencies

atinux · Dec 26, 2019 · 25dd3e7 · 25dd3e7
1 parent 75b3a3a
commit 25dd3e7
Show file tree

Hide file tree

Showing 13 changed files with 1,870 additions and 2,084 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -12,7 +12,5 @@ module.exports = {
     'plugin:nuxt/recommended'
   ],
   // add your custom rules here
-  rules: {
-    'vue/no-v-html': 0
-  }
+  rules: {}
 }
diff --git a/components/slices/CtaBanner.vue b/components/slices/CtaBanner.vue
@@ -4,8 +4,8 @@
       <prismic-image class="cta-banner-image" :field="slice.primary.image_banner" />
       <div class="cta-banner-content">
         <div class="cta-banner-box">
-          <div class="cta-banner-title" v-html="$prismic.asHtml(slice.primary.banner_title)" />
-          <div class="cta-banner-text" v-html="$prismic.asHtml(slice.primary.banner_text)" />
+          <prismic-rich-text class="cta-banner-title" :field="slice.primary.banner_title" />
+          <prismic-rich-text class="cta-banner-text" :field="slice.primary.banner_text" />
         </div>
         <div class="cta-banner-link-wrapper">
           <prismic-link class="cta-banner-link" :field="slice.primary.cta_link">

diff --git a/components/slices/NumerotedItems.vue b/components/slices/NumerotedItems.vue
@@ -2,15 +2,15 @@
   <section>
     <div class="l-wrapper">
       <header class="numeroted-items-header">
-        <div class="numeroted-items-header-title" v-html="$prismic.asHtml(slice.primary.title_section)" />
+        <prismic-rich-text class="numeroted-items-header-title" :field="slice.primary.title_section" />
       </header>
     </div>
     <div class="numeroted-items-items-wrapper">
-      <div
+      <prismic-rich-text
         v-for="(item, index) in slice.items"
         :key="index"
         class="numeroted-items-item-wrapper"
-        v-html="$prismic.asHtml(item.description_paragraph)"
+        :field="item.description_paragraph"
       />
     </div>
   </section>

diff --git a/components/slices/ProductsGrid.vue b/components/slices/ProductsGrid.vue
@@ -2,7 +2,7 @@
   <section>
     <div class="l-wrapper">
       <header class="products-grid-header">
-        <div class="products-grid-header-title" v-html="$prismic.asHtml(slice.primary.section_title)" />
+        <prismic-rich-text class="products-grid-header-title" :field="slice.primary.section_title" />
         <div class="products-grid-header-button-wrapper">
           <prismic-link class="a-button" :field="slice.primary.button_link">
             {{ $prismic.asText(slice.primary.button_label) }}

diff --git a/components/slices/TextBlock.vue b/components/slices/TextBlock.vue
@@ -2,8 +2,8 @@
   <section>
     <div class="l-wrapper">
       <div class="text-block-inner">
-        <div class="text-block-title" v-html="$prismic.asHtml(slice.primary.title1)" />
-        <div class="text-block-richtext" v-html="$prismic.asHtml(slice.primary.paragraph)" />
+        <prismic-rich-text class="text-block-title" :field="slice.primary.title1" />
+        <prismic-rich-text class="text-block-richtext" :field="slice.primary.paragraph" />
       </div>
     </div>
   </section>

diff --git a/layouts/default.vue b/layouts/default.vue
@@ -79,15 +79,15 @@ export default {
       this.menuOpen = false
     }
   },
-  head () {
-    return {
-      titleTemplate: `%s | ${this.layout.site_name}`
-    }
-  },
   methods: {
     toggleMenu () {
       this.menuOpen = !this.menuOpen
     }
+  },
+  head () {
+    return {
+      titleTemplate: `%s | ${this.layout.site_name}`
+    }
   }
 }
 </script>

diff --git a/nuxt.config.js b/nuxt.config.js
@@ -24,6 +24,7 @@ export default {
   buildModules: [
     '~/modules/crawler',
     '~/modules/static',
+    // Doc: https://prismic-nuxt.js.org/
     'prismic-nuxt',
     // Doc: https://github.com/nuxt-community/eslint-module
     '@nuxtjs/eslint-module'

diff --git a/package.json b/package.json
@@ -18,18 +18,16 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "nuxt": "^2.9.2",
-    "prismic-nuxt": "Atinux/prismic-nuxt#feat-improvements",
-    "prismic-vue": "^1.3.0"
+    "nuxt": "^2.11.0",
+    "prismic-nuxt": "jamespegg/prismic-nuxt#feat-prismic-vue"
   },
   "devDependencies": {
-    "@nuxtjs/eslint-config": "^1.1.2",
-    "@nuxtjs/eslint-module": "^1.0.0",
+    "@nuxtjs/eslint-config": "^2.0.0",
+    "@nuxtjs/eslint-module": "^1.1.0",
     "babel-eslint": "^10.0.3",
-    "eslint": "^6.3.0",
-    "eslint-plugin-nuxt": "^0.4.3",
-    "node-sass": "^4.12.0",
-    "sass-loader": "^8.0.0",
-    "vue-docgen-api": "^3.22.0"
+    "eslint": "^6.8.0",
+    "eslint-plugin-nuxt": "^0.5.0",
+    "node-sass": "^4.13.0",
+    "sass-loader": "^8.0.0"
   }
 }
diff --git a/pages/blog/_uid.vue b/pages/blog/_uid.vue
@@ -6,8 +6,8 @@
         <div class="blog-post-image-wrapper">
           <prismic-image class="blog-post-image" :field="blogpost.data.image" />
         </div>
-        <div class="blog-post-title" v-html="$prismic.asHtml(blogpost.data.title)" />
-        <div class="blog-post-rich-content" v-html="$prismic.asHtml(blogpost.data.rich_content)" />
+        <prismic-rich-text class="blog-post-title" :field="blogpost.data.title" />
+        <prismic-rich-text class="blog-post-rich-content" :field="blogpost.data.rich_content" />
         <div class="blog-post-author-wrapper">
           <prismic-image
             v-if="blogpost.data.author.data"

diff --git a/pages/index.vue b/pages/index.vue
@@ -2,14 +2,14 @@
   <div>
     <header class="homepage-header">
       <div class="l-wrapper">
-        <div class="homepage-header-title" v-html="$prismic.asHtml(home.data.title)" />
+        <prismic-rich-text class="homepage-header-title" :field="home.data.title" />
       </div>
     </header>
 
     <section class="homepage-banner">
       <prismic-image class="homepage-banner-image" :field="home.data.banner_image" />
       <div class="homepage-banner-box-wrapper">
-        <div class="homepage-banner-box" v-html="$prismic.asHtml(home.data.banner_text)" />
+        <prismic-rich-text class="homepage-banner-box" :field="home.data.banner_text" />
       </div>
     </section>
 
@@ -105,13 +105,13 @@ export default {
     NumerotedItems,
     TextBlock
   },
-  head: {
-    title: 'Home'
-  },
   async asyncData ({ $prismic }) {
     const home = await $prismic.api.getSingle('homepage', { graphQuery })
 
     return { home }
+  },
+  head: {
+    title: 'Home'
   }
 }
 </script>

diff --git a/pages/products/_uid.vue b/pages/products/_uid.vue
@@ -7,8 +7,8 @@
           <div class="product-hero-inner">
             <prismic-image class="product-hero-image" :field="product.data.product_image" />
             <div class="product-hero-content">
-              <div class="product-hero-name" v-html="$prismic.asHtml(product.data.product_name)" />
-              <div class="product-hero-rich-content" v-html="$prismic.asHtml(product.data.rich_content)" />
+              <prismic-rich-text class="product-hero-name" :field="product.data.product_name" />
+              <prismic-rich-text class="product-hero-rich-content" :field="product.data.rich_content" />
               <div class="product-hero-button-wrapper">
                 <prismic-link
                   class="a-button a-button--filled"
@@ -24,8 +24,8 @@
       </section>
       <section class="product-description">
         <div class="l-wrapper">
-          <div class="product-description-title" v-html="$prismic.asHtml(product.data.title)" />
-          <div class="product-description-content" v-html="$prismic.asHtml(product.data.product_description)" />
+          <prismic-rich-text class="product-description-title" :field="product.data.title" />
+          <prismic-rich-text class="product-description-content" :field="product.data.product_description" />
         </div>
       </section>
       <div class="product-separator-wrapper">
@@ -34,7 +34,7 @@
       <section>
         <div class="l-wrapper">
           <header class="products-grid-header">
-            <div class="products-grid-header-title" v-html="$prismic.asHtml(product.data.related_products_title)" />
+            <prismic-rich-text class="products-grid-header-title" :field="product.data.related_products_title" />
           </header>
         </div>
         <div class="products-grid-items-wrapper">
@@ -78,26 +78,26 @@ product {
 }`
 
 export default {
-  data: () => ({
-    product: null
-  }),
   async asyncData ({ params, $prismic }) {
     const product = await $prismic.api.getByUID('product', params.uid, { graphQuery })
 
     return { product }
   },
+  data: () => ({
+    product: null
+  }),
+  methods: {
+    handleClickAddCart () {
+      window.alert('No. Not today.\nWe\'re integrating the GraphQL API at the moment, so coffee delivery is temporarily unavailable.')
+    }
+  },
   head () {
     return {
       title: this.$prismic.asText(this.product.data.product_name),
       meta: [
         { vmid: 'description', name: 'description', content: this.$prismic.asText(this.product.data.product_description).substring(0, 158) }
       ]
     }
-  },
-  methods: {
-    handleClickAddCart () {
-      window.alert('No. Not today.\nWe\'re integrating the GraphQL API at the moment, so coffee delivery is temporarily unavailable.')
-    }
   }
 }
 </script>

diff --git a/pages/products/index.vue b/pages/products/index.vue
@@ -4,7 +4,7 @@
     <section class="products-section">
       <div class="l-wrapper">
         <header class="products-grid-header">
-          <div class="products-grid-header-title" v-html="$prismic.asHtml(productsDocument.data.title)" />
+          <prismic-rich-text class="products-grid-header-title" :field="productsDocument.data.title" />
         </header>
       </div>
       <div class="products-grid-items-wrapper">