今天遇到一个问题,需要给vue-cli构建的项目添加 copy-webpack-plugin配置遇到了问题,在vue.config.js文件中设置语句如下:
module.exports = {
...
configureWebpack: {
plugins: [
new CopyWebpackPlugin({
patterns: [
{ from: './src/assets/images' , to: 'images' }
],
})
]
}
};
build编译时报错:
ERROR TypeError: compilation.getCache is not a function
TypeError: compilation.getCache is not a function
查了一圈发现可以用以下两种方法来解决这个问题
- 将copywebpack插件降级到5.1.0并使用旧的语法解决这个问题
configureWebpack: {
plugins: [
// 拷贝静态文件到目标文件
new CopyWebpackPlugin([
{ from: './src/assets/images' , to: 'images' }
])
]
}
- 升级web包并解决由其引起的其他语法更改
- 采用vue-cli内置的copy-webpack-plugin 后面找了一圈资料,发vue-cli内置了copy-webpack-plugin,可以使用以下语句:
chainWebpack: config =>{
config.plugin("copy").use(require('copy-webpack-plugin'), [{
patterns: [
{from: `./application/${componentName}/public`}
]
}])
}
会将内容自动拷贝到目标文件夹下。