不识别项目里的@别名路径

最新推荐文章于 2024-08-20 14:48:04 发布
最新推荐文章于 2024-08-20 14:48:04 发布
阅读量358 收藏 1
点赞数 1
分类专栏： 前端 vue 随笔 文章标签： webpack 前端 vue javascript vscode
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/oMoShiMoWang12345678/article/details/128656896
版权
前端 同时被 3 个专栏收录
4 篇文章 0 订阅
订阅专栏
vue
2 篇文章 0 订阅
订阅专栏
随笔
2 篇文章 0 订阅
订阅专栏

问题描述：在idea vscode或webstrom中，引用文件不识别路径！
提示系统找不到指定路径，Ctrl+鼠标左键点击不进去
在这里插入图片描述

前提条件：在webpack配置项中或者vite配置项中已经配置好了别名设置在这里插入图片描述

在项目根目录新建jsconfig.json文件

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
        "@/*": ["src/*"]
    }
  },
  "exclude": ["node_modules", "dist"]
}

jsconfig.json 的配置详细属性需要更多了解的请自行去研究一下！以上可以解决当前的idea不识别路径问题

夜静听风吹雨
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
解决WebStorm识别不到“@”符号路径问题
qq_43731674的博客
07-01 2909
步骤一 在项目根目录新建文件夹（webstorm.config.js）并加入以下内容 'use strict' const webpackConfig = require('@vue/cli-service/webpack.config.js') module.exports = webpackConfig 如果以上方法不生效可以尝试步骤二 步骤二 在项目根目录新建文件夹（jsconfig.json）并加入以下内容 { "compilerOptions": { "target": "es6
IDEA中vue项目@路径不能跳转到对应资源
mynameisjinxiaokai的博客
09-11 4629
vue项目在IDEA中打开，有的时候会遇到一些问题，比如： 这个问题的解决方法如下： 1.在vue项目的根目录创建一个js文件，比如：alias.config.js 2.在js文件中添加如下内容 'use script' const path = require('path'); function resolve(dir) { return path.join(__dirname, dir); } module.exports = { resolve: { alias: {
IDEA下 vue程序无法识别 ’@/‘
tuoyanghetang的博客
07-31 668
在项目的根目录下新建 jsconfig.json 并添加以下内容： { "compilerOptions": { "baseUrl": "./", "paths": { "@/*": ["src/*"] } }, "exclude": ["node_modules", "dist"] }
idea 开发vue项目，输入@符号没有路径提示问题
m0_37715184的博客
01-07 1408
在vue文件中要引入另一个组件时输入@符号，然后并没有提示文件路径，解决方法可参考一下（亲自试过，值得信赖）： https://blog.csdn.net/qq_34707272/article/details/105730090
uni-app项目:微信小程序报[ app.json 文件内容错误] 是因为路径微信小程序识别不出来下面是解决办法
weixin_46546201的博客
09-01 2344
这样就可以让微信小程序访问到mp-weixin小程序下的文件了
idea 无法解析目录@/xxx
sinat_37012541的博客
03-29 656
无法解析目录@/xxx/
解决webpack打包后根目录下有子文件夹的路径不匹配
米兰小铁匠的博客
06-22 2687
问题描述：项目打包后发布上线，不是放在服务器的根目录下，而是放在根目录的子文件夹下，这个时候项目的html中有手动引入的link/script的src和href文件。打包后对于这些文件不能正确的拼接子文件夹为路径 解决办法： 1、如果项目是采用的vue-cli3的webpack打包的 在vue.config.js中增加publicPath配置项，这个publicPath配置项中写入我要拼接的子文件...
Vue CL3 配置路径别名详解
10-16
它极大地简化了项目的构建过程，包括配置路径别名。路径别名是一种在项目中为常用目录设置快捷方式的方法，使得开发者无需关心文件的确切层级结构，从而提高代码的可读性和维护性。在 Vue CLI 3 中，配置路径别名...
vscode中Vue别名路径提示的实现
11-19
在项目 package.json 所在同级目录下创建文件 jsconfig.json， 来解决别名路径不提示的问题。（配置完保存文件后需要重启编辑器才能生效。而且它只能识别 .vue 和 .js结尾的文件，css文件与其他的静态文件依然没有...
vue.config.js中配置Vue的路径别名的方法
10-15
在Vue.js开发中，路径别名是一个非常实用的功能，它允许开发者为项目中的常用路径创建简短的别名，从而提高代码的可读性和可维护性。Vue CLI提供了一个名为`vue.config.js`的配置文件，允许我们自定义项目的构建设置...
vue-cli 为项目设置别名的方法
10-16
在这里，`resolve`函数用于返回基于项目根目录(`__dirname`)的绝对路径，`chainWebpack`用于链式修改webpack的配置，`set('@@', resolve('src/components'))`则是设置别名`@@`指向`src/components`目录。 ### 注意...
解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题
10-16
当在Idea或WebStorm中遇到Webpack别名不被识别的情况，通常是由于IDE没有正确地解析和应用项目的Webpack配置。以下是一种常见的解决步骤： 1. 打开IDE（无论是IntelliJ IDEA还是WebStorm）。 2. 转到`File`菜单，...
import文件时 ~/ 不识别问题（react）
weixin_30407613的博客
01-11 730
在最近写的react的项目中，在webpack中配置的“~”可以定位到根路径，但是知道在同事在windows中跑程序时，发现怎么都不识别这个路径，所有相关文件都could not find module。 发现问题是，项目是将整个目录，从D盘开始，一直到start.js，整个目录路径作为启动文件，整个路径中如果有中文就会不识别，所有建议以后开发时不能起中文的文件目录。 转载于:https://w...
vue基础-src路径问题
weixin_41357609的博客
03-18 977
基于webpack 的vue-cli项目基本 ：@==> 代表了src目录 通过： 1、http://localhost:8080/src 是找不到 vue项目的src目录 2、通过url访问是可以访问到public目录的 template 写的路径，可以直接找到对应的文件 定义数据的路由，只需要在public中放入文件
idea 打开vue 不能识别@路径
lmj3732018的博客
02-23 2746
第一步： 再根目录自定义一个文件，如webpath.config.js,内容为： 'use script' const path = require('path'); function resolve(dir) { return path.join(__dirname, dir); } module.exports = { resolve: { alias: { '@': resolve('src') } } };
WebStorm不识别‘@‘路径别名解决方法
做点有意思的事情
01-16 1521
WebStorm不识别'@'路径别名解决方法
解决IDEA下vue项目无法识别@符号的问题
qq_44443306的博客
10-20 4622
解决方法:ctrl+alt+s,在打开的窗口中搜索webpack,设置为Manualiy,选择文件为项目中的build/webpack.base.conf.js文件,点击apply应用即可
在项目中运用os 模块获取本机ip地址并运用到终端启动成功打开network
最新发布
m0_65360496的博客
08-20 229
在项目中运用os 模块获取本机ip地址并运用到终端启动成功打开network
vue2 webpack@别名识别不了
06-08
你可以尝试在`webpack.config.js`中的`resolve`字段下添加一个别名(alias)，例如： ``` resolve: { alias: { '@': path.resolve(__dirname, 'src') } } ``` 然后在你的vue文件中使用`@`代替`src`路径即可，例如： ``` import HelloWorld from '@/components/HelloWorld.vue'; ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值