source.resolveExtensionPrefix#

• Type: string | Record<BuilderTarget, string>
• Default: undefined

Add a prefix to resolve.extensions.

If multiple files share the same name but have different extensions, Modern.js will resolve the one with the extension listed first in the array and skip the rest.

Example#

export default {
  source: {
    resolveExtensionPrefix: '.web',
  },
};

With the configuration above, the extensions array will become:

// before
const extensions = ['.js', '.ts', ...];

// after
const extensions = ['.web.js', '.js', '.web.ts' , '.ts', ...];

When import './foo' in the code, the foo.web.js file will be resolved first, then the foo.js file.

Set according to Targets#

When you build multiple targets at the same time, you can set different extension prefix for different targets. At this point, you need to set resolveExtensionPrefix to an object whose key is the corresponding build target.

For example to set different extension prefix for web and node:

export default {
  output: {
    source: {
      resolveExtensionPrefix: {
        web: '.web',
        node: '.node',
      },
    },
  },
};

When import './foo' in the code, the foo.node.js file will be resolved for node target, and the foo.web.js file will be resolved for web target.