Как настроить live sass compiler, чтобы он сохранял скомпилированные файлы SCSS в папку CSS при их изменениях?

Question

Рафаил

visual-studio-code

Как настроить live sass compiler, чтобы он сохранял скомпилированные файлы SCSS в папку CSS при их изменениях?

В файле JSON, который я редактирую, возникла ошибка, когда я оставляю слэш в конце. Вот код, который я использую: <br/> <br/> <blockquote><pre><code class="javascript">{
    "workbench.colorTheme": "Visual Studio Dark",
    "liveSassCompile.settings.showOutputWindowOn": "None",
    "liveSassCompile.settings.generateMap": false,
    "liveSassCompile.settings.formats": [
        {
            "format": "expanded",
            "extensionName": ".css",
            "savePath": "~/../css"
        },
        {
            "format": "compressed",
            "extensionName": ".min.css",
            "savePath": "~/../css"
        }
    ]
}</code></pre></blockquote> <br/> После внесенных изменений генерируется файл в папке, где находится файл SCSS, а не в папке CSS. Что может быть причиной этого?

18 сентября 2024 г. 17:03

Ответы на вопрос 1

Похожие вопросы

Answer 1

Настройка Live Sass Compiler в Visual Studio Code для сохранения скомпилированных файлов SCSS в определенную папку может потребовать некоторых дополнительных настроек. В вашем случае вы сталкиваетесь с проблемой, когда файлы сохраняются в той же папке, что и исходные файлы SCSS, а не в папке CSS. 

1. **Проверьте путь сохранения**: В поле `savePath` вы использовали `~/../css`, что может привести к неправильному определению пути. Вместо этого вы можете попробовать использовать относительный путь или абсолютный путь к папке CSS от корневой директории проекта.

   Пример относительного пути:
   ```json
   "savePath": "../css"
   ```

   Или, если вы хотите использовать абсолютный путь, укажите полный путь к вашей папке css, например:
   ```json
   "savePath": "/путь_к_вашей_папке/css"
   ```

2. **Удалите слэш в конце**: Как вы уже заметили, наличие слэша в конце может вызывать ошибку. Убедитесь, что в `savePath` не стоит слэш в конце. Например:
   ```json
   "savePath": "../css"
   ```

3. **Проверка формата JSON**: Убедитесь, что ваш JSON файл правильно отформатирован. Убедитесь, что запятые и фигурные скобки выставлены корректно.

4. **Перезапуск VSCode**: Попробуйте перезапустить Visual Studio Code после изменения настроек, чтобы убедиться, что изменения были применены.

5. **Проверка на наличие ошибок**: Если после всех изменений проблема все еще сохраняется, откройте окно консоли разработчика в Visual Studio Code (`Help` > `Toggle Developer Tools`), чтобы увидеть, есть ли ошибки, связанные с настройками Live Sass Compiler.

6. **Обновление расширения**: Убедитесь, что у вас установлена последняя версия расширения Live Sass Compiler, так как в более старых версиях могли быть ошибки, которые уже исправили.

Вот обновленный код с предложенными изменениями:

```json
{
    "workbench.colorTheme": "Visual Studio Dark",
    "liveSassCompile.settings.showOutputWindowOn": "None",
    "liveSassCompile.settings.generateMap": false,
    "liveSassCompile.settings.formats": [
        {
            "format": "expanded",
            "extensionName": ".css",
            "savePath": "../css"
        },
        {
            "format": "compressed",
            "extensionName": ".min.css",
            "savePath": "../css"
        }
    ]
}
```

Попробуйте указанные изменения и дайте знать, сработали ли они!