Uncaught SyntaxError: неожиданный токен <возникает при развертывании

Имейте приложение для реагирования, использующее реагирующий маршрутизатор с сервером node / express на бэкэнде, я пытаюсь развернуть на heroku, но он выдает мне эту ошибку ...

'Uncaught SyntaxError: Неожиданный токен <'

Я считаю, что это мой маршрут "поймать все" на моем экспресс-сервере, который обслуживает index.html .. не совсем уверен ... Вот фрагмент моего файла сервера ..

const express = require('express');
const bodyParser = require('body-parser');

const app = express();
const path = require('path');
const bcrypt = require('bcrypt');
const db = require('../database/index.js');
const passport = require('passport');
const helpers = require('./helpers.js');//eslint-disable-line
require('../server/config/passport')(passport);

app.use(express.static(path.join(__dirname, '/../client/dist')));
app.use(require('cookie-parser')());
app.use(require('body-parser').urlencoded({ extended: true }));
app.use(require('express-session')({
  secret: process.env.SESSION_PASSWORD || 'supersecretsecret',
  resave: false,
  saveUninitialized: false,
}));

app.use(passport.initialize());
app.use(passport.session());
app.use(bodyParser.json());

app.post('/', (req, res) => {
  res.end();
});

app.get('/*', (req, res) => {
  res.sendFile(path.join(__dirname, '/../client/dist/index.html'));
});

app.listen(process.env.PORT || 3000, () => {
  console.info('listening on port 3000!');
});

Вот мой файл index.jsx для внешнего интерфейса ..

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import Home from './components/homepage.jsx';
import ArtistRegister from './components/artistregister.jsx';
import VenueRegister from './components/venueregister.jsx';
//import Test from './components/test.jsx';
import reducer from './reducers/index.js';
import { BrowserRouter as Router, Route, Switch } from 'react-router- 
dom';//eslint-disable-line

const store = createStore(reducer, applyMiddleware(thunk));

const Base = ({ store }) => (
  <Provider store = {store}>
    <Router>
      <Switch>
        <Route exact path = "/" component = {Home} />
        <Route exact path = "/artistregister" component = {ArtistRegister} 
        />
        <Route exact path = "/venueregister" component = {VenueRegister} />
        {/* <Route path = "/artist/:username" component = {Test} /> */}
      </Switch>
    </Router>
  </Provider>
);

const render = () => {
  ReactDOM.render(<Base store = {store} />, 
  document.getElementById('app'));
  };

store.subscribe(render);
render();

любая помощь?

Вам необходимо преобразовать JSX в Javascript либо до того, как вы отправите его на сервер, либо иметь сценарий postinstall, запускающий сборку.

skylize 28.03.2018 00:51

Хорошо, я изучу это, но есть ли причина, по которой это не работает на heroku, когда это локально ??

manik 28.03.2018 00:58

поскольку у меня никогда раньше не было этой проблемы, я предположил, что jsx автоматически переносится с помощью webpack.

manik 28.03.2018 00:59
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
3
731
1

Ответы 1

Я понял! он правильно переносился с использованием babel, единственная проблема заключалась в том, что при развертывании мой bundle.js находился в git-ignore.

Другие вопросы по теме