Node.js + TypeScriptのモジュールを整理してみる

2024/04/23 109 users TypeScript link モジュール 落とし穴 あたり

はじめにlink 最近受けるNode.js + TypeScript環境の相談の中で、CommonJSやECMAScript Modulesのあたりで落とし穴にはまっている人が多いという事に気づいた。 Node.jsは歴史的にCommonJSとECMAScript Modules（以後ESMと表記）がどうしても入り乱れる環境にあり、これにTypeScriptのモジュールが加わると組み合わせで... 続きを読む

Deep Dive: Node.jsのESMデフォルト化への道

2023/10/18 9 users node.js Deep Dive CJS ESM プラグ

Node.js 21では --experimental-default-type=module フラグで、JavaScriptファイルのデフォルトの解釈をCJS(CommonJS)からESM(ECMAScript Modules)に変更できるようになっています。 Node.js 21 is now available! | Node.js これは、Node.jsにおいてJavaScriptファイル(.js)のデフォルトをESMに変更するための第一歩で... 続きを読む

コードフォーマッタ「Prettier 3.0」がリリース。すべてのソースコードをECMAScriptモジュールに変更

2023/07/07 12 users コードフォーマッタ Prettier ライブラリ リリース

「Prettier 3.0」では、すべてのソースコードをECMAScriptモジュールを使用する形式へ移行しており、この変更によって開発エクスペリエンスを大幅に向上している。なお、Prettierをライブラリとして利用する場合は、CommonJSとしても利用できる。 おもな変更点としては、中国語、日本語、韓国語における空白の処理を改善... 続きを読む

CommonJSからES Modulesへの移行する方法。トップダウンかボトムアップか

2023/07/05 18 users ボトムアップ CJS ES Modules ESM 経緯

Secretlint v7でCommonJS からES Modulesへの移行を行いました。 Secretlint v7.0.0をリリースしました。Pure ESMへの書き直し この記事では、CommonJS(CJS)からES Modules(ESM)への移行を行った経緯と、移行する方法について紹介します。 CJSからESMへの移行は、率直に言えば単調な作業で、メリットが見えにくい作業で... 続きを読む

eslint-cjs-to-esm: CJSをESMへとマイグレーションするツールを書いた

2023/01/18 8 users CJS ESM Babel TypeScript ライブラリ

最近、色々なライブラリをCommonJS(CJS)からECMAScript Module(ESM)へとマイグレーションしています。 その際に、ESMでは__dirnameやrequireなどCommonJS特有の機能は使えなくなっています。 また、TypeScriptやBabelなど多くのツールはCJSではimport時に拡張子はなくても大丈夫ですが、ESMの場合はimport時に拡張子が必... 続きを読む

ESM移行は無理だけどおれもSindreのライブラリが使いたい！

2022/08/03 6 users ライブラリ パッケージ 推奨 自分たち 方法

依存しているライブラリが ESM only になってしまうことがあると思います。 そんなとき、自分たちが CommonJS だと素直に使えなくて困りますよね。 そこで、なんとかしてCommonJS環境から ESM only のパッケージをrequireする方法をご紹介します。推奨はしません。 続きを読む

Vite 3 が採用した CJS Proxy による Dual Package 構成

2022/07/19 19 users Dual Package CJS 構成 ESM npm

2022 年現在、Node.js 界隈は ESM (ES Module) への移行の過渡期であり、特に既存プロジェクトにおいては CJS (CommonJS) 構成であることがまだまだ多い。また、Pure ESM な npm パッケージは、CSJ プロジェクトからの利便性が悪く、dynamic import が必須で非同期化を強いられたり TypeScript の設定変更が必要だったり... 続きを読む

TypeScript 4.7 と Native Node.js ESM

2022/05/25 15 users TypeScript 4.7 CJS ESM nOd エントリ

TypeScript 4.7 がリリースされたので、Node.js ESM 対応の現状をまとめておく。 @teppeis さんの TypeScript 4.5 以降で ESM 対応はどうなるのか？ を先に読んでおくと、以降の話も読み進めやすいかも。 このエントリの中でも、teppeis さんの定義した用語をそのまま用いさせてもらう。 * CommonJS (CJS): 従来式の Nod... 続きを読む

