运行npm -dom显示重复的

Question

我运行了npm ls react-dom命令，得到了下面的输出

│ ├── react-dom@17.0.0 deduped invalid: "~0.14 || ^15.0.0 || ^16.0.0" from node_modules/jodit-react, "^16.9.0" from node_modules/react-datepicker, "0.14.x || 15.x.x || 16.x.x" from node_modules/react-daterange-picker, "^16.0.0" from node_modules/react-google-login, "^0.14.0 || ^15.0.0 || ^16.0.0" from node_modules/react-lazyload, "^0.14 || ^15.0.0 || ^ 16.0.0" from node_modules/react-meta-tags, "^0.14.6 || 15.x.x || 16.x.x" from node_modules/react-paypal-button-v2, "^16.8.0" from node_modules/react-select, "^16.7.0" from node_modules/react-social-sharing
│ ├─┬ styled-components@4.4.1
│ │ └── react-dom@17.0.0 deduped invalid: "~0.14 || ^15.0.0 || ^16.0.0" from node_modules/jodit-react, "^16.9.0" from node_modules/react-datepicker, "0.14.x || 15.x.x || 16.x.x" from node_modules/react-daterange-picker, "^16.0.0" from node_modules/react-google-login, "^0.14.0 || ^15.0.0 || ^16.0.0" from node_modules/react-lazyload, "^0.14 || ^15.0.0 || ^ 16.0.0" from node_modules/react-meta-tags, "^0.14.6 || 15.x.x || 16.x.x" from node_modules/react-paypal-button-v2, "^16.8.0" from node_modules/react-select, "^16.7.0" from node_modules/react-social-sharing, "^15.5.4 || ^16.0.0-0" from node_modules/react-stripe-elements, "^15.0.0 || ^16.0.0" from node_modules/react-with-firebase-auth
│ └─┬ styled-is@1.3.0
│   └── react-dom@17.0.0 deduped invalid: "~0.14 || ^15.0.0 || ^16.0.0" from node_modules/jodit-react, "^16.9.0" from node_modules/react-datepicker, "0.14.x || 15.x.x || 16.x.x" from node_modules/react-daterange-picker, "^16.0.0" from node_modules/react-google-login, "^0.14.0 || ^15.0.0 || ^16.0.0" from node_modules/react-lazyload, "^0.14 || ^15.0.0 || ^ 16.0.0" from node_modules/react-meta-tags, "^0.14.6 || 15.x.x || 16.x.x" from node_modules/react-paypal-button-v2, "^16.8.0" from node_modules/react-select, "^16.7.0" from node_modules/react-social-sharing, "^15.5.4 || ^16.0.0-0" from node_modules/react-stripe-elements, "^15.0.0 || ^16.0.0" from node_modules/react-with-firebase-auth, "^16.8.4" from node_modules/react-social-sharing/node_modules/styled-is
├─┬ react-stripe-elements@5.0.1
│ └── react-dom@17.0.0 deduped invalid: "~0.14 || ^15.0.0 || ^16.0.0" from node_modules/jodit-react, "^16.9.0" from node_modules/react-datepicker, "0.14.x || 15.x.x || 16.x.x" from node_modules/react-daterange-picker, "^16.0.0" from node_modules/react-google-login, "^0.14.0 || ^15.0.0 || ^16.0.0" from node_modules/react-lazyload, "^0.14 || ^15.0.0 || ^ 16.0.0" from node_modules/react-meta-tags, "^0.14.6 || 15.x.x || 16.x.x" from node_modules/react-paypal-button-v2, "^16.8.0" from node_modules/react-select, "^16.7.0" from node_modules/react-social-sharing, "^15.5.4 || ^16.0.0-0" from node_modules/react-stripe-elements
├─┬ react-transition-group@4.4.1
│ └── react-dom@17.0.0 deduped invalid: "~0.14 || ^15.0.0 || ^16.0.0" from node_modules/jodit-react, "^16.9.0" from node_modules/react-datepicker, "0.14.x || 15.x.x || 16.x.x" from node_modules/react-daterange-picker, "^16.0.0" from node_modules/react-google-login, "^0.14.0 || ^15.0.0 || ^16.0.0" from node_modules/react-lazyload, "^0.14 || ^15.0.0 || ^ 16.0.0" from node_modules/react-meta-tags, "^0.14.6 || 15.x.x || 16.x.x" from node_modules/react-paypal-button-v2, "^16.8.0" from node_modules/react-select, "^16.7.0" from node_modules/react-social-sharing, "^15.5.4 || ^16.0.0-0" from node_modules/react-stripe-elements
└─┬ react-with-firebase-auth@1.0.5
  └── react-dom@17.0.0 deduped invalid: "~0.14 || ^15.0.0 || ^16.0.0" from node_modules/jodit-react, "^16.9.0" from node_modules/react-datepicker, "0.14.x || 15.x.x || 16.x.x" from node_modules/react-daterange-picker, "^16.0.0" from node_modules/react-google-login, "^0.14.0 || ^15.0.0 || ^16.0.0" from node_modules/react-lazyload, "^0.14 || ^15.0.0 || ^ 16.0.0" from node_modules/react-meta-tags, "^0.14.6 || 15.x.x || 16.x.x" from node_modules/react-paypal-button-v2, "^16.8.0" from node_modules/react-select, "^16.7.0" from node_modules/react-social-sharing, "^15.5.4 || ^16.0.0-0" from node_modules/react-stripe-elements, "^15.0.0 || ^16.0.0" from node_modules/react-with-firebase-auth

好像有重复的。我该怎么处理？

Answer 1

我有同样的问题，并阅读了这篇文章：

https://blog.elantha.com/more-than-one-copy-of-react-in-the-same-app/

在我的例子中，我用“”创建了一个应用程序，所以第二个解决方案用这里解释的方法为我修复了它。我不得不重新作出反应。

https://www.npmjs.com/package/react-app-rewired

步骤：

1-在项目的命令行中写

npm install react-app-rewired --save-dev

2-在根目录中创建一个名为config-overrides.js的文件，自述就是其中之一。

3-在文件中编写以下代码：

​

const path = require('path');

module.exports = { 
  webpack(config) {
    config.resolve.alias['react']
      = path.resolve(__dirname, 'node_modules/react');
      
    return config;
  }
};

​

打开package.json，找到“脚本”。“翻转”现有的react调用-- npm脚本中用于启动、构建和测试的脚本，您应该得到如下代码：

 "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "format": "prettier --write .",
    "test": "react-app-rewired test",
    "eject": "react-scripts eject"
  },

5-现在，在您用命令"npm“启动服务器之后，您的站点就可以工作了。