美文网首页
vue3-webpack配置

vue3-webpack配置

作者: wyc0859 | 来源:发表于2022-04-29 21:15 被阅读0次

    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') 
            }
        })
    }
    

    相关文章

      网友评论

          本文标题:vue3-webpack配置

          本文链接:https://www.haomeiwen.com/subject/fvmsyrtx.html