问题标签 [webpack-bundle-analyzer]

我试图用 进行分析webpack-bundle-analyzer，但它没有向我显示报告。

开发.js：

bin/webpack-dev-server：

但是当我在控制台中运行时bin/webpack-dev-server，我看到了输出：

正如我所料，没有任何带有 webpack-bundle-analyzer 报告的窗口显示。我究竟做错了什么？

我正在使用 jhipster 网关应用程序作为微服务的网关。

为了分析我的 webpack 包，我正在尝试以下方法

冉npm install -g webpack-bundle-analyzer

在您的 Angular 应用程序中，运行ng build --stats-json

在这里我收到如下错误

我对 webpack 相当陌生，我有一个使用vue cli. 在使用 分析 webpack 包（使用 内置于生产模式vue-cli-service build）webpack-bundle-analyzer时，我发现一个特定文件bn.js多次包含在包中。运行时npm ls bn.js我发现它的父依赖就是webpack它本身。

所以我的问题是，为什么在项目中将 webpack 添加为 devDependency（之前它是一个依赖项，然后我将其更改为 devDepenency）时，webpack 在最终包中包含它自己的依赖项？

或者，如果这是正确的行为，请指出我解释此行为的任何文档/资源。

在 Angular 8 应用程序中，我的组件有一个可以导出到 excel 文件的表。我为此使用了 xlsx 库。webpack-bundle-analyzer 显示 xlsx 库使用了我总块大小的 65%。

由于导出功能很少使用，我想将其从初始捆绑包中排除，以提高大多数用户的性能，并在用户单击“导出”时加载它，无论如何他们都需要等待下载。

这是我目前拥有的：

我会想象这样的事情：

有没有办法做到这一点？或者你有什么其他建议吗？

在我们的项目Webpack-bundle-analyzer插件中说捆绑使用特定模块（js文件）6次。

制作项目的最佳方法是什么，因为它只使用一个（而不是多个）？我知道它们可能来自依赖项的依赖，但是应该如何解决这样的问题呢？

我可以手动检查我的 APP 是否存在可能的代码中断，但目标肯定是使用一个bn.js. 我们package.json不直接将它包含在任何依赖项中。

我正在尝试通过使用https://www.npmjs.com/package/@next/bundle-analyzer来减小我网站的捆绑包大小

此刻，当我npm analyze与

它没有输出具有所需可视化效果的 html 文件。

这是我的next.config.js

使用这个nextjs-analyze-app-bundle 教程。

出了什么问题？

创建一个将所有导入文件放入其中的文件是否正确？

像我之前的许多人一样，我已经在我的项目中达到了我试图缩小我的捆绑包大小的地步。

我不明白的是我有两种不同的 Mapbox。使用 Webpack 包分析器分析我的包时：

地图框 1：

地图框 2：

我不明白第二个 Mapbox 的目的。什么是 mapbox-gl-csp-worker.js，它与 mapbox-gl.js 有何不同？

我目前正在减少我的包大小以部署我的项目。我注意到蓝图占据了包的很大一部分，使用 Brotli 压缩时大约 130kb：

任何有 BlueprintJS 经验的人都可以分享减小尺寸的技巧吗？我喜欢这个框架，所以我宁愿保留它而不是切换到更小的替代方案。

我正在考虑将我的项目转换为 Preact 以缩小我的包大小。我想看看 Preact 是否确实创建了一个更小的包。但是，经过比较，差异比我预期的要小。

预演，39kb：

反应 45kb：

我在实施中做错了吗？

我preact build --analyze使用 webpack-bundle-analyzer 分析了 Preact 包并用于 React 应用程序。