问题标签 [webpack-bundle-analyzer]

问题

我的问题是 webpack 分析器不断向我显示我不想要的模块。我不知道这是否正常。

代码

我如何运行分析器

包.json：

命令：

结果

我正在我的 vue/shopify-slate/node 项目上运行 webpack-bundle-analyzer，并注意到我的生产负载中包含 babel-runtime 和 core-js（babel-runtime 的依赖项）。我想知道是否可以从生产有效负载中删除这些包？如果是这样，怎么做？

我将组件设置为可动态调用：

索引.tsx

组件/PhoneNumberInput.tsx

所以，react-phone-number-input不应该是初始捆绑包的一部分，对吧？但是当我分析它时它仍然存在。为什么？

我需要将捆绑文件大小作为命令输出或将其写入文件。

我已经考虑过webpack-bundle-analyzer，但命令和 JSON 文件输出似乎做了很多与我的用例无关的事情。

我也考虑过这个bundlesize包，但它主要进行比较检查并将失败或成功状态报告为命令输出。

如果有人对哪些相关工具、命令或标志可以帮助实现这一点有任何想法。将不胜感激。

干杯

当我运行时，npx webpack-cli --analyze --node-env development我收到一个关于它不喜欢的错误<React.StrictMode>：

我正在使用来自.\node_modules\react-scripts\config\webpack.config.js. 为什么 webpack 不喜欢 React.StrictMode？

在我的项目（Next.js v10）中，不可变库用于与 redux 一起使用。现在我解决了优化的问题，因为我遇到了“红色”首先加载js的问题。

我在这方面还不是很强，但我会努力学习和理解一切。我在页面本身上应用了动态导入，正如到处都建议的那样，它有很大帮助，因为情况比现在更糟。我检查了 _document.js 和 _app.js，一切似乎都很好，除了：

因为它现在有效，我得到：

如果我完全关闭序列化和反序列化的使用（在 _app.js 中），并且 index.tsx（没有 redux 请求，也没有 React 以外的导入）只返回一个空 div => 我得到这个：

一些块丢失了，但不可变块仍然存在（尽管由于某种原因它的大小略有不同，但散列是相同的）：

我发现这篇文章：https ://betterprogramming.pub/try-these-instead-of-using-immutable-js-with-redux-f5bc3bd30190并检查https://www.npmtrends.com/immutable-vs-immer- vs-无缝-不可变

问题是整个项目已经在语法 immutable-js (post.get('prop'))

我的问题：

1. Immer 会好多少？
2. 他（Immer）也会“进入大块”吗？
3. 还有什么其他方法可以减小“First Load JS by all”的大小？
4. 也许还有一些其他的缺点，由于缺乏经验，我没有注意到，但在报告中可以看到它们？

谢谢你的帮助！

我正在将 webpack 用于 React 项目并希望包含WebpackBundleAnalyzer，但仅在 npm 脚本中明确指定时（例如，npm run build --withReport true）。默认情况下，我不希望它运行。

我在package.json中的构建脚本很简单：

我的webpack.config.js中的相关片段也是如此：

我的想法是，withReport除非我另外指定（例如，），否则这将是错误的，因此如果我将其关闭（ ） npm run build --withReport true，BundleAnalyzer 将不会npm run build执行。

相反，即使我没有指定，分析器也会执行--withReport。我错过了什么？

我想用转译 monorepo 配置下一个 js 包分析器。
我有一条关于加载程序的错误消息。所以我做了这个堆栈溢出 但它仍然有错误。
如何配置 Nextjs 项目以使用下一个捆绑分析器转换 monorepo 项目？

这是我的错误信息。

这是我的next.config.js。

我对我的项目进行了分析，对于所有的包，我可以看到 astatSize但parsedSize和gzipSize始终为 0。（这适用于位于 中的所有库node_modules）

这是为什么？

我运行了 Webpack Bundle Analyzer 来检查我所有节点模块的大小，但是有多少贡献到我由 Webpack 编译的主要 React JS 包中？

即，如果我的主要 React JS 包在放大和 gzip 后重 1.2MB，并且我的包的一个大小是 500KB 解析和 350KB gzip，这是否意味着我的 1.2MB JS 包的大小是 350KB，因为我的包是 gzip 的？