如何使用 Webpack 5 对节点模块使用树抖动？答案

【问题标题】：How to use tree shaking for node modules with Webpack 5?如何使用 Webpack 5 对节点模块使用树抖动？
【发布时间】：2021-01-24 14:59:39
【问题描述】：

我想提高我的网站性能。我最近看到灯塔中未使用的 javascript 出现错误。

我检查了捆绑包，显然那些未使用的 javascript 实际上是从我下载的其他模块和节点包中使用的。例如，@sentry/node 是我正在使用的，但报告显示来自 @sentry/hub 的未使用的 javascript。但我只安装了@sentry/node，而不是整个@sentry 包。此外，@sentry/node 正在使用@sentry/hub，但我没有在我的代码中的任何地方导入@sentry/hub（我认为这会导致问题）

我已将"sideEffects": false 包含到我的package.json 文件中，但似乎没有任何效果

【问题讨论】：

你找到了一个解决方案，用另一个包运行相同的东西。

标签： javascript node.js reactjs webpack tree-shaking

【解决方案1】：

您可以尝试解构，只针对您正在使用的对象（或函数）。

例如

import { Component } from 'react';

因此，为你...

import { yourFunction } from `@sentry/node`;

或者只需输入您正在使用的代码@sentry/node。 ?‍♂️

否则，请显示您的代码：

package.json
webpack.config.js
您的“索引”文件（导入脚本和其他文件的位置）
你导入@sentry/node的文件

【讨论】：