Anoesj Sadraee Anoesj

How to sort imports like a pro in TypeScript

Crossing reviews becomes a very common activity today in engineering behavior. To help us review changes for pull/merge requests easier, sorting imports can help us a much. The codebase becomes more professional and more consistent, reviewers will be happier, and the review process will be faster, focusing on the implementation changes ONLY.

Have you ever thought about how to sort imports in TypeScript projects automatically?

Let me show you how to archive sorting imports automatically in TypeScript projects with ESLint!

Read this first!

Hi there! Since this post was originally written, nvm has gained some new tools, and some people have suggested alternative (and potentially better) approaches for modern systems. Make sure to have a look at the comments to this article, before following this guide!

The original article

Trickier than it seems.

	// ~/server/api/sse.ts
	export default defineEventHandler(async (event) => {
	if (!process.dev) return { disabled: true }

	// Enable SSE endpoint
	setHeader(event, 'cache-control', 'no-cache')
	setHeader(event, 'connection', 'keep-alive')
	setHeader(event, 'content-type', 'text/event-stream')
	setResponseStatus(event, 200)

	<!DOCTYPE html>
	<html>
	<head>
	<base href="app://./" />
	<meta http-equiv="Content-Security-Policy" content="script-src 'self' app:; object-src 'self' app:;">
	<script type="module" src="./module.js"></script>
	</head>

	<body>
	Check the console!