vue3报错之“An import path can only end with a ‘.tsx‘ extension when ‘allowImportingTsExtensions‘ is ..”

最新推荐文章于 2025-04-22 15:13:31 发布
最新推荐文章于 2025-04-22 15:13:31 发布
阅读量2.5k 收藏 1
点赞数 4
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_61498310/article/details/136002561
版权

一、背景

在main.ts中打算引入App.tsx时，Eslint报错如下：

An import path can only end with a '.tsx' extension when 'allowImportingTsExtensions' is enabled.

二、解决

不需要.tsx, 直接引入文件即可

前端花卷
关注
Typescript配置文件(tsconfig.json)详解系列六：allowImportingTsExtensions
zzyp1927314的博客
08-05 1467
如果不使用的时候，在导入文件的时候需要加上typescript编译后的文件后缀。如果使用了就不能输出编译文件，只能输出声明文件（*.d.ts）。
【TS】TypeScript配置详解【三】
mengran_code的博客
09-12 2458
TypeScript 代码最终都会被编译成 JavaScript 代码来运行。这个编译的过程需要使用 TypeScript 编译器，我们可以为该编译器配置一些编译选项。在 TypeScript 项目的根目录下执行 “tsc-init” 命令，快速创建一个 tsconfig.json 文件。该文件用于配置 TypeScript 编译项目时编译器所需的选项。"target": "es2016", // 编译生成的目标版本代码。
An import path can only end with a ‘.ts‘ extension when ‘allowImportingTsExtensions‘ is enabled.
热门推荐
xuelang532777032的博客
05-31 1万+
其实是不需要.ts直接引入文件名就好了。
Vue3项目引入.ts文件报错：An import path can only end with a ‘.ts‘ extension when ‘allowImportingTsExtensions‘
咸鱼滚滚
08-26 3434
An import path can only end with a '.ts' extension when 'allowImportingTsExtensions' is enabled.ts-plugin(5097)
vue3 ts import时报错An import path cannot end with a ‘.ts‘ extension
singlewalk的博客
01-29 2456
typeScript导入时是不需要加入扩展名.ts的,考虑到需要编译出可以用于。因此直接把.ts的后缀去掉就行了。的 JS，所以允许加。
[TS]引入.ts文件报错：An import path can only end with a ‘.ts‘ extension when ‘allowImportingTsExtensions‘
最新发布
Supposelll的博客
04-22 363
在使用VSCode编辑器进行TypeScript编程时，我们经常会使用import语句导入其他的模块。然而，在某些情况下，我们可能会遇到以下错误提示：An import path can only end with a ‘.ts’ extension when ‘allowImportingTsExtensions’ is eabled。这是由于在TypeScript中，import语句引用的是模块的名称而不是具体的文件路径，因此在引用模块时不应该使用文件的扩展名。
An import path cannot end with a ‘.tsx‘ extension. Consider importing ‘./component/tagUpdate.js‘ ins
weixin_45043548的博客
02-24 1635
An import path cannot end with a '.tsx' extension. Consider importing './component/tagUpdate.js' instead.ts(2691)
craco 项目中 配置 ts 报错 无法识别 allowSyntheticDefaultImports
zqy123456789000的博客
06-18 1281
先看错误是 TypeScript 的编译选项之一，它可以允许在非 TypeScript 文件中导入.ts或.tsx文件。默认情况下，这个选项是关闭的moduleResolution 是 TypeScript 编译器用来查找和加载 TypeScript 项目中导入的模块的过程。此过程包括一组规则，用于确定编译器在哪里查找模块文件以及如何将它们与源代码中的导入语句匹配。
【TypeScript】在ts文件中导入其它模块，报错：Unknown file extension “.ts“ for XXX.ts
莫诺库诺的博客
09-07 5215
是ESM模块的导出导入语法，而ts项目初始化后默认的是CommonJS的导入导出语法，所以需要在根目录下的package.json中添加。这其实也跟ESM模块有关，需要在执行ts-node命令时，加上–esm的选项。是用于指定项目中使用 ECMAScript 模块（ESM）的声明。这个错误提示很明显了，直接去tsconfig.json里，加上。导出了一个变量，然后在B.ts中使用。错误描述为位置的文件扩展名。重新执行命令，成功输出结果。如果在A.ts中使用。
An import path cannot end with a ‘.ts’ extension. Consider importing ‘@/*.js’ instead.
GWQ_CY的博客
05-18 1万+
学习前端vue+ts构建项目的时候总会遇到以下的问题： An import path cannot end with a ‘.ts’ extension. Consider importing ‘@/core/services/JwtService.js’ instead. 网上很多文章会让这么改： # 在tsconfig.json中加入以下配置 "baseUrl": ".", "paths": { "@/*": [ "src/*" ] } 在webpack的配置文件中加入 "includ
05-中后台项目-vue3+ts+vite+pinia-elment-plus
2301_80137575的博客
03-14 1151
return {user: "",count: 10,},getters: {},//pinia中没有mutations,可以通过action直接修改store数据，// 而且action中可以有异步操作// 和vuex比较，没有mutations,也没有modulesactions: {},},// 持久化插件配置// 持久化persist: {// 缓存所有state, key值为存入localStorage的键名// {// }// ],
vue3+ts项目在vscode中爆红提示修复
不疲不倦的博客
05-29 8508
新搭建的vue3+ts项目，在vscode中打开，已经安装的的依赖文件也会提示红线
vite+react+typescript 遇到的问题
qq_43383334的博客
11-17 1958
该选项用于控制是否允许在 import 语句中导入 .ts 文件扩展名，它的取值可以是 true 或 false。tsconfig.json 中 compilerOptions:{“moduleResolution”: node}tsconfig.json 中 compilerOptions:{“moduleResolution”: node}删除tsconfig文件中的"allowImportingTsExtensions": true,
Typescript 5.0 发布：快速概览
欢迎来到我的前端博客！这里汇集了关于前端开发的最新技术、实用工具和经验分享。我将为你提供详细的教程、代码示例和实战案例，帮助你掌握Web开发的核心概念和技能。不论你是初学者还是有经验的开发者，这个博客都适合你。
05-21 6189
TypeScript 5.0 添加了几个新标志来自定义模块解析过程。这些标志提供了更细粒度的控制，以控制模块是如何解析的，使您能够微调构建过程。：允许导入带有 TypeScript 特定扩展名（如 .ts、.mts 或 .tsx）的 TypeScript 文件。：强制 TypeScript 在从 node_modules 中的包中读取时，查看 package.json 文件的 exports 字段。
Vue2.5学习笔记（二）深入了解组件
Zijeak的博客
09-08 4310
1.组件使用的细节 1.2 子标签内使用组件 假设想在表格便签内使用一个组件作为行，直接使用组件是不行的，原因在于tbody内只能放tr便签，否则浏览器就会将tbody内的标签解析到外面，从而导致结构的错乱。 为了解决这个问题，我们可以使用is特性，将is特性设置为组件名称，这样既保证了tbody和tr之间的层级关系，也使用了组件。 1.2 非根组件的data必须是一个函数 一个组件的 data 选项必须是一个函数，因此每个实例可以维护一份被返回对象的独立的拷贝。 1.3 在Vue中操作DOM：使用ref
二.TypeScript环境搭建以及基础配置
lazy_tomato的博客
03-30 895
TypeScript。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值