Obligatory apologies if this has been asked before, but I've been unable to find an answer online or in the webpack docs related to tree shaking.
How does tree-shaking work with default parameters? For context: I'm specifically concerned with how the webpack implementation of tree-shaking handles default parameters.
Given the following hypothetical application structure:
/
|_ dependency/
| |
| |_ dependency.js
| |_ moderatelyLargeFile.js
|
|
|_src/
|
|_ application.js
|_ someSmallFile.js
and the following code in each file:
dependency.js
import moderatelyLargeFile from './moderatelyLargeFile.js';
import { someParsingFunction1, someParsingFunction2 } from 'somewhere-else-dependency';
export default function parseSomeFile(file = moderatelylargeFile) {
let parsedResult = { ...someParsingFunction1(file), ...someParsingFunction2(file) };
return parsedResult;
}
application.js
import parseSomeFile from './dependency/dependency.js';
import someSmallFile from './someSmallFile.js'
let result = parseSomeFile(someSmallFile);
// Do other application stuff with result
Would moderatelyLargeFile.js
ever be bundled into the webpack build of application.js
? Is webpack smart enough to know that the default parameter is never referenced because the single invocation provides that parameter? Or does the moderatelyLargeFile.js
always get bundled regardless because it is part of the function definition?