entry-file-plugin

Create an ESM entry-file in your Webpack build to consolidate entry-point exports

_{Support this project by ⭐️ starring and sharing it. Follow me to see what other cool projects I'm working on! ❤️}

🙋‍♂️ Why?

For consolidating exports from Webpack builds that emit multiple entry-points.

A great use-case for this is Vue.js component builds that extract the CSS into a separate file. Even if the build bundles multiple components, by creating an entry-point that imports the CSS and re-exports the components, consuming applications can simply import from one path to get the appropriate styles.

🚀 Install

``sh
npm i -D entry-file-plugin
`

🚦 Quick setup

In webpack.config.js:

`diff
+ const EntryFilePlugin = require('entry-file-plugin')

module.exports = {
...,

plugins: [
...,
+ new EntryFilePlugin({
+ imports: [...],
+ exports: [...]
+ })
]
}
`

$3


The following configuration:
`js
new EntryFilePlugin({
imports: [
'./styles.css',
],
exports: [
'./components.js',
],
})
`

Creates an index.js file:
`js
import "./styles.css";
export * from "./components.js";
`

⚙️ Options

$3

Type: string

Default: index.js

The entry file name.

$3


Type: string[]

An array of paths to import from.

$3

Type:

`ts
type Specifier = (string | {
name: string;
as?: string;
})[];

type Exports = (string | {
from: string;
specifiers?: Specifier[];
})[];
`

An array of paths and names to export from.

$3


Type: boolean

Default: false

Whether to omit import/export statements for relative paths that could not be resolved. If false`, a warning will be emitted for unresolvable import/exports.

👨‍👩‍👧 Related

- rollup-plugin-aggregate-exports - Similar plugin for Rollup