Could not load content for .ts files

[Dallin McLaughlin]

I've followed the instructions

• npm install function-plot
• import functionPlot from 'function-plot'
• add functionPlot({ ... })

However, I get this message continually for each of the .ts files.
Could not load content for http://localhost:5173/node_modules/function-plot/src/index.ts (HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE)

I'm using Vue 3 but cannot for the life of me get a single graph to pop up.

Also I get this error message.

   eval.ts:9 Uncaught ReferenceError: global is not defined
at node_modules/function-plot/dist/helpers/eval.js (eval.ts:9:1)
at __require (chunk-AC2VUBZ6.js?v=98c122ac:11:50)
at node_modules/function-plot/dist/tip.js (tip.ts:7:1)
at __require (chunk-AC2VUBZ6.js?v=98c122ac:11:50)
at node_modules/function-plot/dist/index.js (index.ts:14:1)
at __require (chunk-AC2VUBZ6.js?v=98c122ac:11:50)
at index.ts:771:16

I defined global in the vite.config.js file to get around this error but I'm unsure if I'm supposed to do that. The main issue is the .ts files.

Would love some help please! Your open source software looks amazing btw!

[Mauricio Poppe]

I tried using function-plot with 2 codesandbox templates:

• vue3: https://codesandbox.io/s/hopeful-wildflower-xrn9q6
• vue3 + typescript: https://codesandbox.io/s/serene-tu-uvi9t8

I'm not familiar with Vue so I can't advice what to do, global is not defined from the error so I'd look at the file generated by your bundler. Another option is to force to use the transpiled file instead of the TypeScript file, something like:

import functionPlot from 'function-plot/dist/index.js'

It's kind weird though because the example in the demo in the mainpage uses TypeScript too.

[Mauricio Poppe]

I think the code to detect if mathjs exists was not great, let me know if #227 fixed it, you could force using master by doing "function-plot": "*" in your package.json

[Dallin McLaughlin]

After some study I realised that since I was using vue3 it brought vite (https://vitejs.dev/) along with it. For some reason vite doesn't use polyfill modules and so that meant I couldn't access the global variable.

I came across this blog post https://medium.com/@ftaioli/using-node-js-builtin-modules-with-vite-6194737c2cd2 and read the comments for it. It suggested to change the vite.config file to add the needed polyfill modules. Now it works amazingly!

Thanks for the support!