Good morning,
I am totally new in the world of ReactJS. I am trying to make a trial app and I find the following. These are my files:
BtnLink.jsx:
var BtnLink = new React.createClass({
render : function(){
return(
<div>hola</div>
)
}
});
module.exports = BtnLink;
index.js
var Boton = require('./components/BtnLink.jsx');
var app = {
// Application Constructor
initialize: function() {
console.log("here with me");
ReactDOM.render(<BtnLink>, document.getElementbyId('app'))
},
onDeviceReady: function() {
this.receivedEvent('deviceready');
},
// Update DOM on a Received Event
receivedEvent: function(id) {
var parentElement = document.getElementById(id);
var listeningElement = parentElement.querySelector('.listening');
var receivedElement = parentElement.querySelector('.received');
listeningElement.setAttribute('style', 'display:none;');
receivedElement.setAttribute('style', 'display:block;');
console.log('Received Event: ' + id);
}
};
app.initialize();
This code is in a file "BtnLink.jsx", which I include, in my index.js file, according to the browserify documentation. But at the moment of running the command for the compilation:
browserify js/src/index.js -o js/dist/index.js
The console tells me that I have an error in the "hello" line in the BtnLink.jsx file. I really do not see any error, checking it with all the declaration examples. I think it's pretty similar. Does anyone know what I'm missing? Thank you very much.
Update: I updated the files, now apart, I'm trying to run it with babel with this command:
babel --presets es2017 js/src/components --watch --out-dir js/dist/components
The result is the same, both with browserify and with babel returns to me that there is error in the hello :
SyntaxError: js/src/components/BtnLink.jsx: Unexpected token (6:3)
4 | render : function(){
5 | return(
> 6 | <div>hola</div>
| ^
7 | );
8 | }
9 | });