Gotrue-js throws error when importing

Support
1

site name: Homepage2
Git Repo: Fort-P/Homepage2 (github.com)

I am looking to add a user system to my site, however I want to be able to customize the look of it, rather than just using the base netlify-identity-widget. I read that gotrue-js was the correct thing to use. however when I import it with the code in the github repository, then it throws a type error:
solve module specifier "gotrue-js". Relative references must start with either "/", "./", or "../".
attempting to follow what it recommends and replacing the import statement with import GoTrue from './../node_modules/gotrue-js/index.d.ts'; gives me the error:
pected a JavaScript module script but the server responded with a MIME type of "video/vnd.dlna.mpeg-tts". Strict MIME type checking is enforced for module scripts per HTML spec. In a dev localhost environment, and just a 404 not found error when it is deployed to the actual site.

So what exactly am I doing wrong here and what do I need to do to fix the issue?
Thanks in advance,
Fort

2

It’s one way, not the only way. Netlify Identity basically uses simple APIs, so you can technically use it without any library. As example being: Examples of Netlify Identity w/o the widget

Anyways, your code has several issues, which is why this is not working. Firstly, you should never commit node_modules to your git repo. Then, instead of importing the file from relative references to node_modules, you should instead use import GoTrue from 'gotrue-js'. Finally, to actually make that JavaScript usable in browser, you need to add a JavaScript bundler like esbuild to resolve, import and bundle the dependencies in a script that the browsers can run.

3

Sounds good! I will look into that! never knew not to include node-modules, I assume just blacklisting it in .git-ignore will work?

Thanks Again,
Fort

4

I believe you’d first have to delete it from the repo, commit and push the changes and then add it to .gitignore.

1 Like