如何在使用Snipcart时介绍自己的风格？

Question

我正在建立一个电子商务平台使用GatsbyJS和Snipcart。它工作得很好，但我想覆盖Snipcart提供的默认主题，并且当我因为某些原因想要通过gatsby-config.js更改主要的默认CSS时，它不能工作。有谁有解决方案吗？谢谢。下面的代码使snipcart停止工作，就在我添加样式选项的时候：

  {
    resolve: 'gatsby-plugin-snipcartv3',
    options: {
      apiKey: 'API_IS_HIDDEN_FOR_A_REASON',
      autopop: true,
      styles: '.src/components/layout.css'
    }
  },

问题是如何让Snipcart3在与GatsbyJS一起使用时接受我提供的不同样式？我试过他们的文档，但没有太多，我也在github上看过。

Answer 1

我发现最简单的方法如下：

1. 在snipcart插件配置选项中，将样式设置为false，这样它就不会链接默认样式表

​

{
  resolve: 'gatsby-plugin-snipcartv3',
  options: {
    apiKey: process.env.SNIPCART_KEY,
    autopop: false,
    styles: false
    }
 }

​

Snipcart创建一个新的样式表(例如，将样式从Snipcart的默认样式表src/styles/cart.css)

• Copy到您的

• 中，然后将所需的gatsby-browser.js)

设置为您的cart.css到您的布局组件中(或

1. 中