add custom plugin to separate site content strings from templates

src/messages/fr.json

@@ -0,0 +1,10 @@
+{
+  "title": "En françaiS au pluriel",
+  "sections": {
+    "home": "Accueil",
+    "library": "Bibliothèque",
+    "kit": "Kit de désapprentissage",
+    "gallery": "Créations numériques"
+  },
+  "bounce_texts": "Textes rebonds"
+}

src/messages/index.js

@@ -0,0 +1,35 @@
+import messages from './fr.json'
+
+
+function getMessage (keyedPath, alt) {
+  console.log(keyedPath, alt)
+  let message
+  try {
+    message = keyedPath.split('.').reduce((parent, key) => {
+      return parent[key]
+    }, messages)
+  } catch {
+    // Silence errors like accessing a key on `undefined`.
+  }
+  return message === undefined
+    ? alt === undefined ? keyedPath : alt
+    : message
+}
+
+
+/*
+ * Allows separtion of static text content from its templates.
+ */
+export default class VueMessages {
+  static install (Vue) {
+    // Adds `this.$t('path.to.string', 'alt')` to every instances.
+    Vue.prototype.$t = getMessage
+
+    // Adds `v-t="'path.to.string'"` directive to every elements.
+    Vue.directive('t', {
+      bind (el, { value }) {
+        el.textContent = getMessage(value)
+      }
+    })
+  }
+}