小编use*_*760的帖子

我制作了一个导出单个组件的小型 npm 包。该组件使用 SCSS 模块设计样式，并使用 Rollup 捆绑在一起。一切似乎都工作正常，但是当我将它导入到 NextJS 项目中时，我注意到这些样式没有应用于从 NextJS 发送的 SSR 文档（它们最终确实得到了应用，但是有一个问题，组件未设置样式）。

这是我第一次创建 npm 包，也是第一次使用 Rollup，我很难弄清楚如何解决这个问题。也许我不需要将 CSS 捆绑到 .js 文件中并指示用户自己导入 css 文件？不过，我试图避免采取额外的步骤。也许使用 CSS-in-JS 可以解决这个问题，但如果可以避免的话，我宁愿不添加依赖项。

任何指示将不胜感激！

我的汇总配置如下所示：

const config = [
  {
    input: "src/lib/index.ts",
    output: [
      {
        file: pkg.main,
        format: "cjs",
        sourcemap: true,
      },
      {
        file: pkg.module,
        format: "esm",
        sourcemap: true,
      },
    ],
    plugins: [
      peerDepsExternal(),
      resolve(),
      commonjs(),
      url(),
      svgr(),
      typescript({ tsconfig: "./tsconfig.json", rootDir: "src/lib" }),
      postcss({
        modules: true,
      }),
      terser(),
      bundleSize(),
      visualizer(),
    ],
  },
  {
    input: "dist/esm/types/index.d.ts",
    output: [{ …

所以我尝试使用 ScrollViewReader 以编程方式滚动水平滚动视图。我认为它会像 UIKit 中带有 .centeredHorizo​​ntally 的scrollToItem一样工作，并且在大多数情况下都是如此，但是滚动视图中的最后几个元素被强制滚动到屏幕中心，尽管事实上滚动视图是“通常无法滚动那么远（至少在释放拖动后不会快速返回）。这最终会在屏幕的后半部分创建空白区域。

我已经看到了一些关于此的其他问题，似乎普遍的意见是这不是一个错误？一方面，我想我们告诉滚动视图将项目居中，而它正是这样做的——所以，这不是一个错误吗？另一方面，类似的功能在 UIKit 中并不是这样工作的。此外，这种行为仅发生在滚动视图的尾端！如果这是预期的行为，我希望使用 .center 锚点滚动到滚动视图中的第一个元素将迫使其进入屏幕中心并留下前导空白，但这不会发生。

有一个优雅的解决方案吗？或者我们是否必须计算元素的宽度 + 间距，并根据屏幕宽度计算出是否应该锚定 .center 或只是滚动到带有锚点 .trailing 的最后一个元素，以便复制 UIKit 行为？