🚀 Native JSON Imports in JavaScript Are Here (2025 Guide with Examples)

Did you know you can now import .json files natively in modern JavaScript without fetch(), bundlers, or dynamic hacks?

Yes, it’s officially supported in all modern browsers and Node.js (v20.6+), and it looks like this:

js
import config from './config.json' assert { type: 'json' };
console.log(config.theme);

That’s it. No more boilerplate. 🙌

✅ Works In:
Chrome, Firefox, Safari, Edge (2024+)

Node.js v20.6+
You just need to set "type": "module" in your package.json

🧠 Why This Is a Game-Changer
Instead of doing:

fetch('/config.json')
  .then(res => res.json())
  .then(data => console.log(data));

You now just:

import config from './config.json' assert { type: 'json' };
Cleaner syntax. Synchronous. Built-in support.

It’s perfect for:

App configs

Locale files

Static content for blogs and docs

DevOps dashboards

Theme/data presets

`

🧪 Common Pitfalls & Fixes

❌ Error	✅ Fix
Cannot find module	Check your file path and extension
Unexpected token	Make sure the JSON is valid (Use Formatter)
Module parse failed	Add assert { type: 'json' } to your import
CORS error	Enable CORS or load JSON from the same origin

`

🛠️ Bonus Tool – Format & Validate Your JSON First
If your JSON file has even one trailing comma, this import will fail.

Before importing, I use this free tool I built to format, validate, and preview JSON quickly:

👉 https://jsonformatter.online

It also supports:

1. JSON to CSV, YAML, XML, Markdown
2. Download as Excel (XLSX)
3. A full JSON Log Viewer for NDJSON & streaming
4. Upload or fetch JSON from a URL

Give it a try and let me know what features you’d love to see!

🔗 Read the Full Guide Here
I wrote a full breakdown of how to use native JSON imports, what’s supported, how to structure projects, and common gotchas here:

👉 How to Use Native JSON Imports in JavaScript (2025 Update)

Comments

[Jon Randy 🎖️]

This is incorrect. assert should not be used as it has been deprecated in favour of the with syntax which enjoys wide support across modern browsers (which assert does not, as you incorrectly state it does):

import data from "https://example.com/data.json" with { type: "json" };

caniuse.com/mdn-javascript_stateme...
developer.mozilla.org/en-US/docs/W...

[Andy]

oh! good catch :)