ts无法识别.vue文件
终端提示can‘t find module './App.vue'
原因是ts不能识别.vue 为后缀的文件
解决方法: 引入ts的声明文件,在声明文件中对vue进行声明
1)创建shims-vue.d.ts 只要是以 后缀 .d.ts结尾即可
2)在shims-vue.d.ts 中声明文件
/** * shims-vue.d.ts的作用
* 是为了typescript做的适配定义文件,因为.vue文件不是一个常规的文件类型,ts是不能理解vue文件是干嘛的,
* 加这一段是告诉ts,vue文件是这种类型的。
* 这一段删除,会发现import的所有vue类型的文件都会报错。
*/
declare module '*.vue' {
import Vue from 'vue'
export default Vue
}
ts项目中无法找到.ts文件
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"useDefineForClassFields": true,
"moduleResolution": "node",
"strict": true,
"jsx": "preserve",
"sourceMap": true,
"skipLibCheck": true,
"resolveJsonModule": true,
"esModuleInterop": true,
"lib": ["esnext", "dom"],
"baseUrl": "./",
"paths": {
"@": ["src"],
"@/*": ["src/*"]
}
},
"include": [
"src/**/*.ts",
"src/**/*.d.ts",
"src/**/*.tsx",
"src/**/*.vue",
"*.ts"
],
"references": [{ "path": "./tsconfig.node.json" }]
}
或者是 这样是多级选目录时不报错
"src/**/*.ts",
有时候还会有xxx.ts这样 就必须加
"*.ts"
Vue+ts项目导入Js文件方法
在 tsconfig.json文件里修改include
"compilerOptions": {
"noImplicitAny": false, // 不进行any语法检查
"allowJs": true, // 允许js
}
"include": [ "src/**/*.js", // 导入js
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx",
"public/config.js" // 导入js
],
在ts的vue中使用一些vue组件带来的变量,如element-ui的$message(Property '$message' does not exist on type ...)
原因:缺少typescript类型
解决:
this.$message({
type: 'success',
message: '已收藏'
})
抛出错误 Property '$message' does not exist on type
1.
myThis:any = this
this.myThis.$message({
type: 'success',
message: '已收藏'
})
XMLHttpRequest is not defined
在typescript中,经常要用一些自己从其他js插件中引入的变量。
但直接在ts中写,ts会报not defined的错误
使用window.XMLHttpRequest