webpack配置路径别名（Vue）

最新推荐文章于 2024-09-14 23:13:50 发布

小马_xiaoen

最新推荐文章于 2024-09-14 23:13:50 发布

阅读量955

点赞数 1

文章标签： vue.js webpack javascript

本文链接：https://blog.csdn.net/m0_46165586/article/details/130625657

版权

查看项目中是否存在vue.config.js文件，不存在就在根目录下面创建该文件

1、第一种

 configureWebpack: {
    resolve: {
      alias: {
        '@': path.resolve(__dirname, 'src'),
        components: '@/components'
      }
    }
  },

2、第二种

configureWebpack: (config) => {
    config.resolve.alias = {
      '@': path.resolve(__dirname, 'src'),
      components: '@/components'
    }
  }

2、第三种

configureWebpack: (config) => {
    config.resolve.alias = {
      '@': path.resolve(__dirname, 'src'),
      components: '@/components'
    }
  }

完整代码

const path = require('path')

const { defineConfig } = require('@vue/cli-service')

module.exports = defineConfig({
  transpileDependencies: true,
  // 配置别名
  configureWebpack: (config) => {
    config.resolve.alias = {
      '@': path.resolve(__dirname, 'src'),
      components: '@/components'
    }
  }
})