• typescript+vue 常见报错


    报错1. main.ts报错( Cannot find module './App.vue'.)

    原因: typescript不能识别.vue文件

    解决办法: 引入vue的typescript declare库在tsconfig.json中加入

    其中,types是自己延伸的一些declare

    下面的是vue中的types拓展改后的tsconfig{"exclude": [ "node_modules" ], "compilerOptions": { "allowSyntheticDefaultImports": true, "allowJs": true, "module": "es2015", "target": "es5", "moduleResolution": "node", "experimentalDecorators": true, "isolatedModules": true, "typeRoots": [ "./types", "./node_modules/vue/types" ], "lib": [ "es2017", "dom" ], "sourceMap": true, "pretty": true } }2. 在ts的vue中引入js的vue

    原因: 问题同上,使用node/vue的types没起作用

    解决办法: 自己写一个。上面的tsconfig中。types就是为了让我们多一些自己的declare。我是叫index.d.ts,名字随便起啦

    里面写上

    declare module "*.vue" { import Vue from 'vue' export default Vue }3. 在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

    一、(推荐)myThis:any = this this.myThis.$message({ type: 'success', message: '已收藏' })

    二、起作用

    this['$message']({ type: 'success', message: '已收藏' })

    三、(推荐)

    在types下新建如下目录结构

    目录结构/*index.d.ts*/ export declare class MessageParam { type: string; message: string } export declare interface Message { (messageParam: MessageParam):void; } /*vue.d.ts*/ import Vue = require("vue"); import { Message } from "./index"; declare module "vue/types/vue" { interface Vue { $message: Message; } }

    相当于扩展typescript的declare

    4.XMLHttpRequest is not defined在typescript中,经常要用一些自己从其他js插件中引入的变量。但直接在ts中写,ts会报not defined的错误

    解决办法: 使用window.XMLHttpRequest

  • 相关阅读:
    第四周编程总结
    第三周编程总结
    第二周编程总结
    查找整数 编程总结
    求最大值及其下标 编程总结
    C语言I博客作业04
    C语言I博客作业03
    C语言I博客作业02
    作业01
    第八周作业
  • 原文地址:https://www.cnblogs.com/xiewangfei123/p/13205995.html
Copyright © 2020-2023  润新知