广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >Vue FileManagerPlugin 报错问题及解决
  • 729
分享到

Vue FileManagerPlugin 报错问题及解决

摘要

目录Vue FileManagerPlugin 报错项目场景问题描述 原因分析解决方案Vue配置filemanager-webpack-plugin报错正确配置方式Vue

Vue FileManagerPlugin 报错

项目场景

vue build时想直接打包输出成zip

问题描述 

按照如下官方文档内写法, 提示出

Invalid actions object. FileManagerPlugin has been initialized using an actions object that does not match the api schema

const FileManagerPlugin = require('filemanager-WEBpack-plugin');
 
module.exports = {
  ...
  ...
  plugins: [
    new FileManagerPlugin({
      onEnd: {
        copy: [
          { source: '/path/from', destination: '/path/to' },
          { source: '/path*.js', destination: '/path' },
          { source: '/path/fromfile.txt', destination: '/path/tofile.txt' },
          { source: '/path*.{html,js}', destination: '/path/to' },
          { source: '/path/{file1,file2}.js', destination: '/path/to' },
          { source: '/path/file-[hash].js', destination: '/path/to' }
        ],
        move: [
          { source: '/path/from', destination: '/path/to' },
          { source: '/path/fromfile.txt', destination: '/path/tofile.txt' }
        ],
        delete: [
         '/path/to/file.txt',
         '/path/to/directory/'
        ],
        mkdir: [
         '/path/to/directory/',
         '/another/directory/'
        ],
        arcHive: [
          { source: '/path/from', destination: '/path/to.zip' },
          { source: '/path*.js', destination: '/path/to.zip' },
          { source: '/path/fromfile.txt', destination: '/path/to.zip' },
          { source: '/path/fromfile.txt', destination: '/path/to.zip', fORMat: 'tar' },
          { 
             source: '/path/fromfile.txt', 
             destination: '/path/to.tar.gz', 
             format: 'tar',
             options: {
               gzip: true,
               gzipOptions: {
                level: 1
               },
               globOptions: {
                nomount: true
               }
             }
           }
 
        ]
      }
    })
  ],
  ...
}

原因分析

直接去npm里去查文档, 看到了这个??!!

结构变了!

解决方案

好了既然知道问题,解决方案有两种

1.用老版本~

npm i filemanager-webpack-plugin@2.0.5

2.用新版本

具体如何使用参考文档~~

npm文档地址:https://www.npmjs.com/package/filemanager-webpack-plugin/v/3.1.0

Vue配置filemanager-webpack-plugin报错

安装包版本:"filemanager-webpack-plugin": "^7.0.0-beta.0",

正确配置方式

const FileManagerPlugin = require('filemanager-webpack-plugin') // 引入
const packageName = 'dist'
chainWebpack(config) {
     config.plugin('fileManager')
      .use(FileManagerPlugin).tap(args => [{
        events: {
          onEnd: {
            delete: [ // 首先需要删除项目根目录下的dist.zip
              `./${packageName}.zip`
            ],
            archive: [ // 选择文件夹将之打包成xxx.zip并放在根目录
              { source: `./${packageName}`, destination: `./${packageName}.zip` }
            ]
          }
        }
     }])
}

以上配置,可以解决以下问题

1.TypeError: config.plugins.push is not a function

2. ERROR  ValidationError: Invalid actions object. FileManagerPlugin has been initialized using an actions object that does not match the API schema.
 - actions has an unknown property 'onEnd'. These properties are valid:
   object { events?, runTasksInSeries?, context?, runOnceInWatchMode? }

以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。

--结束END--

本文标题: Vue FileManagerPlugin 报错问题及解决

本文链接: https://www.lsjlt.com/news/169378.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作