解决配置了src别名后，@/App.vue依然报错的问题

于 2024-09-16 01:49:20 发布
阅读量122 收藏
点赞数 1
文章标签： typescript vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hua4st/article/details/142291767
版权

原因是TS更新后的配置文件变为了三个

把原先写在tsconfig.json中的配置项写到tsconfig.app.json中即可

4sthuajuan
关注
不影响项目运行但提示找不到模块“@/App.vue”或其相应的类型
itYuMi的博客
09-03 1178
找不到模块“@/App.vue”或其相应的类型。未正确引入 Vue 单文件组件的类型声明。
【报错】Failed to resolve import “@/..“ from “src/...“ @找不到路径
owo_ovo的博客
11-24 9581
Failed to resolve import “@/.." from "src/..." @找不到路径
VSCode 报错：找不到模块“./App.vue”或其相应的类型声明。ts(2307)
m0_55557411的博客
05-20 6695
VSCode 报错：找不到模块“./App.vue”或其相应的类型声明。ts(2307)
webpack中Module not found: Error: Can‘t resolve ‘@/pages/home.vue‘ in ‘/Users/Documents/react
qq_42535651的博客
08-27 5935
在使用 webpack 进行 vue 项目搭建时，引入vue组件时出现了 Module not found 的问题。 以前使用 vue-cli 脚手架帮我们配置好了 webpack 的配置。现在需要我们自己配置。 先配置 webpack 中的 alias ： module.exports = { resolve: { // 以下配置会将没指定拓展名的文件按如下类型查找匹配 extensions: ["*", ".js", ".vue"], // 设置别名 alias:
Vue编译报错 “Failed to resolve import “@/router“ from “src\main.js“. Does the file exist ? “ 问题修复
valsedefleurs的博客
06-26 2459
Vite构建工具解析别名resolve.alias配置
vue3+vite+ts 配置别名@报错找不到模块
weixin_65688394的博客
08-16 556
我在做vue3+vite+ts项目的时候，在配置别名这一步的时候遇到了一个问题，使用@引入会报错，如下图所示。import path from ‘path‘ 有波浪线警告解决办法。建议使用pnpm安装types/node 20.14.5版本,2. 不在提示报错, .vue后缀必写,不想写的可以去找一下配置,我使用npm 安装不了types/node,一直安装报错。1. 有了src文件下文件提示。
@import ‘./common/stylus/mixins.styl‘引起的一系列错误
weixin_46331416的博客
09-22 1713
@import './common/stylus/mixins.styl’引起的一系列错误 环境：vue-cli 4 代码： <template> <div> <h1>App 组件</h1> <button class="btn btn1">按钮1</button> <button class="btn btn2">按钮2</button> <ul>
[vite] Internal server error: Failed to resolve import “@/src/config/index“ from “src/api/request.j
yuanmenglxb2004的博客
07-22 1034
用vue3引入配置组件config时，报错说 [vite] Internal server error: Failed to resolve import "@/src/config/index" from "src/api/request.js". Does the file exist?但在许多前端项目中，它通常被配置为一个别名（alias），指向项目中的某个特定目录，比如。我又查了一下用./和@/来引入文件的区别，以及用@引入文件报错用./引入文件却可以，为什么会这样。当你在一个文件中使用。
failed to locate @import file common/stylus/variable.styl
qq1722377628的博客
12-28 4501
这是在我给项目的common目录起了别名之后报的一个错， alias: { 'vue$': 'vue/dist/vue.esm.js', '@': resolve('src'), 'common': resolve('src/common') } 按理说起了别名之后直接用别名common就不应该出错，可是tmd还是报了一堆红 ...
Vue中”This dependency was not found”问题的解决方法
12-10
在Vue.js项目中，当我们使用`import`语句导入文件时，如果不以`./`或`../`开头，Webpack会尝试解析该路径为全局模块或者基于配置的`alias`别名。在这种情况下，`common`被误识别为一个别名，导致找不到对应的文件。...
Vite 3.x + Vue 3.x + TypeScript 4.x + Element Plus + Pinia 搭建项目
lhz_333的博客
08-17 1608
学习如逆水行舟，不进则退。
如何解决报错vue.runtime.esm.js:4605 [Vue warn]: Error in render: "TypeError: Cannot read properties of undefined (reading 'musicSize')" found in ---> <Anonymous> <App> at src/App.vue <Root>在<template> <div> <div class="flex"> <i class="iconfont icon-fanhuijiantou" @click="returntop"></i> <i class="iconfont icon-diandian"></i> </div> <div class="container"> <h5>{{ name }}</h5> <p>{{ alias }}</p> <p>{{ formatNumber(fansCnt) }}</p> <p class="hheight">{{ imageDesc }}</p> <div class="one"> <span>+ 关注</span> <i class="iconfont icon-xiangxiajiantou"></i> </div> </div> <van-tabs v-model="active" class="over"> <van-tab title="主页"> <homePage></homePage> </van-tab> <van-tab title="歌曲" :badge="singerdeatilList.artist.musicSize"> <songView :id="this.id"></songView> </van-tab> <van-tab title="专辑" :badge="singerdeatilList.artist.albumSize"> <album-view :id="this.id"></album-view> </van-tab> <van-tab title="视频" :badge="singerdeatilList.videoCount"> <videoView></videoView> </van-tab> </van-tabs> </div> </template> <script> import { singerDetailsApi, singerFansApi } from "@/api/singer"; import albumView from "@/views/singer/components/albumView.vue"; import homePage from "@/views/singer/components/homePage.vue"; import songView from "@/views/singer/components/songView.vue"; import videoView from "@/views/singer/components/videoView.vue"; export default { components: { albumView, homePage, songView, videoView, }, data() { return { active: 1, singerdeatilList: [], id: "", fansCnt: "", name: "", //歌手姓名 imageDesc: "", //歌手身份 alias: [], //歌手别名 musicSize: "", //音乐数量 albumSize: "", //专辑数量 }; }, methods: { returntop() { this.$router.push("/singerClass"); }, // fn(fans) { // if (fans > 10000) { // return (fans / 10000).toFixed(1) + "万粉丝"; // } // }, }, async created() { try { // 用query页面数据不会丢失 this.id = this.$route.query.id; let { data } = await singerDetailsApi(this.id); let fans = await singerFansApi(this.id); this.singerdeatilList = data.data; // 歌手名字 this.name = this.singerdeatilList.artist.name; // console.log(this.singerdeatilList.artist.name); // 粉丝数量 this.fansCnt = fans.data.data.fansCnt; // console.log(fans.data.data); // console.log(this.singerdeatilList); // 歌手身份 this.imageDesc = this.singerdeatilList.identify.imageDesc; // 歌手别名 this.alias = this.singerdeatilList.artist.alias[0]; } catch (err) { console.log(err); } }, };这段代码里
05-24
报错信息显示 `TypeError: Cannot read properties of undefined (reading 'musicSize')`，意味着在模板中使用 `singerdeatilList.artist.musicSize` 时，`...这样就可以避免因为数据还未返回而导致的报错问题。
vue3+el-tale封装（编辑、删除、查看详情按钮一起封装）
CallMe_CrabXie的博客
08-27 1879
对应的tableData和tableDataHeader文件（实际开发中，应该从后端拿tableData，tableHeader根据情况自定义）
Vue使用query传参Boolean类型，刷新之后转换为String问题
q879936814的博客
09-12 385
要解决这个问题，不能直接Boolean处理，因为如果传入false，那么转换成字符串，Boolean(‘false’)会变成true；做项目时发现第一次进入页面时传参是正常的Boolean类型，刷新之后变成了String，这是浏览器进行的一次强制转换；解决方法：使用JSON.parse处理参数。
Vue Router push方法的使用
最新发布
ithongchou的博客
09-13 703
是一个用于编程式导航的方法，它可以将用户导航到应用中的不同路由。它提供了灵活的路由控制能力，允许你在应用的逻辑中进行路由操作，例如在用户交互后进行页面跳转。
element-plus组件问题汇总
xiaoxian_xian的博客
09-12 392
element-plus组件问题汇总
Vue接入高德地图并实现基本的路线规划功能
黄团团的个人博客
09-11 527
找到public目录下的index.html文件，把刚才申请好的2个密钥分别粘贴进去，第一个securityJsCode是填入安全密钥，第二个红框是填入Key。登录高德开放平台，点击我的应用，先添加新应用，然后再添加Key。如图所示填写对应的信息，系统就会自动生成。
大文件切片上传-vue3.0
m0_56416159的博客
09-12 526
大文件切片上传（也称为分片上传）是一种处理大文件上传的有效方法，它通过将大文件分割成多个较小的部分（即切片或分片），然后分别上传这些切片到服务器，最后在服务器上将这些切片合并成原始文件。以下是关于大文件切片上传的详细步骤和注意事项。onUploadInit： 文件初始化调用接口，用于后端创建存放切片文件的文件夹。SparkMD5：生成文件唯一的hash，用来验证文件的完整性。onUploadFinish：文件上传完成验证完整性的接口。onUploadChunk：分片上传接口。基于vue3.0代码实现。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值