javascript - browserrouter - Token inesperado<error en el componente reaccionar enrutador
react history (2)
Estoy tratando de escribir el componente del enrutador para mi aplicación de reacción. Estoy creando una nueva clase de reacción y defino algunas rutas en el método componentDidMount. Este es un método completo
componentDidMount: function () {
var me = this;
router.get(''/'', function(req){
me.setState({
component: <MainPage />
});
});
router.get(''/realty'', function(req){
me.setState({
component: <RealtyPage />
});
});
router.get(''/realty/:id'', function(req){
me.setState({
component: <RealtyPage id={req.params.id} />
});
});
},
Cuando voy a ''/'' o ''/ realty'' todo funciona. Pero, cuando voy a ''realty / new'', aparece el error Uncaught SyntaxError: token inesperado <en app.js: 1. Pero el depurador de Chrome muestra ese error en mi index.html e incluso no puedo depurar esto en el navegador. Este error ocurre cada vez, cuando voy a la ruta con ''/''. Estoy tratando de usar otros enrutadores del lado del cliente, como page.js, rlite, grapnel, pero todos siguen siendo los mismos. Tal vez alguien tiene alguna idea sobre este error?
UPD: Este es un código completo del componente del enrutador. Ahora usa page.js para el enrutamiento y veo el mismo error
var React = require(''react'');
var page = require(''page'');
var MainPage = require(''../components/MainPage'');
var RealtyPage = require(''../components/RealtyPage'');
var Router = React.createClass({
getInitialState: function(){
return {
component: <RealtyPage />
}
},
componentDidMount: function () {
var me = this;
page(''/'', function (ctx) {
me.setState({
component: <MainPage />
});
});
page(''/realty'', function (ctx) {
me.setState({
component: <RealtyPage />
});
});
page.start();
},
render: function(){
return this.state.component
}
});
module.exports = Router;
El error "token inesperado" puede aparecer por varias razones diferentes. Me encontré con un problema similar, y en mi caso el problema era que la etiqueta del script para cargar el paquete generado en el html era así:
<script src="scripts/app.js"></script>
Al navegar a una ruta con un parámetro (lo mismo sucederá con una ruta anidada o una ruta con más de un segmento), el navegador intentará cargar el script utilizando la URL incorrecta. En mi caso, la ruta de la ruta era ''user /: id'' y el navegador hizo una solicitud a '' http://127.0.0.1:3000/ user /scripts/app.js'' en lugar de '' http://127.0.0.1:3000/scripts/app.js ''. La solución fue fácil, cambie la etiqueta del script a esto:
<script src="/scripts/app.js"></script>
Si alguien más tiene este problema, consulte la pestaña de red de devtools para ver las respuestas del servidor. La razón detrás del mensaje de error es que está intentando cargar un archivo javascript / json y se devolvió un archivo html (posiblemente un mensaje de error).
Los archivos HTML comienzan así normalmente:
<!doctype html>
<html>
...
El navegador ve el primer <y se confunde porque este no es JavaScript válido, por lo que imprime el mensaje de error:
SyntaxError: Unexpected token <
Entonces, en el caso anterior, cuando el OP solicitó un nombre de archivo incorrecto, recibió una página de error (en HTML) que condujo a ese error.
Espero que ayude a alguien más :)