Question

有人在我的webpack.config.js文件中看到我做错了什么吗？浏览器给我一个错误，说明＆＃34;意外令牌＆＃39; import＆＃39; ＆＃34;这意味着它无法识别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')
    }]
  }
};

Answer 1

什么文件给你这个错误？ select d1.*, d2.out_number, d2.AMPS,d2.VA,d2.Feed from #tbl1 d1 , #tbl1 d2 where d1.Feed = 'A' and d2.Feed = 'B'？您没有将public/actions/index.js文件传递给babel。你打电话给babel-loader两次。首先作为＆＃34; babel-loader＆＃34;没有任何预设，第二个是＆＃34; babel＆＃34;预设。

正确的装载机将是：

.js

注意改变了测试正则表达式。现在它涵盖了.js和.jsx文件。我建议将预设移动到.babelrc文件

Answer 2

你有两次巴贝尔装载机。只需删除＆＃39; babel-loader＆＃39;从你的装载机阵列。这是因为＆＃34; babel？...＆＃34;正在调用装载机。

Answer 3

你的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')
    }]
  }

如果有效，请尝试添加＆＃39; react-hot＆＃39;到您的装载机列表。

ES6没有编译

3 个答案: