vue3引入 path
时间: 2023-10-19 17:05:49 浏览: 42
在 Vue3 中,引入路径可以使用以下方式:
1. 使用相对路径
如果你的组件和引入的文件在同一个目录下,可以直接使用相对路径引入:
```javascript
import MyComponent from './MyComponent.vue'
```
如果在同一目录的子目录下,可以使用相对路径和目录名引入:
```javascript
import MyComponent from './components/MyComponent.vue'
```
2. 使用别名
在 Vue3 中,可以通过 `webpack` 配置文件中的 `resolve.alias` 属性,给常用的路径设置别名,方便引入:
```javascript
// webpack.config.js
module.exports = {
// ...
resolve: {
alias: {
'@': path.resolve(__dirname, 'src'), // 设置 @ 为 src 目录的绝对路径
'components': path.resolve(__dirname, 'src/components') // 设置 components 为 src/components 目录的绝对路径
}
}
}
```
然后在组件中就可以使用别名引入:
```javascript
import MyComponent from '@/MyComponent.vue'
import MySubComponent from 'components/MySubComponent.vue'
```