Ответ 1
Когда вы устанавливаете gem, все необходимые файлы Foundation устанавливаются для вас в кеше драгоценных камней. Compass вытащит все файлы FSC SCS в ваш проект с помощью директивы @import от foundation.scss.
Документы проекта в репозитории Github показывают последние инструкции Компас для создания вашего проекта F4. https://github.com/zurb/foundation/blob/master/docs/sass.html.erb
Похоже, вы смешиваете автономные инструкции с компасом.
Если вы запустили это:
[sudo] gem install compass
cd path/to/where-you-want-your-project
run compass create <project-name> -r zurb-foundation --using foundation
Вам не нужны инструкции Github или Standalone.
Ниже описаны шаги по созданию проекта F4. Я думаю, вы застряли на STEP 4, поэтому сосредоточьтесь на этой части.
ШАГ 1:
Загрузите для упрощения доступа к этим двум архивам:
Foundation Vanilla:
http://foundation.zurb.com/files/foundation-4.1.6.zip
Мастер Foundation:
https://github.com/zurb/foundation/archive/master.zip
CD в корневой каталог www:
ШАГ 2:
Создать этот файл:
/config.rb
require 'zurb-foundation'
http_path = "/"
css_dir = "css"
sass_dir = "scss"
images_dir = "img"
javascripts_dir = "js"
output_style = :expanded
relative_assets = true
line_comments = true
Переключатель output_style = :compact or :compressed и line_comments = false для Production (при переходе в прямом эфире).
ШАГ 3:
- Скопировать/переместить
index.htmlиз Foundation Vanilla в каталог корневого www. - Измените
line 11и изменитеfoundation.cssнаapp.cssв теге стиля.
ШАГ 4:
Создайте этот каталог и файл:
/СКС/
-
Создать
app.scss- это таблица стилей вашего сайта/приложения, и мы импортируем в нее Normalize и F4. -
Скопируйте в него:
// Global Foundation Settings // @import "settings"; // Comment out this import if you don't want to use normalize @import "normalize"; // Comment out this import if you are customizing you imports below @import "foundation"; // Your own SCSS here...
Если вы хотите переопределить некоторые переменные F4 SaSS, вам понадобится файл _settings.scss. На данный момент я бы пропустил этот шаг и оставил его прокомментированным, пока вы не познакомитесь с F4.
ШАГ 5:
Создайте этот каталог (файлы автоматически записываются здесь):
/CSS/
-
app.css- будет записан здесь из/scss/app.scssкомпасом. Нормализовать, и все F4 CSS будут внутри него, плюс любой ваш собственный CSS, который вы добавили.
Это происходит автоматически, вам не нужно ничего делать, за исключением того, что установлены необходимые камни и ваш конфигурационный файл Compass от STEP 2.
ШАГ 6:
Создайте этот каталог и скопируйте/переместите эти файлы в него:
/JS/
-
Скопируйте/переместите
/js/foundation.min.jsиз Foundation Vanilla здесь. -
Если вам нужен ваш
app.jsсоздать/разместить его здесь и связать с ним последним в нижнем колонтитуле .
/JS/продавец/
-
Скопируйте/переместите
/js/vendor/custom.modernizr.jsиз Foundation Vanilla здесь. -
Скопируйте/переместите
/js/vendor/zepto.jsи/js/vendor/jquery.jsиз Foundation Vanilla здесь.
Позже, когда вы почувствуете себя более комфортно, вы можете выбрать индивидуальные файлы JS Foundation из Foundation Master и объединить их в меньшую библиотеку здесь как foundation.min.js.
Это должно сделать это.
Просмотрите этот файл в моем WWW репо, так как он показывает рабочую настройку F4: https://github.com/jhauraw/jhaurawachsman.com/blob/master/_layouts/default.html
Вы также можете сориентироваться в том, как интегрировать Grunt.js для автоматической сборки SCSS и JS с конкатенацией и минимизацией: https://github.com/jhauraw/jhaurawachsman.com/blob/master/Gruntfile.js