spartacus-storefront - 如何编辑默认的 spartacus 断点

Question

在 Spartacus 中，我看到了这个breakpoint.service.ts
但是我可以知道如何覆盖或创建一组自定义断点吗？它似乎不包括任何set方法（？）

Answer 1

虽然您可以覆盖该服务，但目的是您使用 typed 配置断点LayoutConfig。您可以使用以下命令配置一个或多个断点ConfigModule：

ConfigModule.withConfig({
  breakpoints: {
    xs: 576,
    sm: 768,
    md: 1024,
    lg: 1200
  },
} as LayoutConfig)

typescript 配置用于控制 DOM。要控制 CSS，您需要使用 scss$grid-breakpoints变量在 CSS 中配置断点。

$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 1024px,
  xl: 1200px,
) !default;

不幸的是，这些配置有点不同步：在 CSS 中，您指定断点的最大值，而在打字稿中您指定最小值。