使用的Exports和sideEffects是什么？

Question

usedExportsin optimizationof webpack config 和sideEffectsin到底有什么区别package.json？

Answer 1

这是两件不同的事情。

有关usedExports：

将此视为对 Webpack 的指令，允许它执行两件事：

• 允许将导出的标识符重命名为较短版本（名称修改），默认情况下，在捆绑过程中，不会重命名导出的修饰符。
• 允许不从模块导出未使用的导出。默认情况下，所有导出的标识符（变量、函数、类等）都会被导出，即使代码中没有使用这些标识符。

例如，在代码中

// MODULE A
export const myVariable = 10;

export const myFunction1 = () => a1;

export const myFunction2 = () => a2();


// MODULE B
import { myVariable } from './a.js';

// MODULE C
import { myFunction1 } from './a.js';

启用此标志后，在上面的代码中，由于代码中没有使用该标志，因此在导出模块myFunction2时不会导出它。a.js接下来它可能会尝试重命名myVariable为单字母标识符，例如aand myFunction1tob或类似的。这不仅适用于您编写的模块，也适用于来自的模块node_modules。

有关sideEffects：

尽管像 webpack 这样的模块捆绑器足够智能，可以确定给定模块中是否存在副作用，但提供明确的sideEffects提示可以增加捆绑器的信心。

在进行生产捆绑时，仅当启用标志时才使用sideEffects和。usedExportsoptimization.providedExports