vue项目中自定义全局变量(属性)与能通过静态检测但运行时报错的问题

63 阅读1分钟

环境状态

  • @vue/cli 4.5.19
  • vue2

叙述

今天在写项目时遇到了需要定义全局属性的需求,于是在src目录下定义了global.d.ts全局声明文件并写下如下代码:

// global.d.ts

declare var test:string;

在之后的使用中window.test = 'test'发现可以通过ts的静态检测但是保存运行后出现了报错

globalerror.PNG 这让我很疑惑,正常情况代码通过ts静态检测后不会出现问题。之后我尝试重启项目发现这个问题解决了。为了进一步了解出现这个问题的原因我做了些实验。

我使用@vue/cli4.x@vue/cli5.x分别创建了vue2vue3项目,发现只有@vue/cli4.x创建的项目才会出现这个问题(即使@vue/cli升级到5.x运行4.x创建的项目)。因此解决这个问题有两种方法:

  1. 定义一个全局变量重新启动项目
  2. 使用@vue/cli5.x创建项目