Question

我试图添加一些React组件以在Ruby on Rails设置中工作，我在程序的早期版本中使用了这些组件，但是还有其他一些问题...因为在Rails 5.1中重新设置了所有组件和webpack模板，我似乎遇到了babel错误的问题。

下面的错误..

我对使用React感到很陌生，因此朝正确方向的任何推动都会很棒。我见过其他人与babel和webpack版本不兼容的类似问题，但我不确定如何在rails设置中更改我的webpack或babel配置，或者我是否需要更改它？

Uncaught Error: Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /Users/worktime/code/granttnarg/Lets-Practice-Again/app/javascript/packs/dashboard.jsx: Unexpected token (35:13)

  33 |   render(){
  34 |     let autoCompleteList = this.state.autoCompleteResults.map((response, index) => {
> 35 |       return <div key={index} className="row show-page">
     |              ^
  36 |               <div id="search-results" className="container">
  37 |               <a href={"songs/" + response.id}>
  38 |                 <div className="card-product index-card"key={index}>
    at Parser.raise (Users/worktime/code/granttnarg/Lets-Practice-Again/node_modules/@babel/parser/lib/index.js:6930)```

My package.json looks like this :

``` {
  "name": "Lets-Practice-Again",
  "private": true,
  "dependencies": {
    "@babel/preset-react": "^7.7.0",
    "@rails/webpacker": "^4.2.0",
    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
    "bootstrap": "^4.3.1",
    "cloudinary-react": "^1.2.1",
    "jquery": "^3.4.1",
    "popper.js": "^1.16.0",
    "prop-types": "^15.7.2",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "vue": "^2.6.10",
    "vue-loader": "^15.7.2",
    "vue-template-compiler": "^2.6.10"
  },
  "devDependencies": {
    "webpack-dev-server": "^3.9.0"
  }
}```

未捕获的错误：模块构建失败（来自./node_modules/babel-loader/lib/index.js）：

0 个答案: