conorhastings / react-native-syntax-highlighter

a syntax highlighter for react native using https://github.com/conorhastings/react-syntax-highlighter under the hood
MIT License
167 stars 25 forks source link

TypeError: undefined is not an object (evaluating 'str.match') #15

Open yuranrobin opened 5 years ago

yuranrobin commented 5 years ago

Got an error first time using react-native-syntax-highlighter. Basically I copied code from expo snack from your main page.

"react-native-syntax-highlighter": "^2.0.0",
"expo": "^27.1.1"
"react-native": "https://github.com/expo/react-native/archive/sdk-27.0.0.tar.gz",

My code:

import React from 'react';
import { Text, View } from 'react-native';

import SyntaxHighlighter from 'react-native-syntax-highlighter';
import { docco } from 'react-syntax-highlighter/styles/hljs';
import { tomorrow } from 'react-syntax-highlighter/styles/prism'

export default class TestScreen extends React.Component {
  constructor(props) {
    super(props);
    this.state = { isLoading: true };
  }

  componentDidMount() {
    ...
  }

  render() {
    const codeString = '(num) => num + 1';
    return (
      <View style={{ backgroundColor: '#E87A90', height: '100%'}}>
        <Text style={{ marginTop: 30, marginBottom: 30, textAlign: 'center', fontSize: 22, fontWeight: '900' }}>React Native Syntax Higlighter</Text>
        <SyntaxHighlighter
          style={tomorrow}
          customStyle={{padding: 0, margin: 0 }}
          language='javascript'
          fontSize={18}
          highlighter="prism"
        >
          {this.state.code}
        </SyntaxHighlighter>
      </View>
    );
  }
}

Expo on iOS: img_1826