Skip to content

How to dynamically import JavaScript modules

Find out how to import a JavaScript module dynamically

Have you ever felt the need to load a JavaScript module dynamically?

Maybe you’re trying to load something from a folder but you don’t know the name of the folder, you generate it dynamically.

But doing something like

import test from folder + '/test.js'

or

import test from `${folder}/test.js`

does not work.

You need to do a dynamic import, in this way:

const test = await import(folder + '/test.js')

I wrote more about this relatively new feature of JavaScript in JavaScript Dynamic Imports.

→ Get my JavaScript Beginner's Handbook

I wrote 17 books to help you become a better developer, download them all at $0 cost by joining my newsletter

  • C Handbook
  • Command Line Handbook
  • CSS Handbook
  • Express Handbook
  • Git Cheat Sheet
  • Go Handbook
  • HTML Handbook
  • JS Handbook
  • Laravel Handbook
  • Next.js Handbook
  • Node.js Handbook
  • PHP Handbook
  • Python Handbook
  • React Handbook
  • SQL Handbook
  • Svelte Handbook
  • Swift Handbook

JOIN MY CODING BOOTCAMP, an amazing cohort course that will be a huge step up in your coding career - covering React, Next.js - next edition February 2025

Bootcamp 2025

Join the waiting list