question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

JSX compiling error `Unexpected token <`

See original GitHub issue

Thanks a lot for great tool!

But i don’t can integrate webpack-isomorphic-tools in existing react-project

[root@ns project]# node ./server/index.js
[webpack-isomorphic-tools] [debug] instantiated webpack-isomorphic-tools v2.5.8 with options {
  "debug": true,
  "assets": {
    "images": {
      "extensions": [
        "png",
        "jpg",
        "jpeg",
        "gif",
        "ico",
        "svg"
      ]
    }
  },
  "webpack_assets_file_path": "webpack-assets.json",
  "webpack_stats_file_path": "webpack-stats.json"
}
[webpack-isomorphic-tools] [debug] entering production mode
[webpack-isomorphic-tools] [debug] registering require() hooks for assets
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.png
[require-hacker] [debug] Hooking into *.png files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.jpg
[require-hacker] [debug] Hooking into *.jpg files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.jpeg
[require-hacker] [debug] Hooking into *.jpeg files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.gif
[require-hacker] [debug] Hooking into *.gif files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.ico
[require-hacker] [debug] Hooking into *.ico files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.svg
[require-hacker] [debug] Hooking into *.svg files loading
[require-hacker] [debug] Hooking into *.webpack-loaders files loading
/home/project/node_modules/react-ux-password-field/src/index.js:229
      infoBar = (<div className="passwordField__info" style={this.infoStyle}>
                 ^

SyntaxError: Unexpected token <
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:387:25)
    at Module._extensions..js (module.js:422:10)
    at Object.require.extensions.(anonymous function) [as .js] (/home/project/node_modules/babel-register/lib/node.js:154:7)
    at Module.load (module.js:357:32)
    at Function.Module._load (module.js:314:12)
    at Module.require (module.js:367:17)
    at require (internal/module.js:16:19)
    at Object.<anonymous> (/home/project/app/assets/js/components/input-password.js:3:21)
    at Module._compile (module.js:413:34)

I do not understand why webpack-isomorphic-tools trying to compile JSX without react-babel transfromations.

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
catamphetaminecommented, Sep 23, 2016

Node.js tries to compile, not webpack-isomorphic-tools. If it’s not in the assets file, then it’s compiled

0reactions
evgenosiptsovcommented, Sep 23, 2016

Ok, it’s happend because express will run after webpack-isomorphic-tools execution. Ok. Suprising that i have webpack-assets.json file, proably this file incoreect and webpack create incorrectly webpack-assets.json . Thank a lot! I am trying to find error.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Reactjs: Unexpected token '<' Error - Stack Overflow
This happens because the react code is executed before the DOM renders. To counter this use jQuery ready() to call the render() method...
Read more >
[Bug]: Unexpected Token '<' error in jsx · Issue #13926 - GitHub
I ran into the same issue. I solved it by removing type:'module' from package.json. All reactions.
Read more >
How To Fix Unexpected Token Error for NPM Package in react ...
Are you getting this error with react -leaflet or other packages. If you are then it's most likely related to babel and there...
Read more >
JSX - Hands on React
Uncaught SyntaxError: Unexpected token <. Because the bracket syntax (JSX) has not been compiled to JavaScript. To install the JSX compiler (Babel).
Read more >
Uncaught SyntaxError: Unexpected token in JSX
I am using Parcel to build my React app. It's throwing a syntax error: unexpected token. ... I looked at this post but...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found