如何在reactjs中管理供应商库

Question

在我的react js应用程序中（使用webpack），我使用了antd UI，它在项目中添加了 draft-js 包。但是我不知道我在哪里使用了 draft .js
我有两个问题。
1-我怎么知道我在哪里使用Draft-js。
2-draft.js增加了bundle的文件大小。我从draft-js中删除了node_modules，这表明我没有找到错误“ draft-js”。

package.json

"dependencies": {
    "antd": "^3.10.9",
    "axios": "^0.18.0",
    "bundle-loader": "^0.5.6",
    "express-static-gzip": "^1.1.3",
    "moment": "^2.22.1",
    "node-sass": "^4.7.2",
    "normalize.css": "7.0.0",
    "npm": "^6.1.0",
    "rc-time-picker": "^3.3.1",
    "react": "16.0.0",
    "react-dom": "16.0.0",
    "react-ga": "^2.5.3",
    "react-google-maps": "^9.4.5",
    "react-loadable": "^5.5.0",
    "react-redux": "^5.0.7",
    "react-router": "^4.2.0",
    "react-router-dom": "^4.2.2",
    "recompose": "^0.27.1",
    "redux": "^3.7.2",
    "redux-thunk": "^2.2.0"
  },

和 immutable.js 安装两次，另一件事是，在完成gzip和 antd 和 @ ant-designed 库之后，我的< strong> bundle 大小。

那我该如何解决这些麻烦。

Answer 1

要回答您的主要问题，draft-js是应用程序的 transitive 依赖项。为了确定在哪里使用它，您需要查看依赖于它的直接依赖关系的代码（最好是源代码）。在这种情况下，应该是antd@^3.10.9。

虽然有特定的例外情况，但通常不能直接依赖于依赖而不依赖于依赖。

要解决多次安装的ImmutableJS的可感知问题，在不同版本中，将应用相同的逻辑。当您的两个或多个依赖项对同一软件包的非重叠版本具有传递性依赖项时，最终将安装该软件包的多个版本。没有这种行为，就不能依赖您的依赖项。

换句话说，将单个软件包的不兼容版本视为单独的逻辑软件包。

已经说过，可以使用某些工具（例如RequireJS和SystemJS等）来覆盖可传递依赖关系，例如，强制它们使用ImmutableJS的共享版本。但是，此方法虽然功能强大，但必须格外小心，因为它们可能确实取决于特定于最初指定版本的行为。