2017-01-21 6 views
0

Надеясь это только небольшая проблема, но у меня есть это в моем экспресс-сервере:список Генерирование Реагировать элементы на стороне сервера

app.get('/', function(req, res) { 
    res.send(ReactDOMServer.renderToString(React.createElement(App))); 
}); 

Но есть проблема, когда я ударил:

this.posts = positions.map((bool, index) => 
    <Post key={index} pro={bool}/> 
); 

Похоже, что компонент не распознает:

Unexpected token (19:6) 
    18 |  this.posts = positions.map((bool, index) => 
> 19 |  <Post key={index} pro={bool}/> 
    |  ^
    20 | ); 
    21 | } 

Любая помощь будет оценена! Спасибо!

+0

Вы используете 'babel-node', и у вас есть' .babelrc' настроен? –

+0

Не знаю, не могли бы вы указать мне в правильном направлении? Все, что у меня есть сейчас, - это настройки/плагины babel, настроенные через webpack. –

ответ

0

Чтобы использовать JSX повсеместно, вам также необходимо настроить Babel на вашем сервере. Для запуска babel-node вам необходимо установить babel-cli так:

npm install -g babel-cli 

Внутри вашего проекта, вы должны настроить .babelrc так:.

(Эти пресеты приходят в виде отдельных пакетов, например, если вы хотите использовать react предустановку, вам нужно иметь babel-preset-react, как зависимость проекта)

{ 
    "presets": ["es2015", "react"] // you can add or remove presets 
} 

Затем в коде, где он показывает вам неожиданный маркер:.

this.posts = positions.map((bool, index) => (
    <Post key={index} pro={bool} /> 
)); 

Тогда вы можете реорганизовать express маршрут, как это:

// requires es2015 preset 
// you can also use require 
import { renderToString } from 'react-dom'; 

app.get('/', (req, res) => { 
    res.send(renderToString(<App />)); 
}); 
0

Вы можете использовать либо babel-cli непосредственно, как говорит Адриан, или вы можете обернуть ваше приложение с babel-register. Это рекомендуется только в средах разработки, и вы должны скомпилировать/перенаправить ваше приложение с помощью babel перед запуском в производство.

Предполагая, что у вас уже есть .babelrc установить с react и es2015 плагинов, создать index.js что-то вроде:

const fs = require('fs-promise'); 

fs.readFile('./.babelrc').then((babelrc) => { 
    const config = JSON.parse(babelrc); 
    require('babel-core/register')(config); 
    require('./src/server'); 
}); 

где ./src/server ваш сервер приложений узел (Express, Хапи, и т.д.)

И для запуска всего этого NODE_ENV=development node index.js

 Смежные вопросы

  • Нет связанных вопросов^_^