TS中使用引用路径别名报错

最新推荐文章于 2024-07-12 11:49:04 发布
最新推荐文章于 2024-07-12 11:49:04 发布
阅读量4.2k 收藏 3
点赞数 1
分类专栏： JavaScript typescript 路径别名 文章标签： typescript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mountain_zq/article/details/119361135
版权
在TypeScript项目中，当使用路径别名时遇到找不到模块或声明的错误，通常是因为未在tsconfig.json中正确配置。解决方法是在与src同级的tsconfig.json文件中，添加相应的compilerOptions配置，以确保与webpack中的路径别名设置一致。
摘要由CSDN通过智能技术生成

在TS中引用路径别名提示找不到模块或者相应的声明

1.ts中使用路径别名报错
在这里插入图片描述
在react中通常路径别名都是在webpack的webpack.config.js文件中配置的，但是在引入了ts之后，webpack中的路径别名引用失效了
此时我们需要在跟src文件同级目录的tsconfig.json文件中添加配置：
在这里插入图片描述
注意要在compilerOptions中添加（webpack中的路径也需要配置）

"compilerOptions": {
   
    "target": "es6" /**指定ECMAScript目标版本**/,
    "module"
最低0.47元/天 解锁文章
将心_max
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
webpack路径别名引发ESLint报错Unable to resolve path to module ‘***‘
Baron的技术blog
08-06 7010
解决方法：就是使用 eslint-import-resolver-webpack 这个插件。 场景复原，例如平时我们在 webpack 中设置了这样的一个别名路径： alias:{ components: path.resolve(__dirname, "src", "components") } 然后我们使用别名去加载模块路径： import NewsFeed from 'components/NewsFeed' 但是在执行 ESLint 校验之后，会报错：Unable to resolve pa
vscode中Vue别名路径提示的实现
10-15
主要介绍了vscode中Vue别名路径提示的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
typescript 路径别名问题（别名设置 & 开发与打包时路径问题）
问白的博客
02-13 3767
ts别名问题
Vite + Vue3 + TS项目根路径别名配置
最新发布
洛*璃的博客
07-12 1287
本文博主将介绍如何在的前端项目中配置根路径别名，以便在开发过程中更轻松地引用模块和组件。
【记录】关于在ts文件中引入方法报错的解决办法Cannot find module ‘@/**‘ or its corresponding type declarations
z13540112421的博客
06-20 547
1.在上面添加 //@ts-ignore;3.不使用第二种方法则把@改成相对路径即可。2.在tsconfig中配置。
vue3和TS引入路径报错：Cannot find module ‘@config/utils‘ or its corresponding type declarations.
Lucky_girl_wan的博客
07-02 165
1.在vite.config.ts中进行配置。2.在tsconfig.json中进行配置。
Vue3+TS更改文件系统路径别名报错：找不到模块“@/store”或其相应的类型声明。ts(2307)
weixin_59504917的博客
04-05 880
更改 vite.config.ts 文件，配置文件别名后，在页面中使用 @ 爆红 ，但是页面不报错。tsconfig.json 文件 或者 jsconfig.json 文件也要进行文件系统路径别名设置。引入TS 文件报错找不到相应类型声明，因为在配置好 vite.config.ts 文件后。tsconfig.json或者 jsconfig.json 文件。
webpack+ts+vue 在ts文件中使用路径别名报错
m0_55557411的博客
01-22 559
webpack+ts+vue 在ts文件中使用路径别名报错
关于Vue3+ts引入文件使用alias别名@时报错问题，process is not defined
qq_38828542的博客
03-17 590
如题，解决办法： 一、首先确保有两个文件：    tsconfig.json   vite.config.ts(注：如果是vue.config.js，则手动改为vite.config.js) 二、 在ts.config.json中修改 { "compilerOptions": { ...... "paths": { "@/*": ["src/*"] } ...
怎么在ts中配置路径别名使用@
yezi153的博客
11-28 5684
第一大步骤：1.下包 npm i @craco/craco 2.在项目根目录下创建配置文件craco.config.js，并在里面配置路径别名 核心代码 const path = require('path') module.exports = { // webpack 配置 webpack: { // 配置别名 alias: { // 约定：使用 @ 表示 src 文件所在路径 '@': path.resolve(__dirname, 'src..
esbuild-plugin-alias:用于路径别名的esbuild插件
05-16
用于路径别名的插件。 基本原理 有时，根据某些条件（例如env变量）进行动态导入以解析为不同的文件很有用。 安装 npm install --save-dev esbuild-plugin-alias 用法 在esbuild config的plugins部分中定义插件，...
vue3+vite+ts 配置别名@报错找不到模块
weixin_43754395的博客
11-30 3643
vue3+vite+ts配置别名@报错
解决vite+vue3+typescript中使用@路径映射src引入vue router和vuex报错问题
yunmengying的博客
07-01 5178
报错为 找不到模块@/store（@/router） 这个报错不影响使用，查明原因不是ts.config.json的路径映射配置问题，而是router和vuex的index文件是js文件，而main.ts是typescript文件，引入的router和store没有类型声明，统一修改为typescript文件后解决。 文件修改如下： main.ts //vue router import router from '@/router/index' //vuex import store from '@/s
React + ts + eslint 项目配置路径别名
Joanna_7471的博客
06-16 1054
提交本地代码（避坑，npm run eject 时会报错） npm run eject => 暴露webpack.config.js（react脚手架默认将webpack配置隐藏起来，此操作不可逆） config文件夹下 webpack.config.js文件 // 大致 327 行 alias:{ // ... '@': path.resolve(__dirname, '../src' ) } tsconfig.json文件 { "compilerOptions":{ ... .
Linux系统下在线安装Jenkins的教程详解
weixin_44505962的博客
12-08 372
一、安装前的清理工作 rpm -qa | grep jdk rpm -qa | grep gcj yum -y remove java-xxx-xxx 二、下载Jenkins（目录根据个人习惯） wget https://mirrors.tuna.tsinghua.edu.cn/jenkins/redhat-stable/jenkins-2.204.3-1.1.noarch.rpm #清华镜像超级快 三、安装修改配置文件 1、安装命令 rpm -ivh jenkins-2.204.3-1.1.noarc
ts-node运行node+ts脚本报错：Error: Cannot find module ‘@model‘
qq_38872934的博客
02-03 1764
在node环境下，使用ts-node运行ts脚本，找不到定义了别名的路径，即在tsconfig.json里面定义的paths无效。
引入react文件报错_初见React，一步一个坑
weixin_39755824的博客
12-20 1234
说在前头：新入职公司，react还不是很熟悉，就开始了官网重构的项目，刚开始开发速度很慢，而且语法也很多不规范的地方，在这里总结一下开发中遇到的坑。No.1???? React项目引入图片，less，css等报错手动搭建的webpack项目，最初你可能很多loader都没有装！所以你需要装一下各种loader，比如style-loader，css-loader，url-loader在build/webp...
vue3 ts 引用js-md报错
06-08
如果你在 Vue 3 TypeScript 中使用 js-md5 库时遇到了报错，可能是因为 TypeScript 默认不支持从 JavaScript 模块导入类型。解决这个问题的方法有两种： 1. 安装 `@types/js-md5` 类型声明库。 这个库提供了 js-md...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值