How to use @instructure/config-loader - 2 common examples

export default function componentExamplesLoader (source, map, meta) {
  this.cacheable && this.cacheable()

  const loader = this
  const callback = loader.async()

  const config = {
    maxExamples: 500,
    ...loadConfig('examples', {})
  }

  const generateComponentExamples = require.resolve('./generateComponentExamples')
  const renderPage = require.resolve('./renderPage')
  const renderExample = require.resolve('./renderExample')
  const configPath = `!!${loaderUtils.getRemainingRequest(loader)}`

  const getComponentPath = (typeof config.getComponentPath === 'function') ?
    config.getComponentPath :
    (configFilePath) => {
      const basePath = path.dirname(configFilePath)
      // try to determine component source based on where the .examples file is:
      return path.resolve(basePath, configFilePath.includes('__examples__') ? '../index.js' : './index.js')
    }

  const componentPath = getComponentPath(this.resourcePath)

export default function (source, map) {
  this.cacheable && this.cacheable()

  const loader = this
  const callback = this.async()

  const options = Object.assign({}, loadConfig('examples-loader'), loaderUtils.getOptions(this))

  const files = options.files || ['**/examples.json']
  const ignore = (options.ignore || []).concat(['**/node_modules/**'])
  const cwd = options.cwd || process.cwd()
  const parseExampleNameFromPath = options.parseExampleNameFromPath || function (filePath) {
    return path.basename(path.dirname(filePath))
  }

  globby(files, { ignore, cwd })
    .then((matches) => {
      const generateExample = (match) => {
        const configPath = path.join(cwd, match)
        const config = require(configPath)
        const basePath = path.dirname(configPath)

        const examplesConfigPath = config.configPath ? path.resolve(basePath, config.configPath) : null