Node.js コアモジュールの import/require には `node` schemeがつけられる - from scratch

2021/12/27 6 users コアモジュール コアライブラリ Scheme require

Node.js アドベントカレンダーの 3 日目の記事です。空きを埋める形で始めました。 qiita.com www.codegrid.net CodeGrid でも書かせていただきましたが、 Node.js で ES Module / CommonJS を使ってコアライブラリのロードをする際、 node から始まる scheme を付けることが可能になっています。 nodejs.org // ESM imp... 続きを読む

Node.js Dual Packages (CommonJS/ES Modules) に対応した npm パッケージの開発 - Cybozu Inside Out | サイボウズエンジニアのブログ

2020/10/06 10 users npm shisama サイボウズエンジニア 平野 パッケージ

こんにちは。フロントエンドエキスパートの平野（@shisama_）です。 フロントエンドエキスパートチームでは業務時間の 30 % の時間で技術探究を行っています。 今回は探究した技術の中から Node.js の ES Modules（以下 ESM）についてと Dual Package (CommonJS/ES Modules) に対応した npm パッケージの開発について紹... 続きを読む

複数のモジュール形式(CommonJS, ES Modules, UMD)をサポートしたnpmパッケージの作り方 in TypeScript - dackdive's blog

2019/09/23 38 users UMD require module.exports 形式

はじめに npmパッケージを開発するとき、パッケージ利用者の実行環境に合わせて適切なモジュール形式のファイルをパッケージに含め、提供する必要があります。 具体的には、たとえば以下のようなバリエーションが考えられます。 Node.js環境であれば CommonJS 形式 (module.exports / require() ) ブラウザ環境で、webpa... 続きを読む

こないだ社内の勉強会でwebpackのこととか話したのでまとめた - getalog

2016/01/27 230 users Webpack require AMD JSコード ヤツ

2016 - 01 - 27 こないだ社内の勉強会でwebpackのこととか話したのでまとめた webpackとは いろんなファイルをtranspileしてES5の JavaScript に変換してくれるやつ AMD かCommonJSの形式でファイルをロード(CommonJSならrequire)すると、transpileしたファイルをロードしてくれる クライアント側のjsコードでもrequire... 続きを読む

AngularとBrowserifyの微妙すぎる関係 - Qiita

2015/01/07 46 users browserify Qiita AngularJS 根幹

AngularJSとBrowserify、この二人の関係、かなり微妙です。もうどうしてくれようかってくらい。例えるなら宗教の違う恋人のようなものです(適当)。CommonJSに慣れた人には、AngularのDIが正直お邪魔。かといって、Angularの根幹に関わる部分なので使わないわけにもいかないし、と距離感に悩む二人です。もちろん、ReactやAmpersand.jsと幸せになる手もありますが、... 続きを読む

npmとbrowserifyを使ったクライアントサイドのウェブアプリ開発 | Web scratch

2014/01/20 157 users クライアントサイド browserify npm OPML

YoutubeとVimeoの検索結果のRSSをまとめてOPMLで取得できるサイトを作った | Web scratch で公開した Tech Video RSS Searcher はbrowserifyを使って作ったので、その辺の開発フローについての記事です。 browserify って何? browserify はNode.jsスタイルで書かれたモジュール(CommonJS)を ブラウザで利用でき... 続きを読む

Node.jsとCommonJSについて - 自分の感受性くらい

2011/06/26 93 users npm 感受性 Windowsバイナリ API node.js

node.js日経ソフトウェア8月号にJavaScriptの特集がありまして、そこでNode.jsが紹介されていました。それを読んで、僕は以下のようなツイートしました。 日経ソフトウェア8月号のJavaScript特集のNode.jsの記事みたけど、これはちょっとひどいな。非公式のWindowsバイナリを使ってるせいでnpmの使い方おかしいし、「Node.jsのAPIはCommonJSに従った形で... 続きを読む