Sapper - импортированные s css стили исчезают - PullRequest
Новая
       133

Sapper - импортированные s css стили исчезают

0 голосов
/ 16 июня 2020

У меня странная проблема, которая может быть связана с тряской ногой. Я создаю приложение sapper и в своей конфигурации rollup использую пакет svelte-preprocess и настраиваю его следующим образом: 

const preprocessOptions = {
  scss: {
    data: `@import '${join(process.cwd(), "src/styles/main.scss")}';`,
    includePaths: ["node_modules", "src"],
  },
  postcss: {
    plugins: [
      require("autoprefixer"),
      require("cssnano")({
        preset: "default",
      }),
    ],
    minimize: !isDevelopment,
    sourceMap: isDevelopment,
  },
};

Через плагин scss копирую глобальную таблицу стилей main.s css. Кажется, применяются все стили, кроме стилей body. Каким-то образом они игнорируются, потому что, когда я проверяю стили тела в консоли разработчика, он пуст. Разве вы не можете получить доступ к телу в Саппере, или, может быть, есть особый способ сделать это?

1 Ответ

1 голос
/ 21 июня 2020

Проблема в том, что с Sapper тело является частью шаблона. html файла. Это означает, что нет компонента с элементом body. Svelte удалит стили, которые не используются в вашем компоненте, если они явно не отмечены как global. В этом может помочь глобальный препроцессор . Я думаю, что в вашем случае я бы просто попросил сборщика создать отдельный файл css для шаблона. html и включить его явно, как global. css: 

...
%sapper.base%

<link rel='stylesheet' href='global.css'>
...
...