Making a gitignore file for Javascript and Typescript

Published

Table of Contents

What’s a gitignore file?

A .gitignore file lets us specify files and directories that git (usually github or gitlab) shouldn’t be tracking. These settings will be shared with everyone using the repository, making sure everyone’s on the same page.

Why is it important?

In practice you’ll most often be using a gitignore to prevent github from tracking sensitive files like dotenv and environment variables files, your build output and your node_module folder as well as all the files it contains. This can also apply if you’re using files that are on the heavier size, which usually happens if you do any sort of game development.

What happens if you don’t? Let’s say you forgot to prevent tracking of your .env file. An .env file is usually where you’ll keep API keys and as such, you’ve now put your API keys on github. Depending on your organization and privacy settings, this can quickly become a huge deal, especially if you’ve given out your AWS keys.

An example gitignore file for Javascript

Here’s an example template gitignore you can use for your Javascript and typescript project with some explanation. Don’t forget to match your actual settings and preferences!

# macOS settings file 
.DS_Store

# Contains all your dependencies
node_modules

# Replace as required with your build location
/build

# Deal with environment files
.env
.env.*

# We'll allow an example .env file which can be copied
!.env.example

# Coverage directory used by testing tools
coverage

# Visual Studio Code configuration
.vscode/


# npm and yarn debug logs
npm-debug.log*
yarn-debug.log*
yarn-error.log*

# next.js
.next

# sveltekit
/.svelte-kit
vite.config.js.timestamp-*
vite.config.ts.timestamp-*
#github#tooling