Is there any way to preserve directory structure of bundles when using rollup with code splitting?

安稳与你 提交于 2021-01-27 07:51:39

问题


Context:

Given a project structure like this:

┌ src
├─┬ a
│ └── module.js
├─┬ b
│ └── module.js
└── util.js

Where both module.js files import util.js, using the following configuration:

export default {
    experimentalCodeSplitting: true,
    input: [
        'src/a/module.js',
        'src/b/module.js'
    ],
    output: {
        dir: 'bundle',
        format: 'esm'
    }
};

The following structure is output:

┌ bundle
├── chunk-af6d88c4.js
├── module.js
└── module2.js

Problem:

When using code splitting to reduce redundant code across a project, if there are multiple modules with the same file name in different directories, when rollup writes to the output directory it creates a flat structure. It is smart enough to recognize that multiple files have the same name, and appends a number to differentiate them. While this is working code, it becomes difficult to maintain references to those modules on the pages that require them - the developer has to know which number corresponds to which file.

Is there any way to get rollup to preserve the folder structure when outputting multiple bundles, to show file relationships more clearly? Or if this is not possible through rollup alone, is there another solution that can be taken?

来源:https://stackoverflow.com/questions/52208475/is-there-any-way-to-preserve-directory-structure-of-bundles-when-using-rollup-wi

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!