解决uniapp开发过程中view、image等标签出现诸如“类型{ class: string; }的参数不能赋给类型......”的问题
利用vueCompilerOptions配置项解决uniapp开发过程种view、image等原生标签出现的类型报错问题
·
问题:
第一次学习uniapp开发,在借助插件具体设置了tsconfig.json类型限制配置后(如下代码),出现了view、image等标签报错(如下图)
{
"extends": "@vue/tsconfig/tsconfig.json",
"compilerOptions": {
"sourceMap": true,
"baseUrl": ".",
"ignoreDeprecations": "5.0",
"paths": {
"@/*": ["./src/*"]
},
"lib": ["esnext", "dom"],
"types": [
"@dcloudio/types",
"@types/wechat-miniprogram",
"@uni-helper/uni-ui-types",
"@uni-helper/uni-app-types",
]
},
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
}
解决:
在对插件等各方面检查后发现了问题所在,主要问题是在开发过程中这些标签被认为了是 Vue 组件,所以某些属性并没有出现在相关interface上,所以忽略掉这这些原生内容即可。具体操作如下:
{
"extends": "@vue/tsconfig/tsconfig.json",
"compilerOptions": {
"sourceMap": true,
"baseUrl": ".",
"ignoreDeprecations": "5.0",
"paths": {
"@/*": ["./src/*"]
},
"lib": ["esnext", "dom"],
"types": [
"@dcloudio/types",
"@types/wechat-miniprogram",
"@uni-helper/uni-ui-types",
"@uni-helper/uni-app-types",
]
},
//加入配置,将标签视为原始组件
"vueCompilerOptions": {
"nativeTags": ["block", "component", "template", "slot"]
},
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
}
所以仅需要对vueCompilerOptions进行相关配置即可。vueCompilerOptions
是一个特殊的配置选项,这允许定制 Vue 的编译器行为。其中的nativeTags
是一个数组,它定义了哪些标签应被视为原生 HTML 标签。这个配置选项只影响 Vue 的编译器行为,不会影响其他 TypeScript 编译选项。
更多推荐
已为社区贡献2条内容
所有评论(0)