reactjs - ReferenceError : Unknown option: . 存在

Question

你好，我刚刚为 React JS 设置了环境，它给了我错误 ReferenceError: Unknown option: .present.这是 .babelrc 的代码webpack.config.js , package.json和 react.js (文件)

.babelrc

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

webpack.config.js :

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
entry: './react.js',
output:{
    path: path.join(__dirname, '/frapp'),
    filename: 'bundled.js'
},
devServer:{
    inline: true,
    port: 8001
},
module: {
    rules: [
        {
           test: /\.jsx?$/,
           exclude: /node_modules/,
           loader: 'babel-loader',
           query:{
             present:['es2015', 'react']
           }
        }
    ]
},
  plugins: [
    new HtmlWebpackPlugin({
        template: './index.html'
    })
  ]
}

包.json :

{
  "name": "reacc",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --mode development --open --hot",
    "build": "webpack --mode production"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@babel/core": "^7.2.2",
    "@babel/preset-env": "^7.3.1",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.5",
    "html-webpack-plugin": "^3.2.0",
    "react": "^16.8.1",
    "react-dom": "^16.8.1",
    "webpack": "^4.29.3",
    "webpack-cli": "^3.2.3",
    "webpack-dev-server": "^3.1.14"
  }
}

有关更多详细信息，我想在此处截图我的目录

这是错误的一部分:模块构建失败(来自 ./node_modules/babel-loader/lib/index.js):ReferenceError:未知选项:.present。查看https://babeljs.io/docs/en/babel-core/#options 有关选项的更多信息。

事实上，react是打开html页面，但不显示div中的文本

Answer 1

它是presets，而不是present:['es2015', 'react']。您的 webpack.config.js 中有错字。

还有那个query键是什么？

query: {
   present:['es2015', 'react']
}

据我所知，它应该是 options。所以:

options: {
   presets: ['es2015', 'react']
}