意外的令牌'<'React Webpack构建

时间:2019-09-30 10:25:34

标签: javascript reactjs webpack babeljs

我在我的ReactJs项目中使用Webpack4和@ babel / core7。当我尝试构建项目时,在终端上出现波纹管错误

  ./src/views/Pages/Login/Login.js中的

ERROR模块构建失败(来自   ./node_modules/babel-loader/lib/index.js):SyntaxError:   /xx/xx/web/src/views/Pages/Login/Login.js:意外令牌(8:6)

 render() {    return (
       <div className="app flex-row align-items-center">
        ^

Package.json

"dependencies": {
    "@babel/core": "^7.4.0",
    "@babel/plugin-proposal-class-properties": "^7.5.5",
    "@babel/plugin-transform-runtime": "^7.5.5",
    "@babel/preset-env": "^7.4.2",
    "@babel/preset-react": "^7.0.0",
    "@coreui/coreui": "2.1.12",
    "@coreui/coreui-plugin-chartjs-custom-tooltips": "1.3.1",
    "@coreui/icons": "0.3.0",
    "@coreui/react": "2.5.1",
    "@devexpress/dx-react-core": "2.0.2",
    "@devexpress/dx-react-grid": "2.0.2",
    "@devexpress/dx-react-grid-bootstrap4": "2.0.2",
    "axios": "0.19.0",
    "bootstrap": "4.3.1",
    "babel-loader": "8.0.5",
    "copy-webpack-plugin": "5.0.4",
    "css-loader": "2.1.1",
    "dotenv-webpack": "1.7.0",
    "file-loader": "4.1.0",
    "chart.js": "2.8.0",
    "core-js": "3.1.4",
    "html-webpack-plugin": "3.2.0",
    "image-webpack-loader": "5.0.0",
    "node-sass": "4.12.0",
    "node-sass-chokidar": "1.3.4",
    "npm-run-all": "4.1.5",
    "mini-css-extract-plugin": "0.8.0",
    "optimize-css-assets-webpack-plugin": "5.0.3",
    "prop-types": "15.7.2",
    "react": "16.8.6",
    "react-chartjs-2": "2.7.6",
    "react-redux": "7.1.0",
    "react-router-dom": "5.0.1",
    "reactstrap": "8.0.0",
    "redux": "4.0.4",
    "style-loader": "0.23.1",
    "terser-webpack-plugin": "1.4.1",
    "webpack": "4.29.6",
    "webpack-cli": "3.3.0"
  }

Webpack.config.js

module: {
    rules: [
      {
        test: /\.(js|jsx|es6)$/,
        exclude: /node_modules/,
        use: [
          {
            loader: 'babel-loader',
            options: {
              presets: ["@babel/preset-env"]
            }
          }
        ],
      },
......
]
}

.babelrc

{
    "presets": [ "@babel/preset-env","@babel/preset-react"],
    "plugins": ["@babel/plugin-proposal-class-properties","@babel/transform-runtime"]
  }

1 个答案:

答案 0 :(得分:0)

您需要像这样向.babelrc文件中添加预设反应

...
selected_song = random.choice(songs)   # select music file
pygame.mixer.music.load(selected_song) # load music file
pygame.mixer.music.play()              # play it
...

如果不是这种情况,则可以检查其文档here