老vue项目添加typescript支持[email protected]的博客-程序员秘密_添加typescript支持

技术标签: vue  ts  

老vue项目添加typescript支持

先说一下我的vue版本

"vue": "^2.6.11"
@vue/cli 4.5.11

1.添加依赖(我用yarn,也可以用npm)

yarn add --dev @types/node typescript ts-loader

2.初始化tsconfig.json

执行yarn run tsc --init,自动生成配置文件

3.修改webpack配置

// config/vue.config.js
module.exports= {
    
    chainWebpack: config => {
    
        config.module.test(/\.tsx?$/).use('ts-loader')
        .loader('ts-loader').end();
    }
}

4.根目录下添加ts声明文件

格式以my-开头,例如my-xxx.d.ts

声明文件的目的只告诉ts,遇到.vue文件交给vue进行处理

// my-vue.d.ts
import Vue from 'vue';

declare module '*.vue'{
    
    export default Vue;
}

5.运行,测试

yarn run serve

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/w440149517/article/details/116587336

智能推荐

django函数HttpResponse_python_tty的博客-程序员秘密

location: django.http1. HttpResponse(content= ' ', mimetype=DEFAULT_CONTENT_TYPE)例子:  res = {" success": False, "error": "  "}  return HttpRepsponse(json.dumps(res),  mimetype="application/j

05.full_text match_bool_prefix match_phrase_prefix 查询_夜月行者的博客-程序员秘密

文章目录1. match_bool_prefix查询1.1. 参数2. 短语查询2.1 phrase_prefix_query1. match_bool_prefix查询match_bool_prefix查询会analyze其输入,并根据这些 term 构造一个bool查询。term查询中使用除最后一个词以外的每个term。最后一项在前缀查询中使用。 match_bool_prefix查询,例如GET /_search{ "query": { "match_bool_prefix" :

物联网通讯协议:MQTT,CoAP,NB-IOT,RFID,BLUETOOTH,NFC_weixin_30917213的博客-程序员秘密

一、按网络四层协议分类:NB-IoT,LORA,WIFI,蓝牙,zigbee,4G都是物理层的,这几个都需要芯片模组支持(硬件支持)而MQTT,COAP,HTTP都是应用层协议,这些需要开发服务器,或者对接云平台厂商(软件支持)所以(MQTT,COAP,HTTP)是居于(NB-IoT,LORA,WIFI,蓝牙,zigbee,4G)的上层协议物理层中二、按需要网关来分...

php的反射技术,php反射函数的简单使用大全 - 翟码农技术博客_因诺君的博客-程序员秘密

php反射,看上去显得很高深。其实,简单说来一句话,就是如果获取类的描述信息,诸如它有多少个属性,每个属性又是啥权限;它又有多少个方法,每个方法的权限又是啥。本文的目的,就是为了更全面了解类的信息有哪些,以及如何使用反射函数来获取这些信息。为了方便加深对反射的认识和反射函数的了解,我先捏造了一个简单的学生类,见如下代码://php反射函数的简单使用大全/*** Class Student*/Cla...

Docker 网络模式_苦行鬙的博客-程序员秘密

docker 网络模式---bridge模式---1.bridge模式是Docker的默认设置2.Docker采用 NAT 方式,将容器内部的服务监听的端口与宿主机的某一个端口port 进行“绑定”,使得宿主机以外的世界可以主动将网络报文发送至容器内部3.外界访问容器内的服务时,需要访问宿主机的 IP 以及宿主机的端口 port4.容器拥有独立、隔离的网络栈;让容器和宿主机以外的世界通过NAT建立...

Jackson 包的 XML 注解支持_javas_的博客-程序员秘密_jacksonxmlproperty注解说明

官方文档 https://github.com/FasterXML/jackson-dataformat-xml/wiki/Jackson-XML-annotations 还是有点晦涩的,本文提供注解与其对应的 XML 的预览,便于理解。典型 XML 如下:rootk6="6">   k1>strk1>   k-2>2k-2>   k3>    ki>1ki>  

随便推点

Android如何让Fragment加载到Activity中_风雪夜刃逍遥的博客-程序员秘密

Android上的界面展示都是通过Activity实现的,Activity实在是太常用了。但是Activity也有它的局限性,同样的界面在手机上显示可能很好看,在平板上就未必了,因为平板的屏幕非常大,手机的界面放在平板上可能会有过分被拉长、控件间距过大等情况。这个时候更好的体验效果是在Activity中嵌入”小Activity”,然后每个”小Activity”又可以拥有自己的布局。因此,我们今天的

题目1054:字符串内排序 题目1055:数组逆置 题目1058:反序输出_破灭之诉说的博客-程序员秘密

题目1054:字符串内排序时间限制:1 秒内存限制:32 兆特殊判题:否提交:5529解决:3092题目描述:输入一个字符串,长度小于等于200,然后将输出按字符顺序升序排序后的字符串。输入:测试数据有多组,输入字符串。输出:对于每组输入,输出处理后的结果。样例输入:ba

微信小程序:获取地理位置_FaxMiao的博客-程序员秘密

一、wx.getLocation(OBJECT)获取当前的地理位置、速度。当用户离开小程序后,此接口无法调用。开启高精度定位,接口耗时会增加,可指定highAccuracyExpireTime作为超时时间。属性类型默认值必填说明typestringwgs84否wgs84 返回 gps 坐标,gcj02 返回可用于wx.openLocation的坐标alt...

面试被问了几百遍的 IoC 和 AOP ,还在傻傻搞不清楚?_~梨发霉的博客-程序员秘密

文章目录一、什么是 IoC?为什么叫控制反转IoC 解决了什么问题二、什么是 AOPAOP 解决了什么问题AOP 为什么叫面向切面编程一、什么是 IoC?IoC (Inversion of control )控制反转/反转控制。它是一种思想不是一个技术实现。描述的是:Java 开发领域对象的创建以及管理的问题。例如:现有类 A 依赖于类 B传统的开发方式 :往往是在类 A 中手动通过 new 关键字来 new 一个 B 的对象出来使用 IoC 思想的开发方式 :不通过 new 关键字来创建对象,

springboot websocket 最简聊天室_世幻水的博客-程序员秘密_springboot聊天室

本文将使用不到百行代码,完成一个最简单的聊天室功能,单纯只是最基础的要点。目录为什么有websocketwebsocket 四个重要事件(聊天室)效果(聊天室)服务器springboot端(聊天室)前端为什么有websocket    大家每天使用网络,最常见的就是http协议传输内容,感觉也可以满足需求,多个websocket协议干啥呢?这就要从http本身说起了,http(超文本传输协议),是一种无状态的,客户端发出一次请求,服务器返回一次答

推荐文章

热门文章

相关标签