Is it possible to build multiple bundles using CLI?
bahmutov opened this issue · comments
If I need to build multiple bundles from multiple entries (1-1 entry to output bundle), is it possible to specify using single rollup.config.js
or should I use the API? I would like something like this
// rollup.config.js
export default [{
entry: 'src/foo.js',
dest: 'dist/foo.js'
}, {
entry: 'src/bar.js',
dest: 'dist/bar.js'
}]]
Thanks for great tool!
The config file approach only works with one entry file – you have three options if you want to create multiple bundles from multiple entry files:
Use the API, as you suggest
This will always be the most flexible approach, if not the simplest
Use the --environment
flag.
You can pass variables into the config file like so:
rollup -c --environment entry:foo
// rollup.config.js
export default {
entry: `src/${process.env.entry}.js`,
dest: `dist/${process.env.entry}.js`
};
You can have as many comma-separated key:value pairs (or just key – equals 'true'
) as you like.
Multiple config files
rollup -c rollup.config.foo.js
rollup -c rollup.config.bar.js
// rollup.config.foo.js
export default {
entry: `src/foo.js`,
dest: `dist/foo.js`
};
// rollup.config.bar.js
export default {
entry: `src/bar.js`,
dest: `dist/bar.js`
};
Hope this helps!
Thanks, @Rich-Harris the API worked like a charm, love it.
Implemented multiple entries using API in https://github.com/bahmutov/rollem
Looks like this is now supported in core #1389
Yep — just export an array of config objects from your config file.
Note that each config object should have its own plugin instances rather than sharing them — i.e. this...
// rollup.config.js
export default [
{
entry: 'src/a.js',
dest: 'dist/a.js',
format: 'cjs',
plugins: [somePlugin()]
},
{
entry: 'src/b.js',
dest: 'dist/b.js',
format: 'cjs',
plugins: [somePlugin()]
}
];
...rather than this:
// rollup.config.js — DON'T DO THIS
const plugins = [somePlugin()];
export default [
{
entry: 'src/a.js',
dest: 'dist/a.js',
format: 'cjs',
plugins
},
{
entry: 'src/b.js',
dest: 'dist/b.js',
format: 'cjs',
plugins
}
];
@Rich-Harris I've switched over from grunt-rollup
to using rollup
straight up. The following rollup.config.js
is working for me, along with running concat and uglify on the rolled-up files.
Does this seem legit? It's slightly different than your example. Also, thanks for your help over the last couple days!
export default [
// main build
{
format: "umd",
moduleName: "...",
extend: "true",
entry: "src.js",
dest: "build/src.js",
plugins: rollupPlugins() // function reference didn't work; i needed to call it
},
// dev build
{
format: "umd",
moduleName: "...",
extend: "true",
entry: "src-dev.js",
dest: "build/src-dev.js",
plugins: rollupPlugins() // function reference didn't work; i needed to call it
}
];
function rollupPlugins() {
return [
// list of plugins
];
}
If anybody finds the array of config objects a bit cumbersome when the config is the same for each entry point, I found a nice solution:
export default ['first', 'second'].map((name, index) => ({
input: `src/${name}.js`,
output: {
name,
dir: 'public',
// etc
},
plugins: [
somePlugin(),
// even livereload can work if you specify a different port for each entry point
livereload({
watch: `public/${name}.*`,
port: 3000 + index
})
]
}));