webpack - Webpack 不尊重 package.json 中的“模块”字段

Question

我试图弄清楚Webpack中的tree-shaking，我注意到在这个Example1上运行是 11kB，而在Example2上是 7kB。-webpack -optimize-minimize

该库Rambda在其package.json. 据我所见， Webpack不尊重它，我需要明确引用esm文件位置。

问题是错误还是功能？

示例 1

import {add} from 'rambda'

function fn(x) {
  return add(2)(x)
}
console.log(fn(3))

示例 2

import {add} from 'rambda/dist/rambda.esm.js'

function fn(x) {
  return add(2)(x)
}
console.log(fn(3))

Answer 1

我发现这是一个记录在案的错误 - https://github.com/webpack/webpack/issues/4674

当前的行为是什么？当模块的 package.json 包含 browser、module 和 main 字段时，webpack 默认捆绑浏览器构建。

该错误未解决 6 个月，因此解决方案很丑 - 从 中删除浏览器字段package.json，因此Webpack可以使用模块字段。