webpack4-生产环境打包静态资源

静态资源一般放在根目录下的 static 文件夹下,先创建该文件夹,随便放个什么文件进去,以方便之后打包,这个只需要在生产环境需要用到,所以修改webpack.prod.conf.js 文件:

// 在头部引用中添加以下代码
const copyWebpackPlugin = require('copy-webpack-plugin');

// 在 plugin 中 添加以下代码
new copyWebpackPlugin([{
    from:path.resolve(__dirname+'/static'),// 打包的静态资源目录地址
    to:'static' // 打包到dist下面的static
}]),

当然该插件也可以同时打包多个静态资源文件夹,也就是要多加几条from``to数据,本项目根目录下还有README静态资源文件夹,也希望打包进生产环境:

new copyWebpackPlugin([
    {
        from:path.resolve(__dirname+'/static'),// 打包的静态资源目录地址
        to:'./static' // 打包到dist下面的static
    },
    {
        from:path.resolve(__dirname+'/README'),// 打包的静态资源目录地址
        to:'./README' // 打包到dist下面的README
    },
]),