如何解决Vue 3 + TypeScript项目中'Ref<boolean>'类型缺少'value'属性的问题？

Question

旧的vue3+typescript项目，在终端中报

TS2339: Property 'value' does not exist on type 'boolean'.

报错的地方是类似这种操作：

const display = ref(false)
// 此处略去114514行代码
display.value = true

这是个比较老的vue3项目。配置方式甚至依然是用vue.config.js。

通过jenkins发布是正常的，但是在本地运行是有问题的

我尝试过

const display:Ref<boolean> = ref(false)
const display = ref(false) as Ref<boolean>

报错变成了

TS2339: Property 'value' does not exist on type 'Ref<boolean, boolean>'.

————————————————package.json----------------------

{
  "name": "mainweb-renew",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "add": "^2.0.6",
    "ant-design-vue": "^3.0.0-alpha.14",
    "axios": "^0.24.0",
    "babel-plugin-import": "^1.13.3",
    "core-js": "^3.6.5",
    "embla-carousel-vue": "^8.2.1",
    "js-cookie": "^3.0.1",
    "pug-plain-loader": "^1.1.0",
    "qs": "^6.10.2",
    "spritesheet-templates": "^10.5.2",
    "style-resources-loader": "^1.5.0",
    "vant": "^4.9.4",
    "vue": "^3.0.0",
    "vue-class-component": "^8.0.0-0",
    "vue-cli-plugin-style-resources-loader": "^0.1.5",
    "vue-router": "^4.0.0-0",
    "yarn": "^1.22.17"
  },
  "devDependencies": {
    "@types/js-cookie": "^3.0.1",
    "@typescript-eslint/eslint-plugin": "^4.18.0",
    "@typescript-eslint/parser": "^4.18.0",
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-typescript": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.0",
    "@vue/eslint-config-typescript": "^7.0.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^7.0.0",
    "less": "^3.0.4",
    "less-loader": "^6.0.0",
    "postcss-pxtorem": "5.1.1",
    "pug": "^3.0.2",
    "typescript": "~4.1.5",
    "vconsole": "^3.15.1"
  }
}

------------------------tsconfig.json------------------------

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": false,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "webpack-env"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}

Answer 1

感谢@wzp123321 @zcf0508 同学给出的灵感，我今天不得不再次接手这个项目。然后我把package.json中的
"typescript": "~4.1.5"
改成了
"typescript": "^4.1.5"
然后删除node_modules，重新install就没有这个问题了。