Vue中的import中@的作用

308 阅读1分钟

本文已参与「新人创作礼」活动,一起开启掘金创作之路。

这是webpack的路径别名,相关代码定义在配置文件webpack.base.config里:

resolve: {
    // 自动补全的扩展名
    extensions: ['.js', '.vue', '.json'],
    // 默认路径代理
    // 例如 import Vue from 'vue',会自动到 'vue/dist/vue.common.js'中寻找
    alias: {
        '@': resolve('src'),
        '@config': resolve('config'),
        'vue$': 'vue/dist/vue.common.js'
    }
}

其中resolve()函数是文件里面自定义的函数:

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

我们也可以自定义路径:

alias: {
        '@': resolve('src'),
        '@config': resolve('config'),
        'vue$': 'vue/dist/vue.common.js''@components':path.join(__dirname, '..', 'src/components')//组件路径
    }

Reference

写在最后

欢迎大家关注鄙人的公众号【麦田里的守望者zhg】,让我们一起成长,谢谢。 微信公众号个人博客