vue 中import 不同层级目录下的文件的表示方式

发布时间:2024年01月11日

项目场景:

项目背景:

vue 项目中开发页面 需要 用到其它目录下的 文件,需要使用 import 进行导入


问题描述

问题:

  import util from '@/libs/util.js'
  import drawer from '../drawer/drawer'
  import mixinViewModule from '@/mixins/view-module'

解决方案:

解决方案:

一、 import 同一目录下的文件
import MyComponent from ‘./MyComponent.vue’;

二、import 上一级目录文件的方法

vue 中import 上两级的文件
在Vue中导入上两级的文件可以使用相对路径来指定。

如果要导入位于当前目录下的上两级文件,可以使用…/…/作为相对路径。示例代码如下所示:

// 导入上两级的文件
import File from ‘…/…/File.js’;
其中,File.js表示需要导入的文件名称。根据实际情况修改文件名称及后缀。

目录 三种不同的表示方式:

第一种表示方式 / :相当于返回到项目根目录,返回到了整个项目的最根部。引入文件就比较繁琐。不过也是可以实现的。

第二种 ./ :这是导入同级目录下的文件。

第三种 …/ :这是导入上一级目录里的文件。

所以 上一级的上一级里面的文件,所有只需要重复两次就行 …/…/

文章来源:https://blog.csdn.net/YHLSunshine/article/details/135535215
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。