chore: ESModuleにする (#2580)

Author: sevenc-nanashi

build/afterAllArtifactBuild.js build/afterAllArtifactBuild.cjs

@@ -1,9 +1,9 @@
 /* eslint-disable @typescript-eslint/no-require-imports */
 const afterWindowsNsisWebArtifactBuild =
-  require("./afterNsisWebArtifactBuild").default;
+  require("./afterNsisWebArtifactBuild.cjs").default;
 
 // buildResult: electron-builder.BuildResult
-exports.default = async function (buildResult) {
+module.exports.default = async function (buildResult) {
   for (const [platform, targets] of buildResult.platformToTargets.entries()) {
     const platformName = platform.name;
 

build/afterNsisWebArtifactBuild.js build/afterNsisWebArtifactBuild.cjs

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-require-imports */
-const splitNsisArchive = require("./splitNsisArchive").default;
+const splitNsisArchive = require("./splitNsisArchive.cjs").default;
 
 // target: electron-builder.Target
-exports.default = async function (target) {
+module.exports.default = async function (target) {
   await splitNsisArchive(target);
 };

build/splitNsisArchive.js build/splitNsisArchive.cjs

@@ -11,7 +11,7 @@ const createIni = (sizes, hashes) => {
 };
 
 // target: electron-builder.Target
-exports.default = async function (target) {
+module.exports.default = async function (target) {
   const projectName = process.env.npm_package_name;
   if (projectName == undefined) {
     const ErrorMessage = "Project name is undefined.";

electron-builder.config.js electron-builder.config.cjs

@@ -1,11 +1,13 @@
 /* eslint-disable @typescript-eslint/no-require-imports */
-// @ts-check
-const path = require("path");
-const fs = require("fs");
-const dotenv = require("dotenv");
+const { join, resolve } = require("path");
+const { readdirSync, existsSync, rmSync } = require("fs");
+const { config } = require("dotenv");
+const {
+  default: afterAllArtifactBuild,
+} = require("./build/afterAllArtifactBuild.cjs");
 
-const dotenvPath = path.join(process.cwd(), ".env.production");
-dotenv.config({ path: dotenvPath });
+const dotenvPath = join(process.cwd(), ".env.production");
+config({ path: dotenvPath });
 
 const VOICEVOX_ENGINE_DIR =
   process.env.VOICEVOX_ENGINE_DIR ?? "../voicevox_engine/dist/run/";
@@ -38,24 +40,22 @@ const isArm64 = process.arch === "arm64";
 // cf: https://k-hyoda.hatenablog.com/entry/2021/10/23/000349#%E8%BF%BD%E5%8A%A0%E5%B1%95%E9%96%8B%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E5%85%88%E3%81%AE%E8%A8%AD%E5%AE%9A
 const extraFilePrefix = isMac ? "MacOS/" : "";
 
-const sevenZipFile = fs
-  .readdirSync(path.resolve(__dirname, "vendored", "7z"))
-  .find(
-    // Windows: 7za.exe, Linux: 7zzs, macOS: 7zz
-    (fileName) => ["7za.exe", "7zzs", "7zz"].includes(fileName),
-  );
+const sevenZipFile = readdirSync(resolve(__dirname, "vendored", "7z")).find(
+  // Windows: 7za.exe, Linux: 7zzs, macOS: 7zz
+  (fileName) => ["7za.exe", "7zzs", "7zz"].includes(fileName),
+);
 
 if (!sevenZipFile) {
   throw new Error(
-    "7z binary file not found. Run `node ./tools/download7z.js` first.",
+    "7z binary file not found. Run `node ./tools/download7z.ts` first.",
   );
 }
 
 /** @type {import("electron-builder").Configuration} */
 const builderOptions = {
   beforeBuild: async () => {
-    if (fs.existsSync(path.resolve(__dirname, "dist_electron"))) {
-      fs.rmSync(path.resolve(__dirname, "dist_electron"), { recursive: true });
+    if (existsSync(resolve(__dirname, "dist_electron"))) {
+      rmSync(resolve(__dirname, "dist_electron"), { recursive: true });
     }
   },
   directories: {
@@ -93,22 +93,18 @@ const builderOptions = {
     },
     {
       from: VOICEVOX_ENGINE_DIR,
-      to: path.join(extraFilePrefix, "vv-engine"),
+      to: join(extraFilePrefix, "vv-engine"),
     },
     {
-      from: path.resolve(__dirname, "vendored", "7z", sevenZipFile),
+      from: resolve(__dirname, "vendored", "7z", sevenZipFile),
       to: extraFilePrefix + sevenZipFile,
     },
   ],
   // electron-builder installer
   productName: "VOICEVOX",
   appId: "jp.hiroshiba.voicevox",
   copyright: "Hiroshiba Kazuyuki",
-  afterAllArtifactBuild: path.resolve(
-    __dirname,
-    "build",
-    "afterAllArtifactBuild.js",
-  ),
+  afterAllArtifactBuild,
   win: {
     icon: "public/icon.png",
     target: [
@@ -165,5 +161,4 @@ const builderOptions = {
     icon: "public/icon-dmg.icns",
   },
 };
-
 module.exports = builderOptions;

eslint.config.mjs eslint.config.js

@@ -15,8 +15,6 @@ import progress from "eslint-plugin-file-progress";
 import gitignore from "eslint-config-flat-gitignore";
 import voicevoxPlugin from "./eslint-plugin/index.mjs";
 
-const __dirname = import.meta.dirname;
-
 /**
  * @typedef {import("@typescript-eslint/utils/ts-eslint").FlatConfig.Config} Config
  * @typedef {import("@typescript-eslint/utils/ts-eslint").FlatConfig.ConfigArray} ConfigArray
@@ -64,7 +62,7 @@ const vueParserOptions = {
 /** @type {ParserOptions} */
 const typeCheckedParserOptions = {
   project: ["./tsconfig.json"],
-  tsconfigRootDir: __dirname,
+  tsconfigRootDir: import.meta.dirname,
 };
 
 /** @type {Rules} */

package.json

@@ -4,6 +4,7 @@
   "author": "Hiroshiba Kazuyuki",
   "private": true,
   "main": "./dist/main.js",
+  "type": "module",
   "engines": {
     "node": ">=22.14.0 <23"
   },
@@ -20,9 +21,9 @@
     "typecheck": "vue-tsc --noEmit",
     "typos": "cross-env ./vendored/typos/typos",
     "// --- tools ---": "",
-    "license:generate": "tsx tools/generateLicenses.mts",
-    "license:merge": "tsx tools/mergeLicenses.mts",
-    "check-suspicious-imports": "tsx tools/checkSuspiciousImports.mts",
+    "license:generate": "tsx tools/generateLicenses.ts",
+    "license:merge": "tsx tools/mergeLicenses.ts",
+    "check-suspicious-imports": "tsx tools/checkSuspiciousImports.ts",
     "// --- test ---": "",
     "test:unit": "vitest --run",
     "test-watch:unit": "vitest --watch",
@@ -37,7 +38,7 @@
     "test-ui:storybook-vrt": "cross-env TARGET=storybook playwright test --ui",
     "// --- build ---": "",
     "electron:serve": "cross-env VITE_TARGET=electron vite",
-    "electron:build": "cross-env VITE_TARGET=electron NODE_ENV=production vite build && electron-builder --config electron-builder.config.js --publish never",
+    "electron:build": "cross-env VITE_TARGET=electron NODE_ENV=production vite build && electron-builder --config electron-builder.config.cjs --publish never",
     "browser:serve": "cross-env VITE_TARGET=browser vite",
     "browser:build": "cross-env VITE_TARGET=browser NODE_ENV=production vite build",
     "storybook": "storybook dev --port 6006",
@@ -46,7 +47,7 @@
     "preinstall": "npx -y only-allow pnpm",
     "postinstall": "pnpm run postinstall:packages && pnpm run postinstall:download-scripts",
     "postinstall:packages": "electron-builder install-app-deps && playwright install chromium",
-    "postinstall:download-scripts": "tsx tools/download7z.mts && tsx tools/downloadTypos.mts",
+    "postinstall:download-scripts": "tsx tools/download7z.ts && tsx tools/downloadTypos.ts",
     "postuninstall": "electron-builder install-app-deps"
   },
   "dependencies": {

src/backend/electron/main.ts

@@ -118,13 +118,13 @@ function initializeAppPaths() {
   let __static: string;
 
   if (isDevelopment) {
-    // __dirnameはdist_electronを指しているので、一つ上のディレクトリに移動する
-    appDirPath = path.resolve(__dirname, "..");
+    // import.meta.dirnameはdist_electronを指しているので、一つ上のディレクトリに移動する
+    appDirPath = path.resolve(import.meta.dirname, "..");
     __static = path.join(appDirPath, "public");
   } else {
     appDirPath = path.dirname(app.getPath("exe"));
     process.chdir(appDirPath);
-    __static = __dirname;
+    __static = import.meta.dirname;
   }
 
   return { appDirPath, __static };
@@ -141,8 +141,8 @@ void app.whenReady().then(() => {
     // 読み取り先のファイルがインストールディレクトリ内であることを確認する
     // ref: https://www.electronjs.org/ja/docs/latest/api/protocol#protocolhandlescheme-handler
     const { pathname } = new URL(request.url);
-    const pathToServe = path.resolve(path.join(__dirname, pathname));
-    const relativePath = path.relative(__dirname, pathToServe);
+    const pathToServe = path.resolve(path.join(import.meta.dirname, pathname));
+    const relativePath = path.relative(import.meta.dirname, pathToServe);
     const isUnsafe =
       path.isAbsolute(relativePath) ||
       relativePath.startsWith("..") ||

src/backend/electron/manager/windowManager.ts

@@ -81,7 +81,7 @@ class WindowManager {
       show: false,
       backgroundColor,
       webPreferences: {
-        preload: path.join(__dirname, "preload.js"),
+        preload: path.join(import.meta.dirname, "preload.mjs"),
       },
       icon: path.join(this.staticDir, "icon.png"),
     });

tests/e2e/storybook/スクリーンショット.spec.mts tests/e2e/storybook/スクリーンショット.spec.ts

@@ -10,6 +10,8 @@
     "skipLibCheck": true,
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
+    "allowImportingTsExtensions": true,
+    "noEmit": true,
     "isolatedModules": true,
     "resolveJsonModule": true,
     "sourceMap": true,
@@ -21,18 +23,11 @@
     "lib": ["esnext", "dom", "dom.iterable"]
   },
   "include": [
-    "playwright.config.ts",
-    "*.mts",
-    "eslint-plugin/**/*.mts",
-    "src/**/*.ts",
-    "src/**/*.tsx",
-    "src/**/*.vue",
-    "tests/**/*.ts",
-    "tests/**/*.mts",
-    "tests/**/*.tsx",
-    "tools/**/*.ts",
-    "tools/**/*.mts",
-    ".storybook/**/*.ts"
+    ".storybook/**/*.ts",
+    "**/*.js",
+    "**/*.ts",
+    "**/*.cjs",
+    "**/*.vue"
   ],
   "exclude": ["node_modules"]
 }

tests/e2e/storybook/スクリーンショット.spec.mts-snapshots/components-base-basebutton--danger-dark-storybook-win32.png tests/e2e/storybook/スクリーンショット.spec.ts-snapshots/components-base-basebutton--danger-dark-storybook-win32.png

@@ -2,7 +2,7 @@
 import path from "path";
 import { rm } from "fs/promises";
 
-import electron from "vite-plugin-electron";
+import electron from "vite-plugin-electron/simple";
 import tsconfigPaths from "vite-tsconfig-paths";
 import vue from "@vitejs/plugin-vue";
 import checker from "vite-plugin-checker";
@@ -13,7 +13,7 @@ import { z } from "zod";
 import {
   checkSuspiciousImports,
   CheckSuspiciousImportsOptions,
-} from "./tools/checkSuspiciousImports.mjs";
+} from "./tools/checkSuspiciousImports.js";
 
 const isElectron = process.env.VITE_TARGET === "electron";
 const isBrowser = process.env.VITE_TARGET === "browser";
@@ -90,9 +90,10 @@ export default defineConfig((options) => {
       isElectron && [
         cleanDistPlugin(),
         // TODO: 関数で切り出して共通化できる部分はまとめる
-        electron([
-          {
+        electron({
+          main: {
             entry: "./backend/electron/main.ts",
+
             // ref: https://github.com/electron-vite/vite-plugin-electron/pull/122
             onstart: ({ startup }) => {
               console.log("main process build is complete.");
@@ -124,9 +125,9 @@ export default defineConfig((options) => {
               },
             },
           },
-          {
+          preload: {
             // ref: https://electron-vite.github.io/guide/preload-not-split.html
-            entry: "./backend/electron/preload.ts",
+            input: "./src/backend/electron/preload.ts",
             onstart({ reload }) {
               if (!skipLaunchElectron) {
                 reload();
@@ -140,13 +141,10 @@ export default defineConfig((options) => {
               build: {
                 outDir: path.resolve(import.meta.dirname, "dist"),
                 sourcemap,
-                rollupOptions: {
-                  output: { inlineDynamicImports: true },
-                },
               },
             },
           },
-        ]),
+        }),
       ],
       isBrowser && injectBrowserPreloadPlugin(),
     ],

tests/e2e/storybook/スクリーンショット.spec.mts-snapshots/components-base-basebutton--danger-light-storybook-win32.png tests/e2e/storybook/スクリーンショット.spec.ts-snapshots/components-base-basebutton--danger-light-storybook-win32.png

@@ -11,7 +11,7 @@ const ignorePaths = (paths: string[]) => paths.map((path) => `!${path}`);
 export default defineWorkspace([
   // Node.js環境
   {
-    extends: "./vite.config.mts",
+    extends: "./vite.config.ts",
     test: {
       include: nodeTestPaths,
       name: "node",
@@ -22,7 +22,7 @@ export default defineWorkspace([
 
   // happy-domのエミュレート版ブラウザ環境
   {
-    extends: "./vite.config.mts",
+    extends: "./vite.config.ts",
     plugins: [],
     test: {
       include: [
@@ -38,7 +38,7 @@ export default defineWorkspace([
 
   // Chromiumブラウザ環境
   {
-    extends: "./vite.config.mts",
+    extends: "./vite.config.ts",
     test: {
       include: browserTestPaths,
       globals: true,
@@ -56,7 +56,7 @@ export default defineWorkspace([
 
   // Storybook
   {
-    extends: "./vite.config.mts",
+    extends: "./vite.config.ts",
     plugins: [
       storybookTest({
         storybookScript: "storybook --ci --port 7160",