Я новичок в React.JS (в Windows 10), я выполняю первый барабан внутри, я использую для создания базовой рабочей области для своего React.app. Но после настройки пакетов webpack и babel во всем мире и локально в моем репозитории и создании первого приложения для приветствия, первая сборка не сработала.REACT.JS: Многократная основная ошибка
моя предварительная установка:
npm install -g babel
npm install -g babel-cli
npm install webpack --save
npm install webpack-dev-server --save
npm install react --save
npm install react-dom --save
npm install babel-core
npm install babel-loader
npm install babel-preset-react
npm install babel-preset-es2015
поэтому мой package.json содержит:
{
"name": "reactapp",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "webpack-dev-server --hot"
},
"author": "",
"license": "ISC",
"dependencies": {
"babel-cli": "^6.0.0",
"babel-core": "^6.17.0",
"babel-loader": "^6.2.5",
"babel-preset-es2015": "^6.16.0",
"babel-preset-react": "^6.16.0",
"react": "^15.3.2",
"react-dom": "^15.3.2",
"webpack": "^1.13.2",
"webpack-dev-server": "^1.16.2"
}
}
мой репозиторий содержит 4 другие файлы: index.html, App.jsx , main.js, webpack.config.js
index.html:
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<title>React App</title>
</head>
<body>
<div id = "app"></div>
<script src = "index.js"></script>
</body>
</html>
App.jsx:
import React from 'react';
class App extends React.Component {
render() {
return (
<div>
Hello World!!!
</div>
);
}
}
export default App;
main.js:
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App.jsx';
ReactDOM.render(<App />, document.getElementById('app'));
webpack.config.js
var config = {
entry: './main.js',
output: {
path:'./',
filename: 'index.js',
},
devServer: {
inline: true,
port: 8123
},
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel',
query: {
presets: ['es2015', 'react']
}
}
]
}
}
module.exports = config;
поэтому, когда я буду запускать "старт НПМ" я получаю неудавшуюся сборку (захват -attached-)
и точно так же, на локальном хосте: 8123, я получать ту же ошибку, как показано ниже:
Любое предложение, чтобы решить, что ??
'запись:«./main.js»' –
да это было, но он по-прежнему не работает – firasKoubaa
может быть, что он пытается перезагрузить main.js после того, как цель для сборки находится на том же пути, что и ваш исходный код? Почему бы не поместить ваши записи и исходные файлы в отдельный каталог, так что webpack не запутывается после этого – Icepickle