Installing with Babel

Learn how to install imaginary-dev into a project that uses Babel.

For projects that use the Babel compiler, install the imaginary-dev Babel compiler plugin and change your Babel config so that the plugin is used.

Installing the dependencies

First, install the necessary dependencies to your project:

npm install @imaginary-dev/runtime
npm install --save-dev @imaginary-dev/babel-transformer

Adding `imaginary-dev` to your Babel configuration

Second, add "@imaginary-dev/babel-plugin-transformer-prompt-js" to the plugins array in your Babel configuration. Your Babel configuration is likely in one of the following places:

A JSON file called babel.config.json, .babelrc.json, or .babelrc
Your project's package.json under a key named babel
A JavaScript file called babel.config.js or .babelrc.js
The CLI argument --plugins, if you are using the Babel command line interface
The second argument to transformSync if you have written code to invoke the Babel compiler.

For more information on Babel configuration, see the Babel documentation on the subject.

Adding your OpenAI API key

In order to use imaginary-dev, you also need to get an OpenAI API key and expose it to the imaginary-dev library. If you do not have an OpenAI account, go to www.openai.com and sign up. You can then go to the API keys page to create or copy one of your OpenAI API keys.

In order for imaginary-dev to work, your API key should be accessible as an environment variable called OPENAI_API_KEY.

Adding the OpenAI API key at the command line

For running locally on your developer machine you can pass environment variables at the command line, like:

OPENAI_API_KEY=sk-some-api-key node myfile.js

Using a .env file to add the OpenAI API key

If you'd rather not pass your API key at the command line, you can create a .env file that collects your environment variables and loads them up into your process using the dotenv library.

Do not check your .env file in

It is critical that you not check in your .env file to a source control system like git. If other people get access to your .env file from your git repo, they will have access to your OpenAI account and can run up your bill. The best practice is to add .env to your .gitignore file so that git never asks you to check it in.

Add .env on a new line of your .gitignore file to prevent yourself from accidentally checking in secrets to git. If you don't have a .gitignore file, create one and add .env to it.

Next, create a .env file in the directory from which you are running your app that looks something like:

OPENAI_API_KEY=sk-some-api-key

Then add dotenv to your project:

npm install dotenv

And finally add code to read your .env file at the entry point of your program:

import * as dotenv from 'dotenv'
dotenv.config()

If you are using a framework like Next.js, there is generally a system in place for adding secrets to a .env file, and when you deploy with a vendor like Vercel or Netlify, there is a way to set environment variables without adding to your git repo.

Next steps