Is it possible for Rollup to preserve file and folder structure?

Viewed 5081

I'm using ES6 imports and transpiling them with Rollup.

The output is a single bundle file.

Can Rollup be configured to generate a file-for-file transpile result?

Here is the current configuration I'm using which obviously spits out one file.

 gulp.task('rollup', function() {
    const rollup = require('rollup');
    const nodeResolve = require('rollup-plugin-node-resolve');

    const JS_INDEX_FILE = 'src/index.js';

    return rollup.rollup({
        input: JS_INDEX_FILE,
        plugins: [
            nodeResolve({
                browser: true
            })
        ]
    }).then(bundle => {
            bundle.write({
                sourcemap: true,
                format: 'cjs',
                strict: true,
                file: 'bundle.js'
            });
        });
});

Basically, I'd like individual files with require() instead of import.

2 Answers

If you want to use rollup to convert ES6 to CommonJS and preserve the file and directory structure, your rollup config might look something like this:

import { nodeResolve } from "@rollup/plugin-node-resolve";

export default [
  {
    input: ["src/index.js"],
    plugins: [nodeResolve()],
    output: [
      {
        dir: "dist",
        format: "cjs",
        exports: "named",
        preserveModules: true, // Keep directory structure and files
      }
    ]
  }
]

See Integrating Rollup with Other Tools to determine if you need the @rollup/plugin-node-resolve plugin and exactly what gets "preserved" from the external packages.

Rollup is a module bundler. What you want is a compiler, such as Babel.

Related