升级到Jekyll 3后GitHub Pages处理语法突出显示 [英] GitHub Pages mangling syntax highlighting after upgrade to Jekyll 3

问题描述

我将Github Pages用于我的个人网站.他们正在从Jekyll 2升级到Jekyll 3，并发送弃用警告.我遵守了他们的警告，从红地毯"改为克拉姆当"，从色素沉淀"改为胭脂".当我在本地构建(使用bundle exec jekyll serve)时，一切正常.但是，当我进行更改时，无论代码块中有linenos到哪里，语法高亮都会被弄乱.

I use Github Pages for my personal website. They're upgrading from Jekyll 2 to Jekyll 3 and sending deprecation warnings. I complied with their warnings and switched from redcarpet to kramdown and from pygments to rouge. When I build locally (with bundle exec jekyll serve) everything works. But when I push the changes the syntax highlighting gets mangled wherever I have linenos in my code blocks.

这是代码块:

{% highlight python linenos %}
'''
scrape lyrics from vagalume.com.br
(author: thiagomarzagao.com)
'''

import json
import time
import pickle
import requests
from bs4 import BeautifulSoup

# get each genre's URL
basepath = 'http://www.vagalume.com.br'
r = requests.get(basepath + '/browse/style/')
soup = BeautifulSoup(r.text)
genres = [u'Rock']
          u'Ax\u00E9',
          u'Forr\u00F3',
          u'Pagode',
          u'Samba',
          u'Sertanejo',
          u'MPB',
          u'Rap']
genre_urls = {}
for genre in genres:
    genre_urls[genre] = soup.find('a', class_ = 'eA', text = genre).get('href')

# get each artist's URL, per genre
artist_urls = {e: [] for e in genres}
for genre in genres:
    r = requests.get(basepath + genre_urls[genre])
    soup = BeautifulSoup(r.text)
    counter = 0
    for artist in soup.find_all('a', class_ = 'top'):
        counter += 1
        print 'artist {} \r'.format(counter)
        artist_urls[genre].append(basepath + artist.get('href'))
    time.sleep(2) # don't reduce the 2-second wait (here or below) or you get errors

# get each lyrics, per genre
api = 'http://api.vagalume.com.br/search.php?musid='
genre_lyrics = {e: {} for e in genres}
for genre in artist_urls:
    print len(artist_urls[genre])
    counter = 0
    artist1 = None
    for url in artist_urls[genre]:
        success = False
        while not success: # foor loop in case your connection flickers
            try:
                r = requests.get(url)
                success = True
            except:
                time.sleep(2)
        soup = BeautifulSoup(r.text)
        hrefs = soup.find_all('a')
        for href in hrefs:
            if href.has_attr('data-song'):
                song_id = href['data-song']
                print song_id
                time.sleep(2)
                success = False
                while not success:
                    try:
                        song_metadata = requests.get(api + song_id).json()
                        success = True
                    except:
                        time.sleep(2)
                if 'mus' in song_metadata:
                    if 'lang' in song_metadata['mus'][0]: # discard if no language info
                        language = song_metadata['mus'][0]['lang']
                        if language == 1: # discard if language != Portuguese
                            if 'text' in song_metadata['mus'][0]: # discard if no lyrics
                                artist2 = song_metadata['art']['name']
                                if artist2 != artist1:
                                    if counter > 0:
                                        print artist1.encode('utf-8') # change as needed
                                        genre_lyrics[genre][artist1] = artist_lyrics
                                    artist1 = artist2
                                    artist_lyrics = []
                                lyrics = song_metadata['mus'][0]['text']
                                artist_lyrics.append(lyrics)
                                counter += 1
                                print 'lyrics {} \r'.format(counter)

    # serialize
    with open(genre + '.json', mode = 'wb') as fbuffer:
        json.dump(genre_lyrics[genre], fbuffer)
{% endhighlight %}

这是我在本地看到的:

这是我在Github页面上看到的:

This is what I see on Github Pages:

(没有linenos语法突出显示效果很好.)

(Without linenos the syntax highlighting works fine.)

可能会发生什么?

推荐答案

我想我明白了！

您的代码块似乎很好.没问题.

Your code block seems to be fine. No problem there.

确保已将其添加到_config.yml:

highlighter: rouge
markdown: kramdown
kramdown:
  input: GFM

可能您缺少的是kramdown input: GFM，不是吗?

Probably what you're missing is kramdown input: GFM, isn't it?

好吧，我在本地进行了测试并且运行良好.当上传到GitHub 时，也可​​以正常工作.应该也为您工作.

Well, I tested locally and worked fine. When uploaded to GitHub, worked fine as well. Should work for you too.

让我知道怎么回事，好吗? :)

Let me know how it goes, ok? :)

更新！

将其添加到样式表中，并检查其运行方式:

Add this to your stylesheet and check how it goes:

.lineno { width: 35px; }

好像是关于CSS样式的事情打破了布局！继续调整CSS，一切都会好起来的！

Looks like it's something about your CSS styles that is breaking the layout! Keep tweaking your CSS and you're gonna be fine!

这篇关于升级到Jekyll 3后GitHub Pages处理语法突出显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！