react+webpack项目遇到的报错和解决方法

发布于:2023-07-04 ⋅ 阅读:(71) ⋅ 点赞:(0)
  1. 一直报react语法错误
    这里写图片描述
    解决方法a:
    装babel-loader: npm install babel-loader
    装babel-preset-react: npm install babel=preset-react
    修改webpack.config.js如下:
    这里写图片描述

    解决方法b:
    引用React-dom的同时要需要引用react
    不然浏览器会报错找不到react
    这里写图片描述

  2. 浏览器报错:react: Minified React error #130;

    这里写图片描述
    打开链接是详细报错:
    这里写图片描述
    解决方法: jsx写法问题(需要export)
    错误写法:
    这里写图片描述
    正确写法:
    这里写图片描述
    因为render 的语句需要render的,所以只要export这个就行了,如果是同一个文件的其他组件就直接写class xxx

  3. 开发环境打包生成两个不一样的文件
    一开始打包 npm run deploy 生成的文件是:
    这里写图片描述
    原因是我在webpack.config.js里写的是:
    这里写图片描述
    解决办法:
    这里写图片描述
    生成的就是一个app.min.js和一个vendor.min.js(dist文件夹下)

相关项目链接<<

本文含有隐藏内容,请 开通VIP 后查看