@giphy/js-components Compiling to Javascript about giphy-js HOT 9 CLOSED

@maltoze it's possible, just most people use a bundler and it hasn't been on our roadmap. I'd have to add a umd file to our package.json and then it looks like you'd be able to use https://unpkg.com/ to grab the code in a script tag

from giphy-js.

@colorgold you can use the TypeScript Compiler

It's how we compile most of the code in this repo.

You'll just do:

tsc index.ts

Then the rest of the configuration comes from the tsconfig.json. Here is our tsconfig.json

from giphy-js.

@colorgold you can use the TypeScript Compiler

It's how we compile most of the code in this repo.

You'll just do:

tsc index.ts

Then the rest of the configuration comes from the tsconfig.json. Here is our tsconfig.json

Thank you for your response and patience. In my html file, do I reference the index.ts script or index.js? I copied the tsconfig.json you provided me with but I'm still having problems. For now I will go read the documentation on TypeScript Compiler to learn how to use it. Thanks again for the information.

from giphy-js.

@colorgold no problem! you'd reference the index.js from you html script src.

from giphy-js.

@colorgold no problem! you'd reference the index.js from you html script src.

I installed the TypeScript compiler but now I get a different error. This is what my code looks like:

If I remove the 2nd line in chat.js, I then get this error:

I don't know what I am doing wrong. I have read that putting a dummy var exports and var require works, but as expected, it did not load GIFs.

from giphy-js.

Ah I may have mislead you about tsc, we use that for our repo, but that is for our libraries, not for a bundle you'd use in a web page.

Take a look at https://parceljs.org/

It should be easy to get the bundled file you need for use with a script tag.

from giphy-js.

Ah I may have mislead you about tsc, we use that for our repo, but that is for our libraries, not for a bundle you'd use in a web page.

Take a look at https://parceljs.org/

It should be easy to get the bundled file you need for use with a script tag.

Would I still need tsc or do I get rid of all the js files created? I will go ahead and use parcel and see what happens. Thank you!

from giphy-js.

Thank you for recommending me Parcel. I was using webpack before and was getting so confused. So, the problem that I was having was that I was using my own server since I am also working with Firebase hosting. Parcel created a directory named dist, but my server serves files under my public directory; every time I ran my web app I got errors because the browser did not have access to the dist directory. I was able to catch my mistake by creating a new project in Visual Studio Code. I ran the project in the server that Parcel gave me and voila, the Giphy carousel loaded successfully. Now all I have to do is organize my original project.

Thank you so much for helping me and guiding me to solve my problem.

from giphy-js.

Ah I may have mislead you about tsc, we use that for our repo, but that is for our libraries, not for a bundle you'd use in a web page.

Take a look at https://parceljs.org/

It should be easy to get the bundled file you need for use with a script tag.

Why doesn't provide a version that can be used directly in <script>?

from giphy-js.