首页 > 解决方案 > NPM 不正确的依赖解析顺序

问题描述

我正在开发一个 ReactJS 应用程序,该应用程序无法使用自动生成的package-lock.json. 但是,对于我的同事来说,它在生产和本地都运行良好。我在运行时遇到的错误npm start

./node_modules/react-datepicker/es/index.js
8297:8-17 'react-popper' does not contain an export named 'Reference'.

包-lock.json:

...
"react-datepicker": {
    "version": "2.1.0",
    "resolved": "http://packages.je-labs.com/npm/private-npm/react-datepicker/-/react-datepicker-2.1.0.tgz",
    "integrity": "sha512-zsPqierShVc0NN+JCyJO18jMFDTbGNSgmekQm+Zr5JYH/aZShsjOBGQmjNiQmIw7nJNQDRzh1oQUND3TY/9Swg==",
    "requires": {
        "classnames": "^2.2.5",
        "date-fns": "^2.0.0-alpha.23",
        "prop-types": "^15.6.0",
        "react-onclickoutside": "^6.7.1",
        "react-popper": "^1.0.2"
    },
    "dependencies": {
        "react-popper": {
            "version": "1.3.3",
            "resolved": "http://packages.je-labs.com/npm/private-npm/react-popper/-/react-popper-1.3.3.tgz",
            "integrity": "sha512-ynMZBPkXONPc5K4P5yFWgZx5JGAUIP3pGGLNs58cfAPgK67olx7fmLp+AdpZ0+GoQ+ieFDa/z4cdV6u7sioH6w==",
            "requires": {
                "@babel/runtime": "^7.1.2",
                "create-react-context": "<=0.2.2",
                "popper.js": "^1.14.4",
                "prop-types": "^15.6.1",
                "typed-styles": "^0.0.7",
                "warning": "^4.0.2"
            }
        }
    }
},
"reactstrap": {
    "version": "6.5.0",
    "resolved": "http://packages.je-labs.com/npm/private-npm/reactstrap/-/reactstrap-6.5.0.tgz",
    "integrity": "sha1-umVeMmRuJiGCn2H6oDPmB+xmJOU=",
    "requires": {
        "classnames": "^2.2.3",
        "lodash.isfunction": "^3.0.9",
        "lodash.isobject": "^3.0.2",
        "lodash.tonumber": "^4.0.3",
        "prop-types": "^15.5.8",
        "react-lifecycles-compat": "^3.0.4",
        "react-popper": "^0.10.4",
        "react-transition-group": "^2.3.1"
    }
},
"react-popper": {
    "version": "0.10.4",
    "resolved": "http://packages.je-labs.com/npm/private-npm/react-popper/-/react-popper-0.10.4.tgz",
    "integrity": "sha1-rypBXqIike3VBGeNev2opu4ylao=",
    "requires": {
        "popper.js": "^1.14.1",
        "prop-types": "^15.6.1"
    }
}
...

我相信上面的错误是由于在根级别定义react-datepicker的使用而不是react-popper@1.3.3根据其子依赖项使用的事实引起的。react-popper@0.10.4如下更新后package-lock.json,错误消失(注意根react-popper@0.10.4被移动到reactstrap子依赖项)

...
"reactstrap": {
    "version": "6.5.0",
    "resolved": "http://packages.je-labs.com/npm/private-npm/reactstrap/-/reactstrap-6.5.0.tgz",
    "integrity": "sha1-umVeMmRuJiGCn2H6oDPmB+xmJOU=",
    "requires": {
        "classnames": "^2.2.3",
        "lodash.isfunction": "^3.0.9",
        "lodash.isobject": "^3.0.2",
        "lodash.tonumber": "^4.0.3",
        "prop-types": "^15.5.8",
        "react-lifecycles-compat": "^3.0.4",
        "react-popper": "^0.10.4",
        "react-transition-group": "^2.3.1"
    },
    "dependencies": {
        "react-popper": {
            "version": "0.10.4",
            "resolved": "http://packages.je-labs.com/npm/private-npm/react-popper/-/react-popper-0.10.4.tgz",
            "integrity": "sha1-rypBXqIike3VBGeNev2opu4ylao=",
            "requires": {
                "popper.js": "^1.14.1",
                "prop-types": "^15.6.1"
            }
        }
    }
},
"react-datepicker": {
    "version": "2.1.0",
    "resolved": "http://packages.je-labs.com/npm/private-npm/react-datepicker/-/react-datepicker-2.1.0.tgz",
    "integrity": "sha512-zsPqierShVc0NN+JCyJO18jMFDTbGNSgmekQm+Zr5JYH/aZShsjOBGQmjNiQmIw7nJNQDRzh1oQUND3TY/9Swg==",
    "requires": {
        "classnames": "^2.2.5",
        "date-fns": "^2.0.0-alpha.23",
        "prop-types": "^15.6.0",
        "react-onclickoutside": "^6.7.1",
        "react-popper": "^1.0.2"
    },
    "dependencies": {
        "react-popper": {
            "version": "1.3.3",
            "resolved": "http://packages.je-labs.com/npm/private-npm/react-popper/-/react-popper-1.3.3.tgz",
            "integrity": "sha512-ynMZBPkXONPc5K4P5yFWgZx5JGAUIP3pGGLNs58cfAPgK67olx7fmLp+AdpZ0+GoQ+ieFDa/z4cdV6u7sioH6w==",
            "requires": {
                "@babel/runtime": "^7.1.2",
                "create-react-context": "<=0.2.2",
                "popper.js": "^1.14.4",
                "prop-types": "^15.6.1",
                "typed-styles": "^0.0.7",
                "warning": "^4.0.2"
            }
        }
    }
}

...

根据我对 npm 包解析的了解,依赖关系是从树的底部开始解析的,因此初始的“package-lock.json”应该很好。尝试使用节点 v10、v11 和 v12 运行它,并且在所有情况下都得到相同的错误。由于我的同事和生产环境都运行良好,我假设这一定与我的本地环境有关,但无法找出错误的根本原因。

标签: node.jsreactjsnpm

解决方案


推荐阅读