为什么在创建包时必须在 webpack 配置中将我的 peerDependencies 列为外部对象？

Question

我在 React 中使用 create-react-app 创建了一个 npm 包。由于react和react-dom被假定在宿主项目中，我将它们列为我的 package.json 中的 peerDependencies 和 devDependencies。

我了解到通过这种方式两者仍然被捆绑在一起，并且为了防止我必须在 webpack 配置的外部列出它们，我成功地做到了：

externals: {        
  react: {          
      commonjs: 'react',          
      commonjs2: 'react',          
      amd: 'React',          
      root: 'React',      
  },      
  'react-dom': {          
      commonjs: 'react-dom',          
      commonjs2: 'react-dom',          
      amd: 'ReactDOM',          
      root: 'ReactDOM',      
  },  
},

我的问题是：为什么我必须经历这第二步？不应该将它们列为 peerDependencies 就足够了吗？如果不是，在这种情况下， peerDependencies 与常规依赖项有何不同？

Answer 1

对等依赖由 npm 理解，外部依赖由 webpack 理解。两者的意思相同，但由完全不同的软件处理。

虽然运行npm install不会安装任何对等依赖项，但 webpack 仍会尝试遍历依赖项树以尝试找到它们，如果它们在代码中被引用。将它们标记为 external 告诉 webpack 显式忽略它们并且不要尝试遍历该依赖分支，即使这些对等依赖已经安装。