kazoottt-blog-v2/src/content/note/__dirname is not defined in ES module scope.md

title, date, author, type, status, tags, finished, published, category, slug, NotionID-notionnext, link-notionnext, rinId, description, toAstro, date_created, date_modified

title	date	author	type	status	tags	finished	published	category	slug	NotionID-notionnext	link-notionnext	rinId	description	toAstro	date_created	date_modified
__dirname is not defined in ES module scope	2024-05-29T00:00:00.000Z	KazooTTT	Post	Published	nodejs 前端 esm module	true	true	前端	dirname-is-not-defined-in-es-module-scope	543bfc66-a416-4704-92be-9a93fed191a8	https://kazoottt.notion.site/__dirname-is-not-defined-in-ES-module-scope-543bfc66a416470492be9a93fed191a8	14	# ES Module 问题：__dirname 不定义 在使用 TypeScript创建的ESM文件中，遇到__dirname不定义的问题通常是因为使用了module的语法，应该改为ESM的写法。两种解决方法分别是改为module的写法和改为ESM的写法。 ## 改为module的写法 在这种方法中需要把import改为require，将后缀从ts改为cts。 但这种方式并不推荐，因为它可能会导致文件相对路径的问题。 ## 改为ESM的写法 可以通过利用import.meta.url和fileURLToPath函数，获取当前模块的目录路径来解决__dirname不定义的问题。 ```typescript import { fileURLToPath } from "url" import path from "path" // 获取当前模块的目录路径 const __filename = fileURLToPath(import.meta.url) const __dirname = path.dirname(__filename) ``` 这种方法推荐使用，避免了相对路径的问题。	true	2025-01-04T03:44:53.000Z	2025-02-07T03:25:34.000Z

__dirname Is not Defined in ES Module Scope

在 package.json 中的 type = module 的项目中，我创建了一个 ts 文件，类型是 esm 的类型。

这里的报错是因为我们错误的使用了 module 的语法到 esm 的文件中，要解决这个问题的方法有两种，第一种改为 module，另一种是改为 esm 的写法。

首先是第一种改为 module 的写法，那就是把 import 改为 require，然后由于我们这里是 module 的项目，所以需要修改一下 ts 文件的后缀 ts 改为 cts。

一个供参考的例子：GitHub - shawnsparks/typescript-esm: Explore different usage patterns of ES modules with Typescript

然后是第二种，文件、路径相关的改为 esm 的写法。

import { fileURLToPath } from "url"
import path from "path"

// 获取当前模块的目录路径
const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(__filename)