项目报错相关解决办法收录

js 可选链使用时报错

报错内容

• Support for the experimental syntax ‘chaining‘ isn‘t currently enabled

解决办法

• 1. 不使用可选连操作符
• 2. 安装 babel 插件依赖
     • babel 插件参考文章@余航是真的余航

---------------------------------------步骤一----------------------------------------------
// 首先安装babel
npm install --save-dev @babel/core @babel/cli @babel/preset-env
// 安装
npm i @babel/plugin-proposal-optional-chaining --save-dev
// 或者安装指定版本（与上面一条二选一）
npm install  @babel/plugin-proposal-optional-chaining@7.13.12 --save

----------------------------------------步骤二---------------------------------------------
在项目根目录下创建babel.config.js文件

module.exports = {
    "presets": [
        [
            "@babel/env",
            {
            "targets": {
                "edge": "17",
                "firefox": "60",
                "chrome": "67",
                "safari": "11.1"
            },
            "useBuiltIns": "entry"
            }
        ]
    ],
    plugins:[
        ["@babel/plugin-proposal-optional-chaining"]  //解析 可选链式语法
    ]
};
----------------------------------------步骤三---------------------------------------------
重启项目  如果项目报错 'Cannot find module ‘@babel/preset-env/lib/utils'

运行下面命令，将@babel/preset-env版本降低至7.12.17就不再报错

npm i @babel/preset-env@7.12.17

Vue2 报错 Already included file name ‘xxx’ differs from file name ‘xxx’ only in casing 的解决方法

参考文章@Clotho

出现原因： 一般是改了文件名的大小写，缓存的判重逻辑是不区分大小写导致的。
比如： 最开始文件是 test.vue ，后面改成了 Test.vue

解决办法

方法一： 去掉.vue 后缀名
方法二： 把大小写改回来
方法三： 改成其他名字
方法四： 重新加载当前文件窗口 或 重新 npm run serve

Vue2 报错 Computed property "deliverableHasPending" was assigned to but it has no sett

参考文章 1@脚本之家

参考文章 2@编程宝库

报错原因:因为在 computed 里面定义的属性 只有一个 return 返回。因为在其他地方进行了赋值操作，导致提示此错误！(即计算属性不支持值得修改（只能针对data中的值进行计算）)

解决办法

只要手动给计算属性添加 get 和 set 方法的不同操作就可以了.(set 方法 写成 set(){} 也可以解决报错)

// 报错代码

    deliverableHasPending() {
      return (
        this.tableData.some((item) => item.uploadStatus === 10) &&
        this.pendingAuditDialog
      )
    },

// 修改后代码

    deliverableHasPending: {
      get() {
        return (
          this.tableData.some((item) => item.uploadStatus === 10) &&
          this.pendingAuditDialog
        )
      },

      set(v) {
        return v
      }
      // set(){} 也可以解决报错
    }