Vue + exceljsでテンプレートエクセルに追加処理ができない。

実現したいこと

基本的なことなのですが、すでにあるtest.xlsxに文字を追記して保存したい

該当のソースコード

html,javascript,Vue

1<template>2 <div>3 <h2>ExcelJS and Vue.js Example</h2>4 <button @click="writeToExcel">Write to Excel</button>5 </div>6</template>7 8<script>9import ExcelJS from 'exceljs';10export default {11 methods: {12 async writeToExcel() {13 try {14 // Create a new workbook15 const workbook = new ExcelJS.Workbook();16 17 // Load the existing workbook from the template.xlsx file18 await workbook.xlsx.readFile('../template/test.xlsx');19 20 // Get the first worksheet21 const sheet = workbook.worksheets[0];22 23 // Write "test" to cell A224 sheet.getCell('A2').value = 'test';25 26 // Save the modified workbook27 await workbook.xlsx.writeFile('output.xlsx');28 29 console.log('Data written to Excel successfully.');30 } catch (error) {31 console.error('Error writing to Excel:', error);32 }33 },34 },35};36</script>37

試したこと

どうしたらよいかわかっておらず、試せておりません。
以下のエラーとなり、エクセルを開くことがそもそもできていない状況です。

log

1HelloWorld.vue:31 Error writing to Excel: TypeError: Cannot read properties of undefined (reading 'F_OK')

補足情報（FW/ツールのバージョンなど）

"vue": "^2.6.11" "exceljs": "^4.4.0",

構造 　src - components ┗　HelloWorld.vue -template 　　　　　┗　test.xlsx 　　

お世話おかけしますがよろしくお願いいたします。