JSX 正在转换为 React.DOM 不是函数 - webpack babel

Question

我是 webpack 和 babel 的新手。我的目标是使用 ReactJS 编写一个 angularjs 指令进行渲染。但是，当我尝试放置一个反应元素时，webpack 将该元素转换为 React.DOM 并抱怨 React.DOM 不是一个函数。

ReactDOM.render(<LikeButton />),element[0]); //gets converted to 
ReactDOM.render(React.DOM(ListContainer, null), element[0]);

TypeError: **React.DOM** is not a function

package.json

"devDependencies": {
    "@babel/core": "^7.1.6",
    "@babel/preset-env": "^7.1.6",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.4",
    "exports-loader": "^3.0.0",
    "imports-loader": "^3.0.0",
    "webpack": "^5.40.0",
    "webpack-cli": "^4.7.2"
  },
  "dependencies": {
    "angular": "1.5.3",
    "angular-animate": "1.5.3",
    "angular-resource": "1.5.3",
    "angular-sanitize": "1.5.3",
    "angular-ui-bootstrap": "^1.3.3",
    "babel-cli": "6.24.1",
    "babel-core": "6.25.0",
    "babel-plugin-transform-class-properties": "6.24.1",
    "babel-preset-env": "1.5.2",
    "babel-preset-react": "6.24.1",
}

.babelrc -

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

如有任何帮助，我们将不胜感激

Image

Answer 1

对于在这里寻找答案的人。我正在使用 /** @jsx React.Dom */ 和较新版本的 React。一旦我删除它，一切都会神奇地工作。来自 https://github.com/babel/babelify/issues/180 的 post 有帮助。

JSX 正在转换为 React.DOM 不是函数 - webpack babel

JSX is getting converted to React.DOM is not a function - webpack babel

javascript

reactjs

webpack

babeljs