Integrate with vue 3

This seems like a novice question and yet I don’t understand it. How do I import and use a third party js library in vue 3? In this case I’m trying to use Danfo.js https://danfo.jsdata.org/getting-started by doing npm install danfojs (even though it only shows to use cdn for browser use I think this is the same thing but correct me if wrong). Then idk if this is something that I import in each file I want to use or if I do it in main.js and it works globally automatically or what. I tried making main.js

import { createApp } from 'vue'
import App from './App.vue'

import danfo from 'danfojs';

const app = createApp(App)
app.use(danfo)
app.mount('#app')

and then idk if that’s correct but if so then how do I call dfd from inside the setup() of a component

function danfoTest(){
      console.log('idk', dfd)
      const json_data = [
        { A: 0.4612, B: 4.28283, C: -1.509, D: -1.1352 },
        { A: 0.5112, B: -0.22863, C: -3.39059, D: 1.1632 },
        { A: 0.6911, B: -0.82863, C: -1.5059, D: 2.1352 },
        { A: 0.4692, B: -1.28863, C: 4.5059, D: 4.1632 }]
                    
        const df = new dfd.DataFrame(json_data)
        console.log('here')
        df['A'].print()
    }

Idk if this is a lack of vue 3 understanding or lack of Danfo.js understanding but either way would appreciate some help, thanks!

Also is is possible can is only option? When adding the <script src="https://cdn.jsdelivr.net/npm/danfojs@0.1.2/dist/index.min.js"></script> tag to index.js it did work but I was getting errors in terminal about dfd not being defined although calling dfd did work. I assume because it loads the script later idk either way I think I want the npm install way and the npm install danfojs-node I believe is for a node version not the browser version which is why I did npm install danfojs

Also side question is this a long-term supported project with tensor or more of a side project

[MGCataldo]

Hi @leh08 I’m trying to integrate danfojs in a vuejs app and tried your solution, unfortunately without success.

I did install the client package npm install danfojs

and I’ve imported it in a vue component import * as dfd from "danfojs/danfojs/src/index" and I wrote a method to test it as follows: loadDFD(){ dfd.read_csv("https://web.stanford.edu/class/archive/cs/cs109/cs109.1166/stuff/titanic.csv") .then(df=>{ df.head().print() }) }

Anyway the system does not compile, it fails with the following error: ` ERROR Failed to compile with 1 errors 8:01:42 PM error in ./node_modules/danfojs/danfojs/src/index.js

Module parse failed: Unexpected token (17:9) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | export { Str } from “./core/strings”; | export { Utils } from “./core/utils”;

export * as tf from “@tensorflow/tfjs”; | | export const _version = “0.2.2”;

@ ./node_modules/cache-loader/dist/cjs.js??ref–12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref–0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/testFilterCSV.vue?vue&type=script&lang=js& 44:0-49 120:6-18 @ ./src/components/testFilterCSV.vue?vue&type=script&lang=js& @ ./src/components/testFilterCSV.vue @ ./src/router.js @ ./src/main.js @ multi (webpack)-dev-server/client?http://192.168.1.178:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js`

I’m running @vue/cli 4.5.9 npm 6.14.8

I was wondering …which is your environment?

[risenW]

https://danfo.jsdata.org/api-reference/general-functions/danfo.to_datetime

Ahh, I see we forgot to update the correct type in https://github.com/opensource9ja/danfojs/blob/dev/danfojs-browser/types/index.d.ts

Would you be interested in updating this and sending a PR? A great simple issue to start contribution.