使用 web pack 优化库

Optimizing libraries with web pack

我正在尝试发布一个小型 React UI 组件库。这些组件有依赖关系:Matarial UI、React Rotuer 等;

当我构建我的代码时,我收到关于超过建议的包大小的警告。我在 451Kib。当我分析我的包时,我注意到其中 96.1% 是从 node_modules.

添加到包中的依赖项

由于我只打算发布少量组件,这些组件也将与 webpack 一起导入,有没有办法从我的包中排除依赖项并将它们打包到使用的任何应用程序的包中我的组件?

我想我需要使用代码拆分、延迟加载或其他方法,但我不确定开始的正确方法。

我可以给你的建议:

  1. Use webpack-node-externals to exclude node_modules from bundle. If your code depends on packages that won't be included in the user app - use whitelist 也将它们捆绑在一起。

  2. 同时在 package.json 中将 Matrial UI、React Rotuer(并且可能做出反应)标记为 peerDependecies