変更したlintでの整形

.eslintrc.js

@@ -1,23 +1,23 @@
 module.exports = {
   root: true,
-  parser: '@typescript-eslint/parser',
+  parser: "@typescript-eslint/parser",
   parserOptions: {
     tsconfigRootDir: __dirname,
-    project: ['./tsconfig.json'],
+    project: ["./tsconfig.json"],
   },
-  plugins: ['@typescript-eslint'],
+  plugins: ["@typescript-eslint"],
   extends: [
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:@typescript-eslint/recommended-requiring-type-checking',
-    'plugin:react/recommended',
-    'plugin:react-hooks/recommended',
-    'prettier',
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:@typescript-eslint/recommended-requiring-type-checking",
+    "plugin:react/recommended",
+    "plugin:react-hooks/recommended",
+    "prettier",
   ],
   rules: {
-    'react/prop-types': 'off',
-    '@typescript-eslint/no-misused-promises': [
-      'error',
+    "react/prop-types": "off",
+    "@typescript-eslint/no-misused-promises": [
+      "error",
       {
         checksVoidReturn: {
           arguments: false,
@@ -31,7 +31,7 @@ module.exports = {
   },
   settings: {
     react: {
-      version: 'detect',
+      version: "detect",
     },
   },
 };

build.ts

@@ -1,13 +1,13 @@
-import { Builder } from './utils/buildUtils';
+import { Builder } from "./utils/buildUtils";
 
-const watchFlag = process.argv.includes('--watch');
-const devFlag = process.argv.includes('--dev');
-const chromeFlag = process.argv.includes('--chrome');
-const firefoxFlag = process.argv.includes('--firefox');
+const watchFlag = process.argv.includes("--watch");
+const devFlag = process.argv.includes("--dev");
+const chromeFlag = process.argv.includes("--chrome");
+const firefoxFlag = process.argv.includes("--firefox");
 
 const builder = new Builder({ watchFlag, devFlag, chromeFlag, firefoxFlag });
-builder.addBuildFile('popup/index.tsx');
-builder.addStaticFile('popup/popup.html');
-builder.addStaticDir('icons');
+builder.addBuildFile("popup/index.tsx");
+builder.addStaticFile("popup/popup.html");
+builder.addStaticDir("icons");
 
 builder.build();

popup/Popup.tsx

@@ -1,9 +1,9 @@
-import React from 'react';
-import browser from 'webextension-polyfill';
+import React from "react";
+import browser from "webextension-polyfill";
 
 export const Popup: React.FC = () => {
   const handleClick = async (): Promise<void> => {
-    await browser.tabs.create({ url: 'https://example.com/' });
+    await browser.tabs.create({ url: "https://example.com/" });
   };
 
   // a button to open example.com

popup/index.tsx

@@ -1,8 +1,8 @@
-import React from 'react';
-import { createRoot } from 'react-dom/client';
-import { Popup } from './Popup';
+import React from "react";
+import { createRoot } from "react-dom/client";
+import { Popup } from "./Popup";
 
-const container = document.getElementById('root');
+const container = document.getElementById("root");
 // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
 const root = createRoot(container!);
 root.render(<Popup />);

utils/buildUtils.ts

@@ -1,16 +1,16 @@
-import * as chokidar from 'chokidar';
-import { build, BuildOptions } from 'esbuild';
-import { promises as fs } from 'fs';
-import path from 'path';
+import * as chokidar from "chokidar";
+import { build, BuildOptions } from "esbuild";
+import { promises as fs } from "fs";
+import path from "path";
 
-type Browser = 'firefox' | 'chrome';
+type Browser = "firefox" | "chrome";
 
 const distDir = (targetBrowser: Browser) => {
   switch (targetBrowser) {
-    case 'firefox':
-      return 'dist-firefox';
-    case 'chrome':
-      return 'dist-chrome';
+    case "firefox":
+      return "dist-firefox";
+    case "chrome":
+      return "dist-chrome";
   }
 };
 
@@ -20,21 +20,21 @@ const distPath = (relPath: string, targetBrowser: Browser) =>
 const makeManifestFile = async (targetBrowser: Browser) => {
   // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
   const baseManifestJson = JSON.parse(
-    await fs.readFile('manifest.json', 'utf8')
+    await fs.readFile("manifest.json", "utf8")
   );
-  if (targetBrowser === 'firefox') {
+  if (targetBrowser === "firefox") {
     // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-    const firefoxJson = JSON.parse(await fs.readFile('firefox.json', 'utf8'));
+    const firefoxJson = JSON.parse(await fs.readFile("firefox.json", "utf8"));
     // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
     const manifestJson = { ...baseManifestJson, ...firefoxJson };
     await fs.writeFile(
-      distPath('manifest.json', targetBrowser),
+      distPath("manifest.json", targetBrowser),
       JSON.stringify(manifestJson, null, 1)
     );
   } else {
     await fs.copyFile(
-      'manifest.json',
-      distPath('manifest.json', targetBrowser)
+      "manifest.json",
+      distPath("manifest.json", targetBrowser)
     );
   }
 };
@@ -75,7 +75,7 @@ export class Builder {
     this.staticDirs.push(dir);
   }
 
-  watchOption(targetBrowser: Browser): BuildOptions['watch'] {
+  watchOption(targetBrowser: Browser): BuildOptions["watch"] {
     return this.watchFlag
       ? {
           onRebuild: (error, result) => {
@@ -96,7 +96,7 @@ export class Builder {
       recursive: true,
     });
     if (this.watchFlag) {
-      chokidar.watch(file).on('all', (event, path) => {
+      chokidar.watch(file).on("all", (event, path) => {
         console.log(event, path);
         void fs.copyFile(path, distPath(file, targetBrowser));
       });
@@ -109,7 +109,7 @@ export class Builder {
       recursive: true,
     });
     if (this.watchFlag) {
-      chokidar.watch(path.join(dir, '*')).on('all', (event, filepath) => {
+      chokidar.watch(path.join(dir, "*")).on("all", (event, filepath) => {
         console.log(event, filepath);
         void fs.copyFile(
           filepath,
@@ -124,8 +124,8 @@ export class Builder {
   makeManifestFileAndWatch(targetBrowser: Browser) {
     if (this.watchFlag) {
       chokidar
-        .watch(['manifest.json', 'firefox.json'])
-        .on('all', (event, path) => {
+        .watch(["manifest.json", "firefox.json"])
+        .on("all", (event, path) => {
           console.log(event, path);
           void makeManifestFile(targetBrowser);
         });
@@ -141,9 +141,9 @@ export class Builder {
         bundle: true,
         outdir: distPath(path.dirname(file), targetBrowser),
         watch: this.watchOption(targetBrowser),
-        sourcemap: this.devFlag ? 'inline' : false,
+        sourcemap: this.devFlag ? "inline" : false,
         define: {
-          'process.env.NODE_ENV': this.devFlag
+          "process.env.NODE_ENV": this.devFlag
             ? '"development"'
             : '"production"',
         },
@@ -160,11 +160,11 @@ export class Builder {
 
   build() {
     if (this.chromeFlag) {
-      const browser: Browser = 'chrome';
+      const browser: Browser = "chrome";
       this.buildForBrowser(browser);
     }
     if (this.firefoxFlag) {
-      const browser: Browser = 'firefox';
+      const browser: Browser = "firefox";
       this.buildForBrowser(browser);
     }
   }