app/assets/javascripts/globals.js

Summary

Maintainability
A
0 mins
Test Coverage
// Based on https://github.com/chrisvfritz/vue-enterprise-boilerplate/blob/master/src/components/_globals.js
// Globally register all base components for convenience, because they
// will be used very frequently. Components are registered using the
// PascalCased version of their file name.

import Vue from 'vue';
import upperFirst from 'lodash/upperFirst';
import camelCase from 'lodash/camelCase';

// https://webpack.js.org/guides/dependency-management/#require-context
const requireComponent = require.context(
  // Look for files in the current directory
  './shared/components',
  // Do not look in subdirectories
  false,
  // Only include "_base-" prefixed .vue files
  /\.vue$/,
);

// For each matching file name...
requireComponent.keys().forEach((fileName) => {
  // Get the component config
  const componentConfig = requireComponent(fileName);
  // Get the PascalCase version of the component name
  const componentName = upperFirst(
    camelCase(
      fileName
        // Remove the "./_" from the beginning
        .replace(/^\.\/_/, '')
        // Remove the file extension from the end
        .replace(/\.\w+$/, ''),
    ),
  );

  // Globally register the component
  Vue.component(componentName, componentConfig.default || componentConfig);
});