Sign up for our live Camera Kit office hour on July 17 @ 9:30am (PT) / 4:30pm (GMT)

Trying to get the Web SDK imported and getting an error

Kevando
Kevando Posts: 76 🔥🔥

I installed the sdk

npm install @snap/camera-kit

but I get an error trying to run the first line of code in the README. I have a file called snap.js with 1 line of code:

import { boostrapCameraKit } from "@snap/camera-kit";

and I run node snap.js

I get this error:

snap.js:1
import { boostrapCameraKit } from "@snap/camera-kit";
         ^^^^^^^^^^^^^^^^^
SyntaxError: Named export 'boostrapCameraKit' not found. The requested module '@snap/camera-kit' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from '@snap/camera-kit';
const { boostrapCameraKit } = pkg;

Answers

  • Kevando
    Kevando Posts: 76 🔥🔥

    oh and I changed my package.json to be type=module. I only know enough about the two types to defeat the errors, but I did see in the docs that the camera kit sdk is module only not commonJS so the error being that camera kit IS commonJS makes me think something outside of your control is the problem but maybe you can help. im gonna reinstall node now

  • Kevando
    Kevando Posts: 76 🔥🔥

    ok i found this repo that implements camera-kit using react and got it working. not sure if i wanna use react, so im gonna try to reverse engineer its settings and see if i can figure out the problem. i will reply if i find a solution

  • stevenxu
    stevenxu Posts: 612 👻

    @Kevando Thanks for sharing your field notes! Created a ticket just for our eng to have vis and they can step in for any addtl comments that might be helpful. (4772)

  • Michael Mase
    Michael Mase Posts: 66 🔥🔥

    Hi @Kevando! It looks like you're trying to use the Camera Kit Web SDK in a Node.js environment. Unfortunately, this is not supported at this time. You should have success in a browser environment like the React project you mentioned. If you have any additional questions, feel free to reach out!

  • Kevando
    Kevando Posts: 76 🔥🔥

    @Michael Mase that's actually great news 😅 my preferred environment is jekyll. so dumb question for someone using js way too long, how do i use an import statement on a non nodejs environment. i think that's where im lost

  • Michael Mase
    Michael Mase Posts: 66 🔥🔥

    @Kevando, we are most commonly seeing Camera Kit Web SDK in a React application. The Create React App library is the fastest way to get set up with React. Additionally, you may consider using Parcel for simpler application development.

  • Kevando
    Kevando Posts: 76 🔥🔥

    so how do I use camera kit with just javascript? i must be a noob here because im trying to import the library from node_modules which feels weird cause i dont think i ever deployed a node_modules folder to a public dir. and its still not working. getting this error:

    Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

    any ideas?

  • Where is the React repo?