refactor: make client and sw ES modules

gulpfile.js

@@ -8,7 +8,6 @@ const replace = require("gulp-replace");
 const terser = require("gulp-terser");
 const cssnano = require("gulp-cssnano");
 
-const locales = require("./locales");
 const meta = require("./package.json");
 
 gulp.task("copy:backend:views", () =>
@@ -29,8 +28,9 @@ gulp.task("copy:client:fonts", () =>
 		.pipe(gulp.dest("./built/_client_dist_/fonts/")),
 );
 
-gulp.task("copy:client:locales", (cb) => {
+gulp.task("copy:client:locales", async (cb) => {
 	fs.mkdirSync("./built/_client_dist_/locales", { recursive: true });
+	const { default: locales } = await import("./locales/index.mjs");
 
 	const v = { _version_: meta.version };
 
@@ -45,7 +45,9 @@ gulp.task("copy:client:locales", (cb) => {
 	cb();
 });
 
-gulp.task("build:backend:script", () => {
+gulp.task("build:backend:script", async () => {
+	const { default: locales } = await import("./locales/index.mjs");
+
 	return gulp
 		.src([
 			"./packages/backend/src/server/web/boot.js",

locales/index.mjs

@@ -2,8 +2,14 @@
  * Languages Loader
  */
 
-const fs = require("fs");
-const yaml = require("js-yaml");
+import fs from "node:fs";
+import yaml from "js-yaml";
+
+import { dirname } from "node:path";
+import { fileURLToPath } from "node:url";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+
 const languages = [];
 const languages_custom = [];
 
@@ -66,16 +72,17 @@ const locales_custom = languages_custom.reduce(
 );
 Object.assign(locales, locales_custom);
 
-module.exports = Object.entries(locales).reduce(
+export default Object.entries(locales).reduce(
 	(a, [k, v]) => (
 		(a[k] = (() => {
 			const [lang] = k.split("-");
-			return k === "en-US" ? v :
-				merge(
-					locales["en-US"],
-					locales[`${lang}-${primaries[lang]}`] || {},
-					v,
-				);
+			return k === "en-US"
+				? v
+				: merge(
+						locales["en-US"],
+						locales[`${lang}-${primaries[lang]}`] || {},
+						v,
+					);
 		})()),
 		a
 	),

packages/client/package.json

@@ -1,6 +1,7 @@
 {
 	"name": "client",
 	"private": true,
+	"type": "module",
 	"scripts": {
 		"watch": "pnpm vite build --watch --mode development",
 		"build": "pnpm vite build",

packages/client/vite.config.ts

@@ -2,10 +2,10 @@ import * as fs from "fs";
 import pluginVue from "@vitejs/plugin-vue";
 import { defineConfig } from "vite";
 
-import viteCompression from "vite-plugin-compression";
-import locales from "../../locales";
-import meta from "../../package.json";
+import locales from "../../locales/index.mjs";
+import meta from "../../package.json" assert { type: "json" };
 import pluginJson5 from "./vite.json5";
+import viteCompression from "vite-plugin-compression";
 
 const extensions = [
 	".ts",

packages/sw/package.json

@@ -1,6 +1,7 @@
 {
 	"name": "sw",
 	"private": true,
+	"type": "module",
 	"scripts": {
 		"build": "pnpm vite build --emptyOutDir",
 		"build:debug": "pnpm run build",

packages/sw/tsconfig.json

@@ -16,6 +16,7 @@
 		"noLib": false,
 		"strict": true,
 		"strictNullChecks": true,
+		"allowSyntheticDefaultImports": true,
 		"experimentalDecorators": true,
 		"resolveJsonModule": true,
 		"isolatedModules": true,
@@ -23,10 +24,7 @@
 		"paths": {
 			"@/*": ["./src/*"]
 		},
-		"typeRoots": [
-			"node_modules/@types",
-			"@types",
-		],
+		"typeRoots": ["node_modules/@types", "@types"],
 		"lib": ["esnext", "webworker"]
 	},
 	"compileOnSave": false,

packages/sw/vite.config.ts

@@ -1,6 +1,6 @@
 import { defineConfig } from "vite";
-const locales = require("../../locales");
-const meta = require("../../package.json");
+import locales from "../../locales/index.mjs";
+import meta from "../../package.json" assert { type: "json" };
 
 const isProduction = process.env.NODE_ENV === "production";
 import viteCompression from "vite-plugin-compression";