Блог

Главная - Вопросы по программированию - Не удается заставить Sass работать с @snowpack/app-template-react-typescript

Не удается заставить Sass работать с @snowpack/app-template-react-typescript

#reactjs #typescript #sass #snowpack

#reactjs #typescript #sass #снежный покров

Вопрос:

Я пытаюсь заставить Sass работать с @snowpack /app-template-react-typescript
Я следил за этим. Я пытался создать новый проект и добавить его, но все равно ничего не работает: (

snowpack.config.js

 /** @type {import("snowpack").SnowpackUserConfig } */
module.exports = {
  mount: {
    public: '/',
    src: '/_dist_',
  },
  plugins: [
    '@snowpack/plugin-react-refresh',
    '@snowpack/plugin-dotenv',
    '@snowpack/plugin-typescript',
    '@snowpack/plugin-sass',
  ],
  install: [
    /* ... */
  ],
  installOptions: {
    /* ... */
  },
  devOptions: {
    /* ... */
  },
  buildOptions: {
    /* ... */
  },
  proxy: {
    /* ... */
  },
  alias: {
    /* ... */
  },
};

Если вам нужна дополнительная информация, спросите меня в комментариях ⬇
Спасибо!

Комментарии:

1. Что именно не работает? Пожалуйста, поделитесь сообщением об ошибке

2. Я использую все имена файлов и все остальное, но когда я загружаю его в браузер, нет никакого стиля.

3. и сообщения об ошибке нет, просто стили не загружаются, вот подробные журналы gist.github.com/UnlockDep/492a0ef779b6ba80df3d8efedc3e106c

4. Если вы поделитесь воспроизводимым примером в github, ваши шансы получить ответ возрастут

5. Вы можете воспроизвести это, выполнив следующее: npx create-snowpack-app reproduction --template @snowpack/app-template-react-typescript amp;amp; cd reproduction amp;amp; npm i -D @snowpack/plugin-sass затем перейдите к snowpack.config.js и в плагинах add "@snowpack/plugin-sass" и преобразуйте свои css-файлы в scss, а затем, если вы запустите его, не будет никакого стиля (вот в чем проблема). Но я все равно сделаю репозиторий со всей информацией.

Ответ №1:

Возможно, вам потребуется добавить плагин свертки, чтобы заставить scss работать:

 module.exports = {
  mount: {
    public: '/',
    src: '/_dist_',
  },
  plugins: [
    '@snowpack/plugin-react-refresh',
    '@snowpack/plugin-dotenv',
    '@snowpack/plugin-typescript',
    '@snowpack/plugin-sass',
  ],
  install: [
    /* ... */
  ],
  installOptions: {
    /* ... */
  },
  devOptions: {
    /* ... */
  },
  buildOptions: {
    /* ... */
  },
  proxy: {
    /* ... */
  },
  alias: {
    /* ... */
  },
  packageOptions: {        /* <------- add these values to your config */
    rollup: {
        require('rollup-plugin-scss')(),
    }
  }
};

Комментарии:

1. Я думаю, что в объекте packageOptions.rollup отсутствует другое вложенное свойство массива ‘plugins’, в котором должен находиться экземпляр scss плагина rollup: packageOptions: {rollup: { plugins: [require(‘rollup-plugin-scss’)()], }, }