how to import stripe.js in sapper app into my preload() or onMount()

Question

I have installed stripe.js using the following command : npm install stripe Now I would like to import it into my sapper component so I can use it but unable to figure out how to do that despite reading all the mdn page regarding import in js

Here is my code

<script>
import "stripe"
const stripe = Stripe("my key goes here")
stripe.charges.create({rest of the code to create a charge})
</script>

The stripe.js folder is in a the typical location (node_modules) folder in the root of my application.

So my question is: how to import it to my sapper script section and use it? I tried import * as stripe from "stripe" (got an error) I tried import "stripe" and import "/node_modules/stripe" & "./node_modules/stripe"

None of that worked. How to import it so I can use it as this: const stripe = Stripe("key") In Sapper particularly, should I add it to preloading function or on top of the component's script?

Thanks

Answer 1

According to the documentation of stripe js npm package you can import like this:

import Stripe from 'stripe';
const stripe = new Stripe('sk_test_...');

(async () => {
  const customer = await stripe.customers.create({
    email: 'customer@example.com',
  });

  console.log(customer.id);
})();