美文网首页Webpackwebpack学习vue2+webpack
webpack4配置vue项目----11.public公共静态

webpack4配置vue项目----11.public公共静态

作者: 花拾superzay | 来源:发表于2019-11-21 11:52 被阅读0次

    这是一篇webpack4配置的系列文章,推荐从头开始看起
    1.初始化
    2.关于执行环境process.env.NODE_ENV
    3.设置mode和sourceMap
    4.加载css, scss文件,以及样式抽离
    5.加载图片等文件
    6.html-webpack-plugin插件
    7.单vue文件的加载,以及babel的使用
    8.配置devServer服务器,热更新,前端跨域代理
    9.设置目录别名
    10.css样式前缀自动补全
    11.public公共静态资源目录拷贝
    12.清理dist目录

    安装插件

    npm install --save-dev copy-webpack-plugin
    

    webpack.config.js添加如下配置

    const CopyWebpackPlugin = require('copy-webpack-plugin');
    
    module.exports = {
        plugins: [
            new CopyWebpackPlugin([{
                from: __dirname + '/public',
                to: __dirname + '/dist/public',
                ignore: ['.*']
            }])
        ],
    };
    

    参数说明

    from  定义要拷贝的源文件            from:__dirname+'/public'
    to      定义要拷贝到的目标文件夹  to: __dirname+'/dist/public'
    toType  file 或者 dir                        可选,默认是文件
    force   强制覆盖前面的文件            可选,默认是文件
    context                                            可选,默认base   context可用specific  context
    flatten  只拷贝指定的文件               可以用模糊匹配
    ignore  忽略拷贝指定的文件            可以模糊匹配
    

    相关文章

      网友评论

        本文标题:webpack4配置vue项目----11.public公共静态

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