vue3-webpack配置

2022-04-29  本文已影响0人  wyc0859

vue3如果要配置webpack相关的属性,就需要自己在项目根目录新建vue.config.js这个文件,然后写入需要的配置
webpack配置:文档地址

本文介绍下常用的配置
chainWebpack:通过链式编程的形式,来修改默认的webpack配置
configureWebpack:通过操作对象或函数的形式,来修改默认的webpack配置

对象形式

configureWebpack:{
       //插件
       plugins: [],
      //解析
       resolve: {
           // 别名配置
            alias: {
              'assets': '@/assets',
              'common': '@/common', 
             }, 
            fallback: {},
            
        }
    }

函数形式

configureWebpack:(config) => {
    if (process.env.NODE_ENV === 'production') { 
        config.mode = 'production'   // 为生产环境修改配置...
    } else { 
        config.mode = 'development'   // 为开发环境修改配置...
    }
    // 开发生产共同配置别名
    Object.assign(config.resolve, {
        alias: {
            '@': path.resolve(__dirname, './src'),
            'assets': path.resolve(__dirname, './src/assets') 
        }
    })
}
上一篇下一篇

猜你喜欢

热点阅读