0

ここで webpack.config.js ファイルで私が間違っていることを誰かが見ていますか? ブラウザに「予期しないトークン 'インポート'」というエラーが表示されます。これは、ES6 構文を認識していないことを意味します。ローダーに何か問題がありますか？依存関係を何度もインストールして再インストールしたので、そこに問題があるとは思いません。

webpack.config.js

var path = require('path');
var webpack = require('webpack');

module.exports = {
  devtool: 'eval',
  entry: [
    'webpack-dev-server/client?http://localhost:3000',
    'webpack/hot/only-dev-server',
    './public/index.jsx'
  ],
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'bundle.js',
    publicPath: '/static/'
  },
  resolve: {
    root: __dirname,
    alias: {
      App: 'public/components/App.jsx',
      Home: 'public/components/Home.jsx',
      Footer: 'public/components/Footer.jsx',
      Inventory: 'public/components/Inventory.jsx',
      Login: 'public/components/nav/Login.jsx',
      Navbar: 'public/components/nav/Navbar.jsx',
      ProductSearch: 'public/components/Product-Search.jsx',
      SingleProduct: 'public/components/Single-Product.jsx',
      Product: 'public/components/Product.jsx',
      Signup: 'public/components/Signup.jsx',
      LandingNavbar: 'public/components/nav/LandingNavbar.jsx',
      ProductSearch: 'public/components/ProductSearch.jsx',
      Examples: 'public/components/Examples.jsx',
      Pricing: 'public/components/Pricing.jsx',
      Profile: 'public/components/Profile.jsx',
      Checkout: 'public/components/Checkout.jsx',
      Receipt: 'public/components/Receipt.jsx',
      RequireAuth: 'public/components/auth/require_auth.jsx',
      Signout: 'public/components/Signout.jsx',
      Tour: 'public/components/tour/Tour.jsx',
      BusinessTypes: 'public/components/tour/BusinessTypes.jsx',
      Customers: 'public/components/tour/Customers.jsx',
      Features: 'public/components/tour/Features.jsx',
      GettingStarted: 'public/components/tour/GettingStarted.jsx',
      MultiStore: 'public/components/tour/MultiStore.jsx',
      Support: 'public/components/tour/Support.jsx',
      Actions: 'public/actions/index.js'
    },
    extensions: ['', '.js', '.jsx']
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin()
  ],
  module: {
    loaders: [{
      test: /\.jsx$/,
      loaders: ['react-hot','babel-loader', 'babel?presets[]=es2015,presets[]=stage-0,presets[]=react'], 
      include: path.join(__dirname, 'public')
    }]
  }
};
4

3 に答える 3

0

バベルローダーが2回あります。ローダーの配列から「babel-loader」を削除するだけです。これは、"babel?..." が既にローダーを呼び出しているためです。

于 2016-04-29T11:37:26.947 に答える
0

package.json には、babel-loader が含まれている必要があります。したがって、必ず実行してください：

npm install babel-loader babel-core babel-preset-es2015 babel-preset-react babel-preset-stage-0 --save-dev

次に、これをwebpack構成ファイルで：

  module: {
    loaders: [{
      test: /\.jsx$/,
      loader: 'babel-loader',
      query: {
        presets: ['es2015', 'stage-0', 'react']
      },
      include: path.join(__dirname, 'public')
    }]
  }

それが機能する場合は、ローダーのリストに「react-hot」を追加してみてください。

于 2016-04-29T11:38:02.860 に答える