将加密浏览器添加到 Gatsby 项目

Question

我想将 use-shopping-cart (https://useshoppingcart.com/) 添加到我的 Gatsby 项目中。 当我尝试使用它时，我得到了这个错误：

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules 
by default.
This is no longer the case. Verify if you need this module and configure a
polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "crypto":
require.resolve("crypto-browserify") }'
    - install 'crypto-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "crypto": false }

如何将crypto-browserify 添加到 gatsby？作为gatsby-config.js内的插件？

谢谢！

Answer 1

此类问题 (BREAKING CHANGE: webpack < 5 used to include polyfills for node.js...) 依赖于 webpack has removed polyfills in their new v5 version，这是 use-shopping-cart 所需的依赖项。

应该通过安装crypto-browserify（npm i crypto-browserify）并在您的gatsby-node.js 中将以下后备添加到 webpack 的覆盖配置中来修复它，onCreateWebpackConfig API 应该可以工作：

exports.onCreateWebpackConfig = ({ actions }) => {
  actions.setWebpackConfig({
   resolve: {
      fallback: {
        crypto: require.resolve('crypto-browserify'),
      },
    },
  })
}

或者，如果您不想包含 polyfill，则可以使用这样的空模块：

exports.onCreateWebpackConfig = ({ actions }) => {
  actions.setWebpackConfig({
   resolve: {
      fallback: {
        "crypto": false
      },
    },
  })
}