node built-in module を使って webpack でビルドすると UnhandledSchemeError を吐く
Summary
webpack で node built-in module (node:module) を使うと, UnhandledSchemeError を吐くことがある このとき, 解決法として externals で "node:module": {} という感じで無理やり解決するとなんとかなる
Environments
Node.js: v18.18.2
TypeScript: v5.2.2
webpack: v5.89.0
electron: v27.0.1
electron-forge: v6.4.2 (plugin-webpack も含む)
Introduction
electron-forge を使って node built-in module を含む electron アプリケーションを webpack でビルドすると UnhandledSchemeError を吐く UnhandledSchemeError は, scheme (http: とか file: みたいなの) が webpack 側で解釈できないと発生
発生コード例
code:main.ts
import fs from "node:fs"
import path from "node:path"
import { BrowserWindow } from "electron"
const mainWindow = new BrowserWindow({
...
以下のエラーを吐く
code:error.log
ERROR in node:fs
Module build failed: UnhandledSchemeError: Reading from "node:fs" is not handled by plugins (Unhandled scheme).
Webpack supports "data:" and "file:" URIs by default.
You may need an additional plugin to handle "node:" URIs.
...
ERROR in node:path
Module build failed: UnhandledSchemeError: Reading from "node:path" is not handled by plugins (Unhandled scheme).
Webpack supports "data:" and "file:" URIs by default.
You may need an additional plugin to handle "node:" URIs.
...
解決用 config
code:webpack.config.ts
import { Configuration } from "webpack"
const config: Configuration = {
...
externals: {
"node:fs": {},
"node:path": {},
}
}
一応, externals ではなく, NormalModuleReplacementPlugin を使ったごり押し法があるけど, polyfill するんじゃなければよい？
resolve.fallback と resolve.alias では解決できない (ref) 追記 (2023/11/11): なんかなくても直った (は？)
References
New node: scheme from Node 16 not handled
Closed
resolve.fallback and resolve.alias do not work with node: prefix
Open