Eclipse плагин для автоматической компиляции файлов Sass - PullRequest
17 голосов
/ 24 февраля 2012

В настоящее время я использую плагин Aptana для Eclipse, который дает мне отличную подсветку синтаксиса и позволяет вручную щелкнуть, чтобы скомпилировать файл * .scss в файл * .css.Что я действительно хотел бы сделать, так это заставить его автоматически компилироваться при каждом сохранении, но я не могу понять, как это сделать.

Я знаю, что вы можете использовать sass --watch в командной строке, но я не хочу устанавливать это вручную каждый раз, когда открываю затмение или создаю новый проект.

Кто-нибудь нашел хороший способ добиться этого?Должен ли быть способ подключения пакета Sass Aptana и запуска его команды компиляции каждый раз, когда я сохраняю?Принятый ответ на на этот вопрос предполагает использование "Компоновщика программ" - но действительно ли это лучшее решение?Если да, есть ли у кого-нибудь какие-либо советы / ссылки на учебники?

Обновление: я написал сообщение в блоге о том, как использовать скрипт Ant в качестве компоновщика, но я все еще ищулучший способ.

Ответы [ 4 ]

12 голосов
/ 23 января 2016

После многих попыток я обнаружил, что лучшим решением в Eclipse является определение простого Builder с использованием функции --update sass:

  • В меню «Проект» выберите «Свойства» и выберите раздел «Строители».
  • Создайте новый Builder и выберите «Программу» в качестве типа конфигурации.
  • Выберите имя для конфигурации запуска (SASS?!).
  • Введите путь вашей установки sass в поле Location.
  • Используйте $ {project_loc} в качестве рабочего каталога.
  • В текстовом поле «Аргументы» вставьте параметры конфигурации, которые вы хотите использовать sass, и, в конце, укажите параметр --update, за которым следует источник каталога ваших файлов sass, затем «:» и целевая папка для скомпилированных файлов css. , В моей конфигурации "resources" - это исходная папка, содержащая файлы .scss, а "web" - это каталог назначения, содержащий скомпилированные файлы .css. Команда --update проверит наличие изменений в исходной папке и во всех подпапках. Скриншот
  • На вкладке «Параметры сборки» просто отметьте все параметры в разделе «Запустить сборщик:». Вы также можете «Указать рабочий набор соответствующих ресурсов», чтобы запускать конструктор только при сохранении файлов, содержащихся в выбранных папках. Скриншот
  • Нажмите кнопку ОК, чтобы сохранить конфигурацию запуска.
  • Теперь попробуйте изменить файл .scss в вашем исходном каталоге, а затем сохраните его, вы увидите вывод sas CLI в окне консоли.

sass CLI автоматически проверит наличие модифицированных ресурсов в исходной папке (ресурсы в моей конфигурации) и скомпилирует их в целевую папку (web в моей конфигурации). Кроме того, будут скомпилированы все файлы .sass, которые @import измененных ресурсов.

10 голосов
/ 18 июля 2012
2 голосов
/ 31 октября 2014

есть переключатель watch для компилятора sass.
, который перестраивает выходной файл (css) при каждом изменении источника (scss, sass).

Цитирование из: http://sass -lang.com / documents / file.SASS_REFERENCE.html # using_sass

Использование Sass

Sass можно использовать тремя способами: в качестве инструмента командной строки,как отдельный модуль Ruby и как плагин для любой платформы с поддержкой Rack, включая Ruby on Rails и Merb.Первым шагом для всего этого является установка гема Sass:

gem install sass Если вы используете Windows, вам может понадобиться сначала установить Ruby.

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

sass input.scss output.css Вы также можете указать Sass просматривать файл и обновлять CSS каждый раз, когда изменяется файл Sass:

sass --watchinput.scss: output.css Если у вас есть каталог с большим количеством файлов Sass,
вы также можете указать Sass просмотреть весь каталог:

sass --watch app / sass: public / stylesheets Используйте sass --help для полной документации.

Использовать Sass в Ruby-коде очень просто.После установки драгоценного камня Sass вы можете использовать его, запустив require "sass" и используя Sass :: Engine следующим образом:

engine = Sass :: Engine.new ("# main {background-color: # 0000ff} ",: syntax =>: scss) engine.render # =>" #main {background-color: # 0000ff;} \ n "

1 голос
/ 27 июля 2017

Существует гораздо более простое решение.Просто следуйте инструкциям по установке SASS:

http://sass -lang.com / install

, и вы заметите, что сначала вам нужно будет установить Ruby.После этого просто перейдите в папку, где находятся ваши файлы SCSS / CSS, запустите CMD и выполните команду DOS:

>cd <path-to-your-css-files>
>sass --watch .

Затем все, что вам нужно сделать, это связать файлы SCSS, которые будут распознаныЗатмение как нативные файлы CSS.Следуйте этому решению:

https://stackoverflow.com/a/12322531/4180447

Надеюсь, это поможет.

Примечание. Возможно, я пропустил один или два шага.Это то, что я запомнил после завершения установки.Если у вас возникнут какие-либо проблемы, просто оставьте комментарий, и я постараюсь вам помочь.

Tarek

...