Vue设置路径别名,设置跨域_vue跨域的名字怎么取-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_41927760/article/details/98941194

本文详细介绍了Webpack的配置方法，包括如何使用chainWebpack进行链式操作，设置路径别名以简化资源引用，以及devServer的代理配置，帮助开发者更好地理解和应用Webpack。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

/* 
  webpack的配置文件
    config   webpadck配置
    resolve  webpack解析
    alias    路径别名
*/

const path = require( 'path' )
module.exports = {
  chainWebpack: function ( config ) { //chainWebpack 链式操作 
    //config指的就是webpack配置      
    config.resolve.alias 
      // .set( 路径别名，绝对路径 )
      .set('assets', path.join(__dirname,'./src/assets'))
      .set('stylesheets', path.join(__dirname,'./src/assets/stylesheets'))
      .set('components', path.join(__dirname,'./src/components'))
      .set('layout', path.join(__dirname,'./src/components/layout'))
      .set('common', path.join(__dirname,'./src/components/common'))
      .set('lib', path.join(__dirname,'./src/lib'))
      .set('pages', path.join(__dirname,'./src/pages'))
      .set('router', path.join(__dirname,'./src/router'))
      .set('store', path.join(__dirname,'./src/store'))
      .set('utils', path.join(__dirname,'./src/utils'))

  },
  lintOnSave: true,// 表示关闭语法检测    eslint   jslint
  devServer: {
    proxy: {
      // 标识符： 配置项目       标识符选择域名后面的第一个              
      '/ajax': {
        target: 'http://m.maoyan.com',//目标源、
        changeOrigin: true,// 将上面的target修改为我们的 http://localhost:8080
      },
      '/index.php': {
        target: 'http://www.qinqin.net',
        changeOrigin: true
      }
    }
  }
}