Sunday, May 19, 2024
 Popular · Latest · Hot · Upcoming
-5
rated 0 times [  1] [ 6]  / answers: 1 / hits: 39618  / 9 Years ago, tue, november 10, 2015, 12:00:00

I was following a video tutorial from plural sight. Course name is Building a Real-time App with React, Flux, Webpack, and Firebase.



Please see below code and attached screen shot of the issue i am having. Webpack is failing when ever i try to re build the files. Can someone please advise of what that issue could be. I'm currently using all the latest libraries.



enter
enter



/*webpack.config.js*/

module.exports = {
entry: {
main: [
'./src/main.js'
]
},
output: {
filename: './public/[name].js'
},
module: {
loaders: [
{
test: /.jsx?$/,
exclude: /node_modules/,
loader: 'babel'
}
]
}
}



/*App.jsx*/
import React from 'react';

class App extends React.Component {
constructor() {
super();
this.state = {
messages: [
'hi there how are you ?',
'i am fine, how are you ?'
]
}
}

render() {
var messageNodes = this.state.messages.map((message)=> {
return (
<div>{message}</div>
);
});

return (
<div>{messageNodes}</div>
);
}
}

export default App;

/*main.js*/
import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App.jsx';

ReactDOM.render(<App/>, getElementById('container'));

/*index.html*/
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset=utf-8 />
</head>
<body>
<div id=container></div>
<script src=public/main.js></script>
</body>
</html>

/*package.json */

{
name: reatapp,
version: 1.0.0,
description: ,
main: index.js,
scripts: {
test: echo Error: no test specified && exit 1
},
author: ,
license: ISC,
dependencies: {
babel-core: ^6.1.2,
babel-loader: ^6.0.1,
babel-preset-react: ^6.1.2,
babelify: ^7.2.0,
react: ^0.14.2,
react-dom: ^0.14.2,
webpack: ^1.12.3
}
}

More From » reactjs

 Answers
13

It was solved. The answer was in installing presets npm i --save babel-preset-env babel-preset-react. Then adding another key in the webpack.config.js, in the loader: query: {presets: ['env', 'react'] }. Should be good to go.


[#64455] Friday, November 6, 2015, 9 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
analiseg

Total Points: 460
Total Questions: 96
Total Answers: 90

Location: Ecuador
Member since Thu, Jun 4, 2020
4 Years ago
;