已知shops
目录下有一个index.vue
文件,按住ctrl+
鼠标点击路径进行跳转,如何实现不写index.vue
也能进行跳转呢?
// 跳转失败(期望这样也能跳转成功)
import Shops from './shops';
// 跳转成功
import Shops from './shops/index.vue';
已知shops
目录下有一个index.vue
文件,按住ctrl+
鼠标点击路径进行跳转,如何实现不写index.vue
也能进行跳转呢?
// 跳转失败(期望这样也能跳转成功)
import Shops from './shops';
// 跳转成功
import Shops from './shops/index.vue';
这个问题涉及到Vue.js中的模块导入和路径跳转。在Vue.js中,当你尝试导入一个模块时,你需要提供正确的路径。
对于你的问题,你希望在按住 ctrl+
鼠标点击路径进行跳转时,能够直接跳转到 shops
目录下的 index.vue
文件,而不必在路径中写明 index.vue
。
在Vue.js中,你可以使用相对路径或绝对路径来导入模块。在你的例子中,你使用了相对路径 './shops'
来导入 Shops
模块。相对路径是相对于当前文件的路径。
如果你要在不写 index.vue
的情况下进行跳转,你可以考虑以下两种方法:
Shops
模块,例如:import Shops from '/path/to/shops/index.vue';
使用绝对路径可以确保你总是能够正确地导入 Shops
模块,而不必担心当前文件的位置。
vue.config.js
文件中设置以下别名:module.exports = {
// ...
resolve: {
alias: {
Shops: '/path/to/shops/index.vue'
}
}
}
然后,你可以使用以下方式来导入 Shops
模块:
import Shops from 'Shops';
使用别名可以让你的代码更简洁,并且不必担心文件路径的变化。
请注意,以上方法适用于在编辑器中使用路径进行跳转的情况。如果你是在浏览器中跳转,可能需要其他的方法或配置来实现。
import Shops from './shops'
你这样引用组件会失败的。
导入文件夹使用时,程序会先寻找入口文件index.js
或index.ts
,在里面导入index.vue并默认导出才能以导入文件夹
的方式使用组件。
--shops
|--index.js
|--index.vue
// index.js
import Shops from './index.vue'
export default Shops
6 回答3k 阅读✓ 已解决
8 回答4.8k 阅读✓ 已解决
6 回答3.5k 阅读✓ 已解决
5 回答2.9k 阅读✓ 已解决
6 回答2.4k 阅读
5 回答6.4k 阅读✓ 已解决
4 回答2.3k 阅读✓ 已解决
你可以通过配置jsconfig.js去跳转,可通过vuejs生成模版的jsconfig.js