Nodejs: expected expression, got '<'

Question

I'm currently using deepstream with nodejs. Right now, I'm following the tutorial here to get use to the new library: deepstream tutorial

However, I'm getting an error once I finish the RenderDOM part of the file. Here's the current code:

<!DOCTYPE html>
<html>
 <head>
<script src="deepstream.js"></script>
</head>
<body>
<input type="text" />
<script type="text/javascript">

    const deepstream = require('deepstream.io-client-js')
    const DeepstreamMixin = require('deepstream.io-tools-react')

    const client = deepstream('localhost:6020').login({}, () => {
      //ReactDOM.render call will go in here
      ReactDOM.render(
          <SyncedInput dsRecord="some-input" />,
          document.getElementById('example')
        )

        const SyncedInput = React.createClass({
          mixins: [DeepstreamMixin],
          setValue: function(e) {
            this.setState({value: e.target.value})
          },
          render: function() {
            return (
              <input value={this.state.value} onChange={this.setValue} />
            )
          }
        })
    })
    DeepstreamMixin.setDeepstreamClient(client)
</script>
</body>
</html>

The error shows up at this line within render:function : "input value"

@T.J.Crowder it assumes you've been through https://deepstream.io/tutorials/core/getting-started-quickstart/ first. But yeah, totally not as clear as it could be — xShirase, Dec 01 '16 at 05:59
I've did that part. But this introduces the React library of the deepstream.io-tools-react. From my understanding of DOM, that line should be correct, but that means it's not a problem with the line, but something else. — Cdore, Dec 01 '16 at 06:03
yes, it's a server thing, happens when it gets HTML when expecting JS. can't help you in this particular case though, good luck ! — xShirase, Dec 01 '16 at 06:07
http://stackoverflow.com/questions/28894074/syntaxerror-expected-expression-got — xShirase, Dec 01 '16 at 06:08
That question doesn't particular highlight the issue here, xShirase. I did a search for the answer, too, and the general thing has been that this type of error tells us nothing about what the issue was. It was always dependent on the code itself. Unless you're saying the html code is the issue. — Cdore, Dec 01 '16 at 06:12

score 0 · Answer 1 · answered Jan 03 '17 at 10:36

You are missing the dependencies required for React. Right now that error is showing up because of invalid characters found in your javascript. Those characters are all part of React's meta language called JSX.

The tutorial assumes that you have set that up. There are two options for you:

Use Webpack to preprocess your code such that all JSX are converted to proper JavaScript
Load in browser transformers. See this tutorial for more information - https://www.sitepoint.com/getting-started-react-jsx/

I recommend going with #2 since that requires less setup.

Nodejs: expected expression, got '<'

1 Answers1