4

它始于此错误：

在此处输入图像描述

所以我做了一个测试以排除问题所在。我测试了我从 GitHub 分叉的库Notistack，然后用npm 链接链接到我的应用程序是否是问题所在。

我将此代码放在应用程序中

window.React2 = require('react');
console.log(window.React1 === window.React2);

我把这段代码放在了分叉的 Notistack

window.React1 = require('react');

当我运行该应用程序时，我可以在控制台中看到我false从该测试中获得了一个。表明我有两个不同的 React 版本并导致错误。

如果我现在在库中为 React 包做 npm 链接，那么 Notistack 正在使用应用程序的 React 版本。然后我摆脱了这个错误。

我在这里缺少什么，为什么即使我peerDependencies用于 React 也必须这样做。

"peerDependencies": {
    "@material-ui/core": "^4.0.0",
    "react": "^16.8.0 || ^17.0.0",
    "react-dom": "^16.8.0 || ^17.0.0",
    "react-redux": "^7.2.5"
},

包.json

{
    "name": "notistack",
    "version": "1.0.10",
    "description": "Highly customizable notification snackbars (toasts) that can be stacked on top of each other",
    "main": "dist/index.js",
    "module": "dist/notistack.esm.js",
    "types": "dist/index.d.ts",
    "license": "MIT",
    "author": {
        "name": "Hossein Dehnokhalaji",
        "email": "hossein.dehnavi98@yahoo.com",
        "url": "https://github.com/iamhosseindhv/notistack"
    },
    "homepage": "https://www.iamhosseindhv.com/notistack",
    "repository": {
        "url": "git+https://github.com/iamhosseindhv/notistack.git",
        "type": "git"
    },
    "scripts": {
        "build": "tsdx build --transpileOnly --entry ./src/index.js",
        "prebuild": "npm run docs",
        "prepublishOnly": "npm run build",
        "docs": "rimraf typedoc.json && typedoc --tsconfig",
        "lint": "eslint . --ext .js,.jsx,.ts,.tsx"
    },
    "peerDependencies": {
        "@material-ui/core": "^4.0.0",
        "react": "^16.8.0 || ^17.0.0",
        "react-dom": "^16.8.0 || ^17.0.0",
        "react-redux": "^7.2.5"
    },
    "devDependencies": {
        "@babel/preset-react": "^7.8.3",
        "@material-ui/core": "^4.9.5",
        "@types/node": "^13.9.0",
        "@types/react": "^16.9.23",
        "@types/react-dom": "^16.9.5",
        "@types/react-is": "^16.7.1",
        "@typescript-eslint/eslint-plugin": "^3.9.1",
        "@typescript-eslint/parser": "^3.9.1",
        "babel-plugin-optimize-clsx": "^2.6.1",
        "eslint": "^7.7.0",
        "eslint-config-airbnb": "~18.2.0",
        "eslint-plugin-import": "~2.22.0",
        "eslint-plugin-jsx-a11y": "^6.3.1",
        "eslint-plugin-react": "^7.20.6",
        "react": "^16.8.0 || ^17.0.0",
        "react-dom": "^16.8.0 || ^17.0.0",
        "rimraf": "^3.0.2",
        "rollup-plugin-bundle-size": "^1.0.3",
        "rollup-plugin-copy": "^3.3.0",
        "tsdx": "^0.13.2",
        "typedoc": "^0.16.11",
        "typescript": "^3.8.3"
    },
    "dependencies": {
        "clsx": "^1.1.0",
        "hoist-non-react-statics": "^3.3.0"
    },
    "bugs": {
        "url": "https://github.com/iamhosseindhv/notistack/issues"
    },
    "funding": {
        "type": "opencollective",
        "url": "https://opencollective.com/notistack"
    },
    "contributors": [
        "Hossein Dehnokhalaji (https://www.iamhosseindhv.com/)"
    ],
    "keywords": [
        "notistack",
        "enqueueSnackbar",
        "snackbarprovider",
        "useSnackbar",
        "multiple",
        "react",
        "javascript",
        "material-ui",
        "toast",
        "redux",
        "snackbar",
        "stacked",
        "notification",
        "material design",
        "hossein",
        "dehnokhalaji",
        "iamhosseindhv"
    ]
}
4

0 回答 0