spectacle代码-幻灯片不突出显示代码行

Question

在spectacle-code-slide中使用当前的spectacle boilerplate (5.2.2)，一切正常，直到导航到CodeSlide元素中的代码为止。

<CodeSlide
        transition={[]}
        lang="js"
        bgColor="secondary"
        code={require("raw-loader!../assets/code.example")}
        ranges={[
          { loc: [0, 270], title: "Walking through some code" },
          { loc: [0, 1], title: "The Beginning" },
          { loc: [1, 2] },
          { loc: [1, 2], note: "Heres a note!" },
          { loc: [2, 3] },
          { loc: [8, 10] },
        ]}/>

这是我得到的结果

​

看一下github的github的壮观代码幻灯片的教程，似乎是这样做的(除非我在哪里犯了错误)，让棱镜(它被CodeSlide用来做高亮显示)理解目标语言的方法是通过设置lang=""属性。

这里有一个问题:有没有人想办法让CodeSlide组件在当前版本的壮观样板中正常工作？

Answer 1

不确定你是否想出了如何解决这个问题，尽管你需要包含一些来自Prism的CSS。This is the link for the themes。如果你从这里添加一个主题到你的代码中，它应该可以很好的工作。您可以根据需要添加不同的背景颜色。