idea开发vue项目通过@跳转

vue引入组件通常是这样子的

  import aaa from '@/aaa/ggg/aaa'

但是使用idea开发,按住ctrl点击路径无法跳转

可以这样子,建一个js文件,建议放在根目录下,跟package.json同级否则无法获得正确路径,名字随便起,我这个文件叫做alais.config.js,文件内容是这样的:

/* 此文件未使用,只是为了让idea可以识别实际位置 */
const path = require('path');

function resolve(dir) {
  return path.join(__dirname, dir);
}

module.exports = {
  resolve: {
    alias: {
      '@': resolve('src')
    }
  }
};

然后在idea的settings中配置一下这个文件。

在这里插入图片描述
搜索webpack关键词,在Languages & Frameworks这一栏下面有个webpack,具体路径在File | Settings | Languages & Frameworks | JavaScript | Webpack

然后选择webpack的配置文件为我们刚才新建的那个文件。

ok,大功告成,按住ctrl点击路径可以跳转,按住ctrl点击组件的标签也可以跳转。

  • 5
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
开发 Vue 项目的实战是一个非常有趣和有挑战性的过程。以下是一个基本的 Vue 项目实战的思路: 1. 确定项目需求:开始之前,明确你的项目需求是非常重要的。你需要思考你的项目要解决什么问题,它的目标用户是谁,它需要具备哪些功能等等。 2. 创建项目结构:使用 Vue CLI (Command Line Interface) 可以快速创建一个基本的 Vue 项目结构。通过命令行工具运行 `vue create` 命令,按照提示选择相关配置选项,然后等待项目创建完成。 3. 设计页面布局:根据你的项目需求,设计出合适的页面布局。可以使用 Vue 的单文件组件 (Single File Components) 来划分页面的不同部分。 4. 开发组件:将页面拆分为多个可复用的组件,并使用 Vue 的数据绑定和事件处理功能来实现交互逻辑。可以使用 Vue Router 来管理页面路由,Vuex 来管理状态。 5. 集成第三方库:根据需要,考虑将一些常用的第三方库集成到你的项目中,例如 Axios 进行网络请求,Element UI 进行界面组件设计,等等。 6. 添加样式和动画:使用 CSS 或者预处理器 (如 Sass 或 Less) 来为你的项目添加样式,并使用 Vue 的过渡动画系统来实现页面过渡效果。 7. 进行测试和调试:使用 Vue CLI 提供的测试工具来写单元测试和集成测试,确保你的项目在各种情况下都能正常运行。 8. 打包和部署:使用 Vue CLI 提供的打包工具将项目打包成静态文件,并将其部署到你选择的服务器或者云平台上。 以上是一个基本的开发 Vue 项目的实战思路,具体的实施方法会根据你的项目需求和个人偏好有所不同。祝你开发顺利!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值