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

Question

我使用 create-react-app 在 React 中创建了一个 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 仍会尝试遍历依赖树以尝试找到它们。将它们标记为外部告诉 webpack 显式忽略它们并且不尝试遍历该依赖项分支，即使已经安装了这些对等依赖项也是如此。