Brillen-Code-Folie nicht Rendering

Question

Ich versuche spectacle-code-slide für eine Präsentation zu verwenden. Zur Zeit konnte ich nichts rendern. Hier ist, was ich getan habe:

1 Cloned spectacle-boilerplate

2 ersetzt den Standard /presentation/index.js mit dem Code in der "Verwendung" Abschnitt des Brillen Code-Rutsche, nämlich (1)

import React from 'react'; 
import { Spectacle, Deck } from 'spectacle'; 
import CodeSlide from 'spectacle-code-slide'; 

export default class Presentation extends React.Component { 
    render() { 
    return (
     <Spectacle theme={theme}> 
     <Deck transition={[]} transitionDuration={0} progress="bar"> 
      // ... 
      <CodeSlide 
      transition={[]} 
      lang="js" 
      code={require("raw!../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: [4, 7] }, 
       { loc: [8, 10] }, 
       // ... 
      ]}/> 
      // ... 
     </Deck> 
     </Spectacle> 
    ); 
    } 
} 

3 Ran npm install gefolgt von npm install --save spectacle-code-slide.

4 Hinzugefügt (1) zu assets/code.example.

5 lief npm start.

Ich habe:

Listening at http://localhost:3000 
webpack built 966ffe50dc640fdaec4a in 4726ms 

localhost:3000 Geprüft und es gibt nur eine leere Seite. Keine anderen Fehler werden gemeldet. Was ist los?

Answer 1

Nun, Sie können nicht nur die ganze Datei ersetzen. Sie sollten nur den Abschnitt, der wichtig ist, die render Methode ändern. Und importieren Sie die Komponenten natürlich ..
Zum Beispiel, wenn Sie wirklich die ganze Datei tat ersetzen, Sie haben nicht einmal die theme Variable deklariert ..

Sie können ein Beispiel dafür sehen, hier zu arbeiten
https://github.com/andrejunges/react-presentation/blob/master/presentation/index.js