./src/foo.js

const foo = (foo) => {
  console.log(`foo: ${foo}`);
}

export default foo;

./src/bar.js

import foo from './foo';

const bar = (bar) => {
  foo(bar);
  console.log(`bar: ${bar}`);
}

export default bar;

./src/index.ts

import foo from './foo';
import bar from './bar';

if (test === 'foo') {
  foo('test === foo');
}
if (test === 'bar') {
  bar('test === bar');
}

With simple rollup config (just set input and output) I get what i want (simple clear bundled js)

const foo = (foo) => {
  console.log(`foo: ${foo}`);
};

const bar = (bar) => {
  foo(bar);
  console.log(`bar: ${bar}`);
};

if (test === 'foo') {
  foo('test === foo');
}
if (test === 'bar') {
  bar('test === bar');
}

Can I have something like this via webpack? The closest I got is this config

const path = require('path');

module.exports = {
  mode: 'production',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'webpackdist'),
    iife: false,
  },
  optimization: {
    minimize: false,
  },
}

That produces this bundled js

/******/ "use strict";
var __webpack_exports__ = {};

;// CONCATENATED MODULE: ./src/foo.js
const foo = (foo) => {
  console.log(`foo: ${foo}`);
}

/* harmony default export */ const src_foo = (foo);

;// CONCATENATED MODULE: ./src/bar.js


const bar = (bar) => {
  src_foo(bar);
  console.log(`bar: ${bar}`);
}

/* harmony default export */ const src_bar = (bar);

;// CONCATENATED MODULE: ./src/index.js



if (test === 'foo') {
  src_foo('test === foo');
}
if (test === 'bar') {
  src_bar('test === bar');
}

But i dont want

• webpack comments (but leave comments from source files)
• src_foo/src_bar
• __webpack_exports__