jekyll / css не работает на страницах github, но работает на localhost: 3000

#jekyll #github-pages

#jekyll #github-страницы

Вопрос:

Я новичок в Github, и я пытался развернуть свой блог (разветвленный с kimfucious) на страницах Github. Я попытался развернуть его с помощью surge, и это сработало. Хотя, когда я загружаю его на Github, он говорит, что CSS не применяется.

Вот как это выглядит сейчас

Вот ошибки

Я, очевидно, делаю что-то не так. Но я не могу понять это.

Вот мой репозиторий: https://github.com/Colawithrain/Collin_Blog

И вот ссылка на страницы Github: https://colawithrain.github.io/Collin_Blog /

Заранее благодарю вас за любые указания.

Колин

Ответ №1:

Это немного сбивает с толку, поскольку, скорее всего, работает локально (там, где вам не нужно baseurl ). Это одна из самых распространенных ошибок Jekyll в сочетании со страницами GitHub. Вот краткое изложение:

Вы пытаетесь загрузить:

 https://colawithrain.github.io/assets/css/main.css

Однако файл CSS передается по адресу:

 https://colawithrain.github.io/Collin_Blog/assets/css/main.css

В настоящее время вы запрашиваете это _includes/head.html с помощью:

 <link rel="stylesheet" href="/assets/css/main.css">

Исправьте это, изменив его на:

 <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/main.css">

Затем установите это в вашем _config.yml :

 baseurl: /Collin_Blog

1. Хотя другие изображения и элементы по-прежнему не могут быть загружены, должен ли я просто добавить {{ site.baseurl }} перед каждым адресом href?

2. Да, это сработает. Jekyll предлагает некоторые вспомогательные функции, которые вызываются absolute_url и relative_url которые делают что-то подобное, но я нахожу {{ site.baseurl }} более понятным.

3. Это должно быть отмечено как правильный ответ. Исправил это для меня, спасибо.

Ответ №2:

Вы пробовали настраивать url и baseurl в конфигурации. Потому что похоже, что сайт ожидает, что он будет находиться в корневом домене, а не в /Collin_Blog . Например, файл CSS ссылается на:

 https://colawithrain.github.io/assets/css/main.css

Но на самом деле на:

 https://colawithrain.github.io/Collin_Blog/assets/css/main.css