错误:插件/预设文件不允许导出对象,只能导出功能。 ReactJS

时间:2018-12-13 01:53:56

标签: javascript reactjs webpack babeljs babel

我已经尝试过不同版本的babel和webpack,但是这个问题仍然相同。我的webpack.config.js不是错误吗? 如您所见,那里的webpack版本很低,如果出现这些错误,也许是在webpack的版本上?

我尝试使用较低版本的babel,但仍保持不变,我真的无法弄清楚。已经是24小时的问题,我仍然无法解决此问题。我想在ReactJS版本16中升级。

webpack.config.js

var path = require("path")
var webpack = require('webpack')
var BundleTracker = require('webpack-bundle-tracker')

// new WebpackDevServer(webpack(config), {

module.exports = {

  context: __dirname,
  entry: [
      'webpack-dev-server/client?http://localhost:3000',
      'webpack/hot/only-dev-server',
      './app/modules/common/index'
  ],

  output: {
      path: path.resolve('./app/static/bundles/'),
      filename: '[name]-[hash].js',
      publicPath: 'http://localhost:3000/app/static/bundles/',
       // Tell django to use this URL to load packages and not use STATIC_URL + bundle_name
  },

  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin(), // don't reload if there is an error
    new BundleTracker({filename: './webpack-stats.json'}),
  ],

  module: {
    loaders: [
    { test: /\.css$/, loader: "style-loader!css-loader" },
      { test: /\.(jpe?g|png|gif|svg)$/i, loader: "file-loader?name=public/icons/[name].[ext]"},
      {
        test: /\.(js|jsx)$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        query: {
            presets: ['es2015','react']
        }
    },
    ],
  },

  resolve: {
    modulesDirectories: ['node_modules', 'bower_components'],
    extensions: ['', '.js', '.jsx']
  }
}

Babel配置(.babelrc,package.json,cli命令)

package.json

{
"devDependencies": {
"@babel/core": "^7.0.1",
"@babel/preset-env": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"babel-loader": "^8.0.2",
"react-hot-loader": "^3.0.0-beta.6",
"webpack": "^1.9.8",
"webpack-bundle-tracker": "0.0.5",
"webpack-cli": "^2.1.3",
"webpack-dev-server": "^1.9.0",
"mobx-logger": "^0.5.0",
"mobx-react-devtools": "^4.2.11",
"file-loader": "^0.11.2"
"react": "^16.6.3",
"react-dom": "^16.6.3",
  },
}

.babelrc

{
    "presets": [
        "@babel/preset-env",
        "@babel/preset-react"
    ]
}

错误的屏幕截图: enter image description here

1 个答案:

答案 0 :(得分:0)

我现在明白了,我更改了 webpack.config.js

query: { presets: [ '@babel/env', '@babel/react', ]