ES6 - Unexpected token 'import'

[JoaoCnh]

So I'm trying out hypernova for a new project but I already have a lengthy app built in React.

The main issue right now is that it fails with the ES6 imports.

Does this work with ES6 or how should I proceed?

EDIT I get that I need to transpile my Js but now it says window is not defined

UPDATE 2 I removed the commonChunks optimization and I tried nodeExternals but with or without node externals it just says that MyComponentName.js is not registered. So I'm a bit stumped. don't know what to do.

[magicmark]

@JoaoCnh could you provide some stack traces, code examples and some more details of how your project is set up? A minimum reproducible example in a repo would be great to help diagnose this.

Have you looked at the example set up? This may help you to set up your project.

[JoaoCnh]

@magicmark Thanks for the reply. I'm not near the project as of this moment but it pretty much looks like this hypernova.js

// in the getComponent method
....
if (name === 'backoffice.js') {
  return require('./public/app.js');
}
....

My webpack is bundling into public/app.js just for demo purposes. Then my structure is like src/js/index.js

In index.js

....
// redux store config
const App (props) => {
    return (
        <Provider store={store}>
            <DemoApp />
        </Provider>
    );
}

export default renderReact('app.js', App);
....

I think I'm confusing something somewhere.

[magicmark]

@JoaoCnh That looks ok to me? as long as you're calling hypernova with 'backoffice.js' as the name?

An actual example that I can reproduce locally would help me understand your problem further, as well as some stacktraces.

[goatslacker]

V8 doesn't have modules support just yet so you'll either need to transpile your code or switch to using something like CommonJS which Node supports natively.

For transpiling the best most straightforward way I've found thus far is to use babel-cli to transpile the files into a build/ directory and then have the server require the files from there.

Example:

package.json

  "scripts": {
    "build": "npm run clean && npm run build:client && npm run build:server",
    "build:server": "babel src -d build"
  },

If you're set on using webpack to build a single server bundle then you'll need to set the target to node so it doesn't include all that window stuff. In other words, you'll need to setup webpack to create two builds, one for the server and one for the client.

[zhixueyong]

It is better to mention this on REAMDE. It took me a while to figure out this root cause and I had thought hypernova is just broken.

[aftabnaveed]

Sorry on commenting on a closed issue here, but I am unable to import ES6 React Components into hypernova and the documentation does not state that anywhere. How can I use ES6 React components here?