How to use the @storybook/vue.configure function in @storybook/vue

// Install Ripple Global plugin
Vue.use(RplGlobal, { rplMarkup: {plugins: RplMarkupExamplePlugins, options: { decodeEntities: false }}})

setOptions({
  name: 'Ripple',
  downPanelInRight: true,
})

// automatically import all files ending in *.stories.js
const req = require.context('../components', true, /.stories.js$/);
function loadStories() {
  req.keys().forEach((filename) => req(filename));
  require('../src/storybook-components/stories');
}

configure(loadStories, module)

// Require all the .stories.js files from all components
const req = require.context('@/components', true, /.stories.js$/)

function loadStories () {
  req.keys().forEach((filePath) => {
    const componentName = filePath.replace(/^.+\/([^/]+)\/index.stories.js/, '$1')
    const component = req(filePath)
    Vue.component(componentName, component)
    return component
  })
}

addDecorator(StoryRouter())

configure(loadStories, module)

import { configure } from "@storybook/vue";

// automatically import all files ending in *.stories.js
const req = require.context("../src/stories", true, /.stories.ts$/);
function loadStories() {
  req.keys().forEach(filename => req(filename));
}

configure(loadStories, module);

import { configure } from '@storybook/vue';

// automatically import all files ending in *.stories.js
configure(require.context('../stories', true, /\.stories\.(js|mdx)$/), module);

// Disable Docs globally for now until we got time to update them.
    // We are still able to add Docs in component level.
    // https://github.com/storybookjs/storybook/blob/next/addons/docs/docs/docspage.md#replacing-docspage
    page: null
  },
  backgrounds: [
    // We need a story background color which is different with all SDP theme color,
    // so we can tell if a component has the right background color.
    { name: 'light', value: '#edfafc', default: true }
  ],
})

// Install Ripple Global plugin
Vue.use(RplGlobal, { rplMarkup: {plugins: RplMarkupExamplePlugins, options: { decodeEntities: false }}})

configure(require.context('./../../packages/components', true, /(stories\.js|mdx)$/), module)

theme: basicTheme,
    // theme: themes.dark,
  },
  readme: {
    // You can set the global code theme here.
    codeTheme: 'github',
  },
});

addDecorator(addReadme);

function loadStories() {
  require('../stories');
}

configure(loadStories, module);

import { configure } from '@storybook/vue';

// CSS reset expected by Keen UI
import './css/reset.css';

// Utilities for use in global decorators
import './css/utilities.css';

// Bootstrap modality
import '../src/bootstrap';

// Load all files ending in *.stories.js
configure(require.context('../stories', true, /\.stories\.js$/), module);

import { configure } from '@storybook/vue';
import storybook from '../../src/storybook';

storybook();

function loadStories() {
  // TODO REMOVE
}

configure(loadStories, module);

function Module(file): any {
        return require(file);
    }

    Module.keys = () => Object.keys(files);

    return Module;
};

const loadJestStories: any = () => {
    const req: any = requireContext('../../src', true, /\.stories\.ts$/);
    req.keys().forEach(filename => req(filename));
};

configure(() => loadJestStories(), module);

name: 'GitLab EE',
  url: 'https://gitlab.com/gitlab-org/gitlab-ee/',
  goFullScreen: false,
  showLeftPanel: true,
  showDownPanel: true,
  showSearchBox: false,
  downPanelInRight: true,
  sortStoriesByKind: false,
  hierarchySeparator: /\./,
});

function loadStories() {
  require('../stories')
}

configure(loadStories, module)