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.

requireAsync: () => import() SyntaxError: Unexpected token import

See original GitHub issue

💬 Questions and Help

Thanks for your SSR example! But as soon as i added to main.js import routes from '../client/routes.js'; with

import loadable from '@loadable/component';
const Cat = loadable(() => import('./Cat.jsx'));
export default [
    {
        path: '/cat',
        exact: true,
        component: Cat
    },
]

immediately get error:

...............................
[nodemon] starting `babel-node src/server/main.js`
/home/....../loadable-components/examples/server-side-rendering/src/client/routes.js:32
  requireAsync: () => import(
                      ^^^^^^
SyntaxError: Unexpected token import

Read carefully the README of the project ?

yes

Search if your answer has already been answered in old issues?

yes, and webpack has been upgraded to “webpack”: “4.28.4”:

"@babel/cli": "^7.1.2",
    "@babel/core": "^7.3.4",
    "@babel/node": "^7.0.0",
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    "@babel/preset-env": "^7.3.4",
    "@babel/preset-react": "^7.0.0",
    "@loadable/babel-plugin": "^5.6.0",
    "@loadable/webpack-plugin": "^5.5.0",
    "babel-loader": "^8.0.4",
    "css-loader": "^2.1.0",
    "mini-css-extract-plugin": "^0.5.0",
    "nodemon": "^1.18.5",
    "npm-run-all": "^4.1.5",
    "webpack": "4.28.4",
    "webpack-cli": "^3.1.2",
    "webpack-dev-middleware": "^3.4.0",
    "webpack-node-externals": "^1.7.2"

May I ask you a more complex example with routes?

Issue Analytics

State:
Created 5 years ago
Comments:19 (7 by maintainers)

Top GitHub Comments

3reactions

valorloffcommented, Mar 8, 2019

cache manipulations don’t help…

The above error went away after I added to “plugins”: "dynamic-import-node" from airbnb/babel-plugin-dynamic-import-node Updated webpack to latest, voila! it’s works!

0reactions

gregbergecommented, Apr 12, 2019

The example works without the plugin, it is a fact. It also works in all web applications we are building at Smooth Code. So it is an issue on your side. I close it.

Top Results From Across the Web

requireAsync: () => import() SyntaxError: Unexpected token ...

This is a major issue of webpack's dependency - acorn. Parsing of import() fails in 4.29.0 (Compilation issue, related to dynamic import) ...

Unexpected token import express js - Stack Overflow

So you can export your function directly and import it. const isEmpty = value => { value === undefined || value === NULL...

Error Unexpected token import in nodejs | Edureka Community

I don't understand what is wrong. Node v5.6.0 NPM v3.10.6. The code: function (exports, require, module, __filename, __dirname) { import ...

ES6 modules in the browser - Unexpected token import

Uncaught SyntaxError: Unexpected token import. I have a test.html file <html> <script src="test.js"></script> <body> </body> </html>. and a test.js file

Nodejs Uncaught SyntaxError: Unexpected token import

An unexpected token import occurs when an error message appears in the ... parsing a blank response in JSON data format. parser() or...