初识Vue3常见问题合集

一、找不到模块“vue”

如图：用npm create vite@latest创建号项目后，在main.js中我们可以看见“vue”会标红，并提示找不到模块“vue”

1、根据提示在tsconfig.json中将moduleResolution的值改为node

2、项目跟目录的xxx.d.ts文件中加入

declare module '*.vue' {
    import type { DefineComponent } from 'vue'
    const component: DefineComponent<{}, {}, any>
    export default component
}

二、 找不到名称 "require"

三、不识别别名@

在tsconfig.json文件中添加

 "baseUrl": ".",
 "paths": {
      "@/*": ["./src/*"]
 },

四、写上后缀（.ts）报错

去掉 .ts, 框架内部要求 .vue 的后缀不能省略

五、挂在window变量

根目录下 window.d.ts

interface Window {
    [k:string]:any
}

六、项目ts中引入js

tsconsif.json 文件中 "allowJs": true 需打开

七、编辑器误以为有undefined或null而产生的报错

解决方案：采用 感叹号（!）非空断言操作符，告诉TypeScript编译器，该表达式不会为null或undefined，并强制将其转换为非空类型

如图：

八、TypeScript 类型断言错误 : 'This expression is not callable Type ' .。 .' has no call signatures' 是由于缺少分号引起的

如图：

解决方案：前面加上；即可