В чем проблема, не могу сконфигурировать Webpack-Babel-React?

Question

[Ninja Mate]

Спасайте!)
Выдает все время вот такую ошибку, должно быть что то простое, но 8 часов поиска не помогли.

B:\Contact form>webpack
Hash: cd11ae8651d90f1215a2
Version: webpack 1.12.11
Time: 549ms
   [0] multi main 52 bytes {0} [built] [1 error]
  [76] ./app/index.jsx 0 bytes [built] [failed]
    + 75 hidden modules

ERROR in ./app/index.jsx
Module parse failed: B:\Contact form\app\index.jsx Line 7: Unexpected token <
You may need an appropriate loader to handle this file type.
| var Hello = require('./Hello.jsx');
| 
| React.render(<Hello />, document.getElementById('content'));
 @ multi main

Вот ссылка на проект https://github.com/Antibioticvz/SimpleContactFormO...

Answer 1

[vsuhachev]

jsx-loader и bable-loader это разные вещи. jsx-loader у вас в package не указан. Потом, react-hot-loader используется совместно с webpack-dev-server, которого тоже нет в package. Вобщем у вас какая-то каша в конфиге.

Возмите какой-нибудь современный бойлерплэйт (например мне нравится этот) и поглядите как все должно быть.

Comments

[Ninja Mate]

каша потому, что незапустился проект и ставил уже все подряд, задача сейчас запустить проект тоторый будет работать на девелопменте с hot loader и сразу через babel делать продакшн сборку(серверной части у проекта не будет, так что хотелось сразу тестировать и размер смотреть со свеми зависимостями)
Сейчас вот так и все равно не работает

"homepage": "https://github.com/Antibioticvz/SimpleContactFormOnClick#readme",
  "dependencies": {
    "babel": "^6.3.26",
    "babel-preset-react": "^6.3.13",
    "jsx-loader": "^0.13.2",
    "react": "^0.14.6",
    "react-bootstrap": "^0.28.2",
    "react-dom": "^0.14.6"
  },
  "devDependencies": {
    "babel-core": "^6.4.0",
    "babel-loader": "^6.2.1",
    "babel-preset-es2015": "^6.3.13",
    "babel-preset-react": "^6.3.13",
    "react-hot-loader": "^1.3.0"
  }

[vsuhachev]

Ну я же дал вам ссылку по которой работает... Тупо клонируйте с гитхаба, сделайте npm install потом npm start или npm build

[Ninja Mate]

vsuhachev: Да спасибо заработало, за пол часа закончил свою часть проекта. Но обидно другое, что не разобрался как грамотно webpack настроить, пользоваться можно, но реально не понятно как под себя подгонять. Еще раз спасибо за подсказку (смотрел Абрамова с последней конференции и он как раз рассказывал про эту сборку)

[vsuhachev]

Ninja Mate: как менять это уже другой вопрос, рекомендую это отличное видео на русском https://learn.javascript.ru/webpack-screencast

[Ninja Mate]

vsuhachev: именно его и смотрел сегодня ночью)