2017-02-12 3 views
0

я делаю образец учебник с созданием реагирующего-приложением и WebPack 2, но я получаю эту ошибку:react.js и WebPack 2, нужно решение

enter image description here

Это мой пакет. JSON:

{ 
    "name": "my-app", 
    "version": "0.1.0", 
    "private": true, 
    "devDependencies": { 
    "babel-core": "^6.22.1", 
    "babel-loader": "^6.2.10", 
    "babel-preset-latest-minimal": "^1.1.2", 
    "babel-preset-react": "^6.22.0", 
    "css-loader": "^0.26.1", 
    "html-loader": "^0.4.4", 
    "json-loader": "^0.5.4", 
    "node-sass": "^4.5.0", 
    "raw-loader": "^0.5.1", 
    "react-scripts": "0.8.5", 
    "sass-loader": "^5.0.1", 
    "style-loader": "^0.13.1", 
    "svgo-loader": "^1.1.2", 
    "webpack": "^2.2.1" 
    }, 
    "scripts": { 
    "start": "react-scripts start", 
    "build": "react-scripts build", 
    "test": "react-scripts test --env=jsdom", 
    "eject": "react-scripts eject" 
    }, 
    "dependencies": { 
    "file-loader": "^0.10.0", 
    "react": "^15.4.2", 
    "react-dom": "^15.4.2", 
    "react-router": "^3.0.2" 
    } 
} 

Мои webpack.config.js:

module.exports = { 
    context: __dirname, 
    entry: { 
    app: '../src/index.jsx', 

    }, 
    output: { 
    path: './build', 
    filename: 'app.js', 
    }, 
    module: { 
    loaders: [{ 
    test: /\.html$/, 
    loader: 'html-loader', 
    query: { 
     minimize: true 
    } 
    },{ 
     test: /(\.jsx?)$/, 
     loader: 'babel-loader', 
     exclude: /(node_modules)/, 
     query: { 
     presets: ['latest-minimal', 'react'], 
     } 
    }, { 
     test: /\.css$/, 
     exclude: /(node_modules)/, 
     use: ['style-loader', 'css-loader'] 
    },{ 
     test: /\.svg$/, 
     use: [{ 
     loader: 'file-loader' 
     }, { 
     loader: 'svgo-loader', 
     options: { 
      plugins: [{ 
      removeTitle: true 
      }, { 
      convertColors: { 
       shorthex: false 
      } 
      }, { 
      convertPathData: false 
      }] 
     } 
     }] 
    }] 
    } 
} 

И мой index.jsx:

import React, { Component } from 'react'; 
import { render } from 'react-dom'; 

import App from './App.jsx'; 

render(<App />, document.getElementByClass('App')); 
+0

Вы работаете Реагировать в узле, но вы должны выполнить код в браузере. – Frxstrem

+0

Вам нужно построить пакет, используя Webpack в узле, а затем просмотреть приложение в браузере. На консоли вам нужно запустить команду Webpack для сборки, а затем запустить Webpack dev server. –

+0

Ошибка дает мне, после запуска команды webpack –

ответ

1

приложение для создания-реакции было написано для webpack 1. Вы обновили сайт webpack 2, который вышел только месяц назад. Существуют некоторые синтаксические изменения, которые нарушают файлы версии 1 webpack.config.js. Вот Руководство по миграции:

https://webpack.js.org/guides/migrating/

0

Если вы до сих пор не нашел я думаю this довольно хорошо