How to create a csv file with vue.js

Question

I want to create a csv file with the plugin 'csv-writer' in a vuejs file. I took the example code of the plugin and made it works with .js file.

Now, I want to adapt the code so that it works in my vue.js file the thing is that I don't get what's the equivalent of

const createCsvWriter = require('csv-writer').createObjectCsvWriter;

here is the example :

const createCsvWriter = require('csv-writer').createObjectCsvWriter;
const csvWriter = createCsvWriter({
    path: 'file.csv',
    header: [
        {id: 'name', title: 'NAME'},
        {id: 'lang', title: 'LANGUAGE'}
    ]
});
 
const records = [
    {name: 'Bob',  lang: 'French, English'},
    {name: 'Mary', lang: 'English'}
];
 
csvWriter.writeRecords(records)       // returns a promise
    .then(() => {
        console.log('...Done');
    });

What I tried in my vue.js file :

<template>
    <div>
      <v-btn text @click.prevent="exportData()">
            Export CSV
        </v-btn>
   </div>
</template>


<script>

import createCsvWriter from 'csv-writer'

    export default {
        data () {
            return {
                csvWriter : createCsvWriter({
                     path: 'file.csv',
                        header: [
                            {id: 'name', title: 'NAME'},
                            {id: 'lang', title: 'LANGUAGE'}
                      ]  
                }),
                records : [
                    {name: 'Bob',  lang: 'French, English'},
                    {name: 'Mary', lang: 'English'}
                ],
            }
        },
        methods: {
            
            async exportData(){
                this.csvWriter.writeRecords(this.records);      // returns a promise
                console.log('...Done');
               
               },
        }
    }
</script>

Answer 1

I chose a vue plugin named vue-json-to-csv to achieve it =)