build(app): make base components global by default

components/BaseCheatsheet.vue

@@ -35,14 +35,7 @@
      ************************************************************************* -->
 
 <script>
-// PROJECT
-import BaseShare from "@/components/BaseShare";
-
 export default {
-  components: {
-    BaseShare
-  },
-
   props: {
     link: {
       type: String,

nuxt.config.js

@@ -27,5 +27,6 @@ module.exports = {
     },
     postcss: [require("autoprefixer")()]
   },
-  css: ["normalize.css/normalize.css"]
+  css: ["normalize.css/normalize.css"],
+  plugins: [{ src: "@/plugins/global.js" }]
 };

package.json

@@ -13,6 +13,7 @@
     "precommit": "npm run lint"
   },
   "dependencies": {
+    "lodash": "^4.17.10",
     "normalize.css": "^8.0.0",
     "nuxt": "^1.0.0"
   },

pages/index.vue

@@ -43,16 +43,7 @@
      ************************************************************************* -->
 
 <script>
-// PROJECT
-import BaseCheatsheet from "@/components/BaseCheatsheet";
-import BaseDivider from "@/components/BaseDivider";
-
 export default {
-  components: {
-    BaseCheatsheet,
-    BaseDivider
-  },
-
   data() {
     return {
       // --> COMPONENTS <--

plugins/global.js

@@ -0,0 +1,45 @@
+/**************************************************************************
+ * IMPORTS
+ ***************************************************************************/
+
+// NPM
+import Vue from "vue";
+import upperFirst from "lodash/upperFirst";
+import camelCase from "lodash/camelCase";
+
+/**************************************************************************
+ * GLOBAL COMPONENTS
+ * https://vuejs.org/v2/guide/components.html#Global-Registration
+ ***************************************************************************/
+
+const requireComponent = require.context(
+  // The relative path of the components folder
+  // NOTE: try with ../components/base
+  "../components",
+  // Whether or not to look in subfolders
+  false,
+  // The regular expression used to match base component filenames
+  /Base[A-Z]\w+\.(vue|js)$/
+);
+
+requireComponent.keys().forEach(fileName => {
+  // Get component config
+  const componentConfig = requireComponent(fileName);
+
+  // Get PascalCase name of component
+  const componentName = upperFirst(
+    camelCase(
+      // Strip the leading `./` and extension from the filename
+      fileName.replace(/^\.\/(.*)\.\w+$/, "$1")
+    )
+  );
+
+  // Register component globally
+  Vue.component(
+    componentName,
+    // Look for the component options on `.default`, which will
+    // exist if the component was exported with `export default`,
+    // otherwise fall back to module's root.
+    componentConfig.default || componentConfig
+  );
+});