Skip to content

Instantly share code, notes, and snippets.

@Jaid
Last active Jan 8, 2022
Embed
What would you like to do?
Migrate from CommonJS projects to ESM

lodash

From

const {pick} = require("lodash")

To

import {pick} from "lodash-es"

Dependency migration:

sed -i 's/"lodash":/"lodash-es":/g' package.json && npm install && npx git-flush-cli "Changed dependency lodash to lodash-es"

debug

From

const debug = require("debug")(process.env.REPLACE_PKG_NAME)

To

import createDebug from "debug"
const debug = createDebug(process.env.REPLACE_PKG_NAME)

__filename

From

const fileName = __filename

To

import {fileURLToPath} from "node:url"

const fileName = fileURLToPath(import.meta.url)

__dirname

From

const dirName = __dirname

To

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

const dirName = path.dirname(fileURLToPath(import.meta.url))

Read package.json

From

const pkg = require("./package.json")

To

Using fs-extra:

import fs from "fs-extra"

const pkg = await fs.readJson("./package.json")

Without external packages:

import fs from "node:fs/promises"

const pkgContent = await fs.readFile("./package.json", "utf8")
const pkg = JSON.parse(pkgContent)

Jest

From

import path from "path"

const indexModule = require(process.env.MAIN ? path.resolve(process.env.MAIN) : path.join(__dirname, "..", "src"))

/**
 * @type { import("../src") }
 */
const {default: myModule} = indexModule

To

import {expect, it} from "@jest/globals"

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

const dirName = path.dirname(fileURLToPath(import.meta.url))
const indexPath = process.env.MAIN ? path.resolve(dirName, "..", process.env.MAIN) : path.join(dirName, "..", "src")

/**
 * @type { import("../src") }
 */
const {default: myModule} = await import(indexPath)

fs-extra

Natively supported with v10. Progress here:
https://github.com/jprichardson/node-fs-extra/issues/746

From

🗎 test/test.js

import {mkdirp, writeFile, readJson} from "fs-extra"

To

🗎 test/test.js

import {mkdirp, writeFile, readJson} from "../src/lib/esm/fs-extra.js"

🗎 src/lib/esm/fs-extra.js

import {createRequire} from "node:module"

const require = createRequire(import.meta.url)
const commonJsModule = require("fs-extra")

export const fs = commonJsModule
export default fs

Yargs

From

import yargs from "yargs"

/**
 * @typedef {Object} Args
 */

/**
 * @param {Args} args
 * @return {Promise<void>}
 */
const job = async args => {
}

/**
 * @type {import("yargs").CommandBuilder}
 */
const builder = {
}

yargs
  .scriptName(process.env.REPLACE_PKG_NAME)
  .version(process.env.REPLACE_PKG_VERSION)
  .command("$0", process.env.REPLACE_PKG_DESCRIPTION, builder, job)
  .argv

To

import yargs from "yargs"
import {hideBin} from "yargs/helpers" // eslint-disable-line node/file-extension-in-import -- This is not a real file path, this is a resolve shortcut defined in node_modules/yargs/package.json[exports][./helpers]

/**
 * @typedef {Object} Args
 */

/**
 * @param {Args} args
 * @return {Promise<void>}
 */
const job = async args => {
}

/**
 * @type {import("yargs").CommandBuilder}
 */
const builder = {
}

await yargs(hideBin(process.argv))
  .scriptName(process.env.REPLACE_PKG_NAME)
  .version(process.env.REPLACE_PKG_VERSION)
  .command("$0", process.env.REPLACE_PKG_DESCRIPTION, builder, job)
  .parse()

Quick

up && npm pkg set type=module && npx git-flush-cli 'Changed package type to module' && git sync && rd acorn 
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment