vue3 使用<script lang=“ts“ setup>加上lang=“ts“后编译错误

news2024/11/15 8:52:56

报错信息

在这里插入图片描述

报错原因 加上了lang=ts

解决

下载typescript和loader

npm install typescript ts-loader --save-dev

配置vue.config.js 添加下面的代码

configureWebpack: {    
      resolve: { extensions: [".ts", ".tsx", ".js", ".json"] },    
      module: {        
        rules: [    
          {    
            test: /\.tsx?$/,    
            loader: 'ts-loader',    
            exclude: /node_modules/,    
            options: {
              appendTsSuffixTo: [/\.vue$/],    
            }    
          }        
        ]    
      }    
    }

新建tsconfig.json放在项目根目录

{
    "compilerOptions": {
      "target": "es5",
      "module": "commonjs",
      "strict": true,
      "strictNullChecks": true,
      "esModuleInterop": true,
      "experimentalDecorators": true
    }
}

在src根目录下新建vue-shim.d.ts 这个文件可以让vue识别ts文件(不加会报错)

vue-shim.d.ts

declare module "*.vue" {
    import Vue from "vue";
    export default Vue;
}  


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1323606.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Linux】冯诺依曼体系结构与操作系统及其进程

> 作者简介:დ旧言~,目前大二,现在学习Java,c,c,Python等 > 座右铭:松树千年终是朽,槿花一日自为荣。 > 目标:了解冯诺依曼体系结构与操作系统,掌握…

基础数据结构(1):链表

在学习算法时,发现用什么数据结构来存储数据是很重要的,所以学习数据结构也是必须的,先从基础数据结构:数组,字符串,链表,栈,队列,树,矩阵,邻接表…

3D小球跑酷

目录 一、前言 二、开发环境 三、场景搭建 1. 创建项目 2. 创建场景内物体 2.1 创建跑道 2.2 创建玩家 2.3 创建障碍物 2.4 改变跑道和障碍物的颜色 2.4.1 创建材质 2.4.2 给跑道和障碍物更换材质 四、功能脚本实现 1. 创建玩家脚本 2. 相机跟随 3. 胜负的判定 3…

spring boot版本升级遇到的一些问题

背景:由于项目需求,需要将nacos 1.4.6版本升级到2.x版本,由此引发的springboot、springcloud、springcloud Alibaba一系列版本变更。 旧版本分别为: Spring Boot 2.3.5.RELEASE Spring Cloud Hoxton.SR9 Spring Cloud Alibaba 2.2…

基于RocketMQ实现分布式事务

前言 在上一篇文章Spring Boot自动装配原理以及实践我们完成了服务通用日志监控组件的开发,确保每个服务都可以基于一个注解实现业务功能的监控。 而本文我们尝试基于RocketMQ实现下单的分布式的事务。可能会有读者会有疑问,之前我们不是基于Seata完成了…

让AIGC成为你的智能外脑,助力你的工作和生活

人工智能成为智能外脑 在当前的科技浪潮中,人工智能技术正在以前所未有的速度改变着我们的生活和工作方式。其中,AIGC技术以其强大的潜力和广泛的应用前景,正在引领着这场革命。 AIGC技术是一种基于人工智能的生成式技术,它可以通…

SQL 的执行顺序,你搞清楚了吗?

这是一条标准的查询语句: 这是我们实际上SQL执行顺序: from 子句组装来自不同数据源的数据;where 子句基于指定的条件对记录行进行筛选;group by 子句将数据划分为多个分组;使用聚集函数进行计算;使用 having 子句筛选…

【Python必做100题】之第二十二题(复制列表)

题目:将一个列表的数据复制到另一个列表中 重点:确保复制到位要导入copy方法进行深度复制 代码如下: #将一个列表的数据复制到另一个列表中 import copy list [1,2,3,4] print(list) list1 copy.copy(list) list[0] 30 print(list) pri…

CentOS:Docker 创建及镜像删除

1、安装docker 远程连接服务器,可以直接下载netsarang比较好用 家庭/学校免费 - NetSarang Website 如果有残留docker未删除干净,请使用 sudo yum -y remove docker docker-common docker-selinux docker-engine Step1:安装必要的一些…

docker 安装及配置 nginx + tomcat(四):高可用

