Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TypeError: can't access property "color" #28

Open
tomByrer opened this issue Jan 10, 2021 · 1 comment
Open

TypeError: can't access property "color" #28

tomByrer opened this issue Jan 10, 2021 · 1 comment

Comments

@tomByrer
Copy link

Win10, both Expo targeting web & Next.js with React-Native-Web won't run your library. I used only the demo you have in README.

Unhandled Runtime Error

TypeError: can't access property "color", topLevel is undefined
Call Stack
generateNewStylesheet/<
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/webpack/pages/index.970e49074bdcb60232d4.hot-update.js (24175:9)
generateNewStylesheet
/_next/static/webpack/pages/index.970e49074bdcb60232d4.hot-update.js (24174:30)
NativeSyntaxHighlighter
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/webpack/pages/index.970e49074bdcb60232d4.hot-update.js (24284:52)
renderWithHooks
/_next/static/chunks/main.js (31890:27)
mountIndeterminateComponent
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/chunks/main.js (34569:13)
beginWork
/_next/static/chunks/main.js (35683:16)
callCallback
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/chunks/main.js (17275:14)
invokeGuardedCallbackDev
/_next/static/chunks/main.js (17324:16)
invokeGuardedCallback
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/chunks/main.js (17379:31)
beginWork$1
/_next/static/chunks/main.js (40290:28)
performUnitOfWork
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/chunks/main.js (39241:12)
workLoopSync
/_next/static/chunks/main.js (39217:22)
performSyncWorkOnRoot
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/chunks/main.js (38843:9)
flushSyncCallbackQueueImpl/<
/_next/static/chunks/main.js (28176:24)
unstable_runWithPriority
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/chunks/main.js (46080:12)
runWithPriority$1
/_next/static/chunks/main.js (28126:10)
flushSyncCallbackQueueImpl
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/chunks/main.js (28171:24)
flushSyncCallbackQueue
/_next/static/chunks/main.js (28159:3)
flushSync
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/chunks/main.js (39019:5)
scheduleRefresh
/_next/static/chunks/main.js (28713:14)
performReactRefresh/<
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/chunks/react-refresh.js (507:17)
performReactRefresh
/_next/static/chunks/react-refresh.js (496:26)
scheduleUpdate/<
file:/D:/doc/prog/learn/js/react/reactnative/test-highlight-nextjs/.next/static/chunks/react-refresh.js (135:35)
@FlxEd
Copy link

FlxEd commented Feb 27, 2022

Had the same issue on Win10. Haven't tried on other OS.
Workaround to still be able to use the library is to import another style mode from /prism instead of /hljs

The following code worked for me:

import SyntaxHighlighter from 'react-native-syntax-highlighter';
import { darcula } from 'react-syntax-highlighter/styles/prism'; // note the difference here

export default function App() {
  return (
    <View style={styles.container}>
      <SyntaxHighlighter
        language='javascript'
        style={darcula}
        highlighter={"prism" || "hljs"}
      >
        Hello World!
      </SyntaxHighlighter>
      <StatusBar style="auto" />
    </View>
  );
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants