Redux示例 - 捆绑优化

Question

redux存储库有一组示例。问题是它们用于开发构建，我将它们用作应用程序的模板。

这个特例 - https://github.com/reactjs/redux/blob/master/examples/real-world/webpack.config.js 构建一个4MB的bundle.js。

我已经尝试过缩小代码，但我无法缩小捆绑包的大小。我做错了什么？

Answer 1

您需要minimize和tree-shake。

可以找到一个工作示例redux-auto/example。您可以通过运行npm build @ 0.27MB vs {{1}生成生产包} @ 1.16 MB =节省了420％

redux-auto示例还附带hot-reloading，ES6，React＆amp; Redux如果你想用它作为基础

如果您想在自己的项目中执行此操作，请查看webpack.prod.js和.babelrc

Answer 2

你能说出它是否捆绑了React吗？这对捆绑的大小来说是一个很大的补充。您可以通过将其添加到webpack.config.js来将其从构建中排除：

externals: {
        "react": "React",
        "react-dom": "ReactDOM"
    }

然后，您将通过本地或CDN上托管的另一个脚本标记单独提供React和ReactDOM。