0

I am attempting to set up a server-side implementation of create-inferno-app. So, i initially run the create-inferno-app to create a sample project and run the npm start run and everything looks fine. This is my index.js

import { render } from 'inferno';
import App from './App';
render(<App />, document.getElementById('root'));

and this is App.js

import { renderToString } from 'inferno-server';
import './App.css';

const App = function({ color = 'red', name }) {
  return (
    <div style={{ color }}>
      Hello
      <span>{name}</span>
    </div>
  );
}
export default renderToString(<App color="blue" name="world" />)

I get an error TypeError: type is not a function

So how should i use the renderToString method in create-inferno-app ?

anoop chandran
  • 1,460
  • 5
  • 23
  • 42

1 Answers1

0

This import App from './App'; is importing this export default renderToString(<App color="blue" name="world" />) from your app.js.

You want to have your files like this:

index.js

import { render } from 'inferno';
import App from './App';
render(<App />, document.getElementById('root'));

app.js

import './App.css';

App = function({ color = 'red', name }) {
  return (
    <div style={{ color }}>
      Hello
      <span>{name}</span>
    </div>
  );
}
export default App

server.js

import { renderToString } from 'inferno-server';
import App from './App';
cosnt appAsString = renderToString(<App color="blue" name="world" />)
Michal
  • 4,952
  • 8
  • 30
  • 63
  • I tried this solution but it is throwing error, `SyntaxError: Unexpected token import`. I tried with `require`, then it shows `SyntaxError: Unexpected token <`. – anoop chandran Feb 13 '18 at 17:46
  • `SyntaxError: Unexpected token import` is problem with es6 on your server` – Michal Feb 13 '18 at 18:19
  • `SyntaxError: Unexpected token <` is problem with jsx most likely on your server too – Michal Feb 13 '18 at 18:19