filemanager-webpack-plugin:项目webpack打包后移动dist里的文件夹

某个vue项目打包后,有些静态资源的存放位置不太符合预期,导致访问这些资源的时候404。

希望改变打包后这些资源的存放位置,使其能够被正确访问。

一开始考虑的是copy-webpack-plugin - npm插件,但这个插件的本质是复制文件,虽然也能实现最终效果,但不符合程序员节能的思想,不想存在两份一模一样的文件,只想做移动操作。

最后,选用filemanager-webpack-plugin - npm

如下,

打包后为

- dist

  - index.html 

  - svg

  - cmdb

    - css

    - fonts

    - img

    - js

想将 svg 整个文件夹移动到 dist/cmdb里面去

vue.config.js修改如下

const FileManagerPlugin = require('filemanager-webpack-plugin')
module.exports = {
  // app部署路径
  publicPath: '/',
  // build目录
  outputDir: 'dist',
  assetsDir: SYSTEM_ID,
  configureWebpack: {
    output: {
      ......
    },
    plugins: [
      new FileManagerPlugin({
        events: {
          onEnd: {
            move: [
              { source: './dist/svg', destination: './dist/cmdb/svg' }
            ]
          }
        }
      })
    ]
  },
  ......
}

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值