文章目录 1. 引言2. 高可用架构3. 实际步骤3.1 虚拟机新建系统3.2 安装 keepalived3.3 配置 keepalived3.4 启动 keepalived3.5 验证高可用3.5.1 查看当前效果3.5.2 模拟灾难 4 参考 1. 引言 前情提要: 《docker 安装及配置 nginx tomcat(一&#xff0…

2.vue学习(8-13)

文章目录 8.数据绑定9.el与data的2种写法10.理解mvvm11.object.defineProperty12. 理解数据代理13 vue中的数据代理 8.数据绑定 单向数据绑定就是我们学的v-bind的方式,vue对象变了,页面才变。但是页面变了,vue对象不会变。 双向数据绑定需要…

项目经理和产品经理的区别,如何判断自己适合哪个,从事该岗位前期需做的准备(学习技能考、哪些证书)?

最近很多人咨询“项目经理跟产品经理该怎么选,我更适合哪个?”“项目经理跟产品经理哪个更有钱途 ”“项目经理转产品经理好转吗”等等,今天就一次性说清楚项目经理跟产品经理有什么区别,应该怎么选择。 不想看长篇大论的&#x…

[计网02] 数据链路层 笔记 总结 详解

目录 数据链路层概述 主要功能 封装成帧 透明传输 差错检测 冗余码 差错控制 检错编码 纠错编码 奇偶效验法 CRC循环冗余码 静态分配信道 频分多路复用FDM 时分多路复用TDM 波分多路复用WDM 码分多路复用CDM 随机访问介质的访问控制 ALOHA CSMA CSMA/CD CSMA/…

关于“Python”的核心知识点整理大全30

目录 12.2.3 在 OS X 系统中安装 Pygame 12.2.4 在 Windows 系统中安装 Pygame 12.3 开始游戏项目 12.3.1 创建 Pygame 窗口以及响应用户输入 首先,我们创建一个空的Pygame窗口。使用Pygame编写的游戏的基本结构如下: alien_invasion.py 12.3.2 设…

零刻EQ12 N100 双2.5G网口 All In One新手教程

零刻EQ12 N100 双2.5G网口 All In One新手教程 前言1.硬件配置2.准备工作2.1. ESXI8.0U2镜像2.2. Rufus磁盘工具下载2.3. ikuai镜像下载2.4. StarWindConverter虚拟磁盘格式转换工具下载2.5. OpenWrt镜像下载2.6. 黑群晖RR引导镜像下载(DSM7.2)2.7. 需要准备的硬件2.8. 格式化需…

【C语言(十五)】

动态内存管理 一、为什么要有动态内存分配? 我们已经掌握的内存开辟方式有: int val 20 ; // 在栈空间上开辟四个字节 char arr[ 10 ] { 0 }; // 在栈空间上开辟 10 个字节的连续空间 但是上述的开辟空间的方式有两个特点: • 空间开辟大小是固…

vCenter HA拆分和部署

原创作者:运维工程师 谢晋 vCenter HA拆分和部署 拆分vCenter HA部署vCenter HA 拆分vCenter HA 客户vCenter HA内一台虚拟机出现故障无法连接,报错如下: 点击移除集群报错如下: 查找官方KB,按照官方KB进行移除…

货仓选址

title: 货仓选址 date: 2023-12-19 15:06:02 tags: 排序 categories: 算法进阶指南 题目大意 解题思路 将数组排序后&#xff0c;将货仓建在 x x x 坐标处&#xff0c;其左侧和右侧的商家数量相同的时候最优 实现代码 #include<bits/stdc.h>using namespace std; type…

SQL进阶理论篇(十三):数据库的查询优化器是什么?

文章目录 简介什么是查询优化器查询优化器的两种优化方式总结参考文献 简介 事务可以让数据库在增删改查的过程中&#xff0c;保证数据的正确性和安全性&#xff0c;而索引可以帮数据库提升数据的查找效率。查询优化器&#xff0c;则是帮助我们获取更高的SQL查询性能。 本节我…

FreeRTOS的heap文件

在动态创建任务的时候, 只需要提供一个任务句柄, 内存的分配, TCB的分配, 都是系统来进行的, 也是这个文件做的工作. heap文件一共有5个, 都是内存管理文件, 工程只需要一个就行, 这五个的内存分配方法都不一样. heap1: 只实现了malloc功能, 没有实现free功能.(不用) heap2: 实…