'Webpack bundling behavior for star imports in React.js , webpack 5
lets say I have util.js file in my react project, that has various handy functions I am using across react components.
export const functionOne = () => {
//does something
return some_value;
}
export const functionTwo = () => {
//does something
return some_value;
}
export const functionThree = () => {
//does something
return some_value;
}
and lets consider these 2 scenarios.
First scenario where we are using * imports in react compoent <ComponentA />
import React, { useState } from react;
import * as util from "./util.js";
const ComponentA = () => {
return <button onClick={() => util.functionOne()} > Button </button>
}
export default ComponentA;
Second scenario where we are not doing * import and only importing some specific functions that are inside util.js file in <ComponentA />
import React, { useState } from react;
import { functionOne } from "./util.js";
const ComponentA = () => {
return <button onClick={() => functionOne()} > Button </button>
}
export default ComponentA;
Now when webpack bundles this component <ComponentA /> in first scenario where I am using star import, does it include all the functions inside utils in bundeled file ?
I am not using Create React App.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
