🤐

WASMでZIP解凍できるlibarchivejsをNuxt2で使う

2022/11/23に公開

https://github.com/nika-begiashvili/libarchivejs

npm install libarchive.js

libarchive.js/distをpublicにする必要があるのでcopy-webpack-pluginでstaticディレクトリに持ってくる

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

nuxt.config.js

import path from 'path'
import CopyWebpackPlugin from 'copy-webpack-plugin'

nuxt.config.js buildセクションに追記

  build: {
    transpile: [
      'libarchive.js'
    ],
    extend(config, ctx) {
      config.plugins.push(
        new CopyWebpackPlugin([
          {
            from: 'node_modules/libarchive.js/dist',
            to: path.join(__dirname, 'static/plugins/libarchive.js/')
          }
        ])
      )
      return config
    }

あとはコンポーネントなどで使う

import {Archive} from 'libarchive.js';

Archive.init({
  workerUrl: '/plugins/libarchive.js/worker-bundle.js'
});

Discussion