Generate Exports Webpack Plugin

Generate exports for all matching modules into an index file.

Install

npm config set @wurielle:registry https://npm.pkg.github.com && npm install @wurielle/generate-exports-webpack-plugin

Usage

Configure a filename and directories (index.ts in ./src/components)

// webpack.config.js
const GenerateExportsPlugin = require('@wurielle/generate-exports-webpack-plugin')
 
module.exports = {
  plugins: [
    new GenerateExportsPlugin([
        {
            omitExtension: false,
            omitSemi: true,
            filename: 'index.ts',
            include: ['**/*.vue'],
            directories: ['./src/components'],
        },
    ]),
  ],
}

NOTE: You can provide multiple configurations in the array passed to the plugin. I recommend using a configuration for each extension type you want to generate exports for.

Which outputs in specified directories (./src/components/index.ts):

/**
 * This file is auto-generated by GenerateExportsWebpackPlugin.
 * Check this file into source control.
 * Do not edit this file.
 */
export { default as MyButton } from './MyButton.vue'
export { default as MyInput } from './Input/MyInput.vue'
export { default as MyOption } from './Select/MyOption.vue'
export { default as MySelect } from './Select/MySelect.vue'
export { default as MyTable } from './Table/MyTable.vue'
export { default as MyTableColumn } from './Table/MyTableColumn.vue'
export { default as MyComponent } from './Nested/Component/Folder/MyComponent.vue'
/* End of auto-generated content. */

So that you can import them like so:

import { MyButton, MyInput, MySelect, ... } from '@/components'

Options

Defaults

// webpack.config.js
const GenerateExportsPlugin = require('@wurielle/generate-exports-webpack-plugin')
 
module.exports = {
  plugins: [
    new GenerateExportsPlugin([
        {
            exportAll: false,
            exportAllAsAlias: true,
            omitExtension: true,
            omitSemi: false,
            singleQuote: true,
            filename: 'index.js',
            include: [],
            exclude: [],
            directories: [],
        },
    ]),
  ],
}

exportAll

// exportAll: false - default
export { default as utils } from './utils';

// exportAll: true
export * as utils from './utils';

exportAllAsAlias

// Only if exportAll is true
// exportAllAsAlias: true - default
export * as utils from './utils';

// exportAllAsAlias: false
export * from './utils';

omitExtension

// omitExtension: true - default
export { default as utils } from './utils';

// omitExtension: false
export { default as utils } from './utils.ts';

omitSemi

// omitSemi: false - default
export { default as utils } from './utils';

// omitSemi: true
export { default as utils } from './utils'

singleQuote

// singleQuote: true - default
export { default as utils } from './utils';

// singleQuote: false
export { default as utils } from "./utils";

filename

{
    filename: 'index.ts', // Defaults to 'index.js'
}

include

{
    include: [
        '**/*.vue',
        '**/*.{js|jsx|ts|tsx}',
    ], // Defaults to []
}

exclude

{
    exclude: [
        '**/index.{js|jsx|ts|tsx}',
        '**/*.d.ts',
    ], // Defaults to []
}

directories

{
    directories: [
        './src/utils',
        // You can override options for a specific directory
        [
            './src/services',
            {
                exportAll: true,
                exportAllAsAlias: false,
            }
        ]
    ], // Defaults to []
}