眼镜代码幻灯片未突出显示代码行

Question

使用当前的spectacle boilerplate (5.2.2)和spectacle-code-slide，一切正常，直到导航到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] },
        ]}/>

这是我得到的结果

从spectacle-code-slide的github看教程，看来这是这样做的方法（除非我在某个地方犯了错误）和Prism的方法（CodeSlide使用它来做）突出显示）通过设置lang=""属性来了解目标语言。

这里是一个问题：有没有人设法使CodeSlide组件与当前版本的眼镜样板一起正常工作？

Answer 1

尽管您需要包括Prism的某种CSS，也不确定是否想出解决方法。 This is the link for the themes。如果您从此处将主题添加到代码中，它应该可以正常工作。可以根据需要随意添加其他背景颜色。