- Должны ли Prepros работать для компиляции моего SASS в CSS на странице Github.io? Если да, то почему мой стиль SASS не работает на странице Github.io?
- Компиляция Sass с использованием PrePros в Windows
- Компиляция Sass с использованием PrePros в Windows
- Компиляция Sass с помощью PrePros в Windows
- УЧЕБНЫЕ МАТЕРИАЛЫ
- Установка и настройка Prepros
- Установка и настройка Prepros
Должны ли Prepros работать для компиляции моего SASS в CSS на странице Github.io? Если да, то почему мой стиль SASS не работает на странице Github.io?
Мой проект оформлен так, как я хочу, чтобы он был локальным. После того, как я отправил его на GitHub, и все файлы, похоже, присутствуют, я опубликовал его на странице GitHub.io, и ни один из моих стилей не присутствует.
Понимаю ли я принципиально цель и использование препро или совершаю какую-то другую ошибку? Какая информация вам нужна, чтобы определить, в чем проблема?
Мой файл prepros-6.config
Страницы Github обслуживают только статические файлы (* .html, * .css, * .js). Страницы Github позволяют использовать генератор статических сайтов Джекил. Таким образом, вы можете отправить проект в Github и собрать.
Если вы отправляете код в Github в надежде скомпилировать файл SASS с помощью Prepros, этого не произойдет. Вам нужно скомпилировать на своем компьютере и отправить эти статические файлы в Github.
Github может объяснить это лучше, чем я здесь, на pages.github.com
Файл CSS уже скомпилирован до отправки на Github, а src в заголовке на моей HTML-странице — это файл CSS. Могут ли SASS или prepros-6.config мешать работе какого-то дома?
Это не должно мешать. На странице есть ошибка консоли? Если да, то что на нем отображается?
Источник
Компиляция Sass с использованием PrePros в Windows
Я унаследовал проект, использующий Sass. Я разработчик .NET, поэтому компиляция CSS на самом деле не является чем-то, с чем я сталкивался. Предыдущий разработчик сказал мне (поскольку я работаю в Windows, а он работает на MAC) установить препро.
Я прошел следующие шаги:
- Установлен Ruby 2.3.0 для Windows
- Установлен sass «gem istall sass»
- Установлен компас «gem install compass»
- Установлен sass-globbing «gem install sass-globbing»
- Установлен compass-install-once «gem install compass-install-once»
Затем я открыл Prepros и перетащил в свою «статическую папку», которая имеет такую структуру:
- Статический
- css
- js
- дерзость
- компоненты (несколько файлов в этом каталоге)
- components.sass
- screen.sass
screen.css выглядит так:
А содержимое файлов screen.sass выглядит так:
В PrePros я изменил компилятор, чтобы он использовал Ruby Sass вместо Node Sass (по совету предыдущего разработчика).
Теперь, когда я нажимаю screen.sass в PrePros и нажимаю «Обработать файл», я получаю сообщение об ошибке «Ошибка: неясно, какой файл импортировать для ‘@import» components / * «‘.
Я нашел несколько потоков в Интернете, в которых говорилось, что это произошло из-за Windows и что подстановочный знак следует заменить на @import «components / . », Однако, когда я запускаю эту команду, я получаю сообщение об ошибке: «Ошибка: файл для импорта не найден. или нечитаемый: компоненты / . «
Как ни странно, файл, который создает prepros, т.е., кажется, прекрасно понимает, какие файлы импортировать для components.sass, потому что я вижу в файле следующий раздел:
Поэтому кажется странным, что PrePros может сказать, какие файлы нужно импортировать, но когда я пытаюсь скомпилировать, он не понимает!
Наконец, содержимое компаса (config.rb):
Может ли кто-нибудь помочь новичку в Sass, который не в своей глубине, запустить PrePros !? Что я делаю неправильно?
Источник
Компиляция Sass с использованием PrePros в Windows
Я унаследовал проект, использующий Sass. Я разработчик .NET, поэтому компиляция CSS на самом деле не является чем-то, с чем я сталкивался. Предыдущий разработчик сказал мне (поскольку я работаю в Windows, а он работает на MAC) установить препро.
Я прошел следующие шаги:
- Установлен Ruby 2.3.0 для Windows
- Установлен sass «gem istall sass»
- Установлен компас «gem install compass»
- Установлен sass-globbing «gem install sass-globbing»
- Установлен compass-install-once «gem install compass-install-once»
Затем я открыл Prepros и перетащил в свою «статическую папку», которая имеет такую структуру:
- Статический
- css
- js
- дерзость
- компоненты (несколько файлов в этом каталоге)
- components.sass
- screen.sass
screen.css выглядит так:
А содержимое файлов screen.sass выглядит так:
В PrePros я изменил компилятор, чтобы он использовал Ruby Sass вместо Node Sass (по совету предыдущего разработчика).
Теперь, когда я нажимаю screen.sass в PrePros и нажимаю «Обработать файл», я получаю сообщение об ошибке «Ошибка: неясно, какой файл импортировать для ‘@import» components / * «‘.
Я нашел несколько потоков в Интернете, в которых говорилось, что это произошло из-за Windows и что подстановочный знак следует заменить на @import «components / . », Однако, когда я запускаю эту команду, я получаю сообщение об ошибке: «Ошибка: файл для импорта не найден. или нечитаемый: компоненты / . «
Как ни странно, файл, который создает prepros, т.е., кажется, прекрасно понимает, какие файлы импортировать для components.sass, потому что я вижу в файле следующий раздел:
Поэтому кажется странным, что PrePros может сказать, какие файлы нужно импортировать, но когда я пытаюсь скомпилировать, он не понимает!
Наконец, содержимое компаса (config.rb):
Может ли кто-нибудь помочь новичку в Sass, который не в своей глубине, запустить PrePros !? Что я делаю неправильно?
Источник
Компиляция Sass с помощью PrePros в Windows
Мне достался в наследство проект, в котором используется Sass. Я ‘NET-разработчик, поэтому компиляция CSS — это не совсем то, с чем я сталкивался. Предыдущий разработчик сказал мне (поскольку я работаю на Windows, а он на MAC) установить prepros.
Я выполнил следующие шаги:
- Установил Ruby 2.3.0 для Windows
- Установил sass «gem istall sass»
- Установлен компас «gem install compass»
- Установлен sass-globbing «gem install sass-globbing»
- Установлен compass-install-once «gem install compass-install-once»
Затем я открыл Prepros и перетащил туда свою папку «static», которая имеет такую структуру:
- Static
- css
- js
- сасс
- компоненты (несколько файлов в этой директории)
- components.sass
- экран.sass
screen.css выглядит следующим образом:
А содержимое файлов screen.sass выглядит следующим образом:
В PrePros я изменил компилятор, чтобы использовать Ruby Sass вместо Node Sass (по совету предыдущего разработчика).
Теперь, когда я нажимаю на screen.sass в PrePros и нажимаю «Обработать файл», я получаю сообщение об ошибке «Error: It’s not clear wghich file to import for ‘@import «components/*»‘.
Я нашел несколько тем в интернете, где говорилось, что это связано с Windows, и что подстановочный знак должен быть изменен на @import «components/.«, однако когда я запускаю эту команду, я получаю ошибку «Error: Файл для импорта не найден или не читается: components/.«
Странно, но файл, который создает prepros, кажется, прекрасно понимает, какие файлы нужно импортировать для components.sass, потому что я вижу в файле следующую секцию:
Поэтому кажется странным, что PrePros может сказать, какие файлы нужно импортировать, но когда я пытаюсь скомпилировать, он не понимает!
Наконец, содержимое компаса (config.rb) следующее:
Может ли кто-нибудь помочь новичку в Sass, который не в состоянии разобраться с PrePros? Что я делаю не так?
Источник
УЧЕБНЫЕ МАТЕРИАЛЫ
Web-верстка, компьютерная графика,
мультимедиа
Установка и настройка Prepros
В качестве компилятора проекта рекомендуется использовать программу Prepros. Она позволяет работать с файлами в режиме Live, имеет множество настроек, а также простой интерфейс.
Prepros позволяет компилировать файлы с расширением .kit. Это язык шаблонов HTML, который позволяет создавать шаблоны блоков и использовать их множество раз. Внесение изменений на одном шаблоне будет отражаться на всех страницах сразу, что позволяет с легкостью редактировать повторяющиеся участки кода.
Скачать данную программу можно на официальном сайте.
Установка и настройка Prepros
После установки вы увидите открывшееся окно программы. Нажмите по кнопке меню в правом верхнем углу.
Шаг 2 — Выберите App Settings
Откроется меню настроек.
Шаг 3 — Поменяйте тему на темную
Перейдите в Project Defaults -> CSS Tools -> Sass. Спуститесь вниз, к разделу Output. Задайте настройки, как показано на изображении.
Шаг 4 — В Relative Path впишите «../css»
Источник