Merge pull request #13 from JosunLP/dev

1.6.1
fixing watch
2025-06-21 18:11:08 +00:00 · 2024-06-01 03:43:28 +02:00 · 2024-06-01 03:42:25 +02:00 · 2024-06-01 03:37:36 +02:00 · 2024-06-01 03:35:46 +02:00 · 2024-06-01 03:34:53 +02:00
18 changed files with 129 additions and 223 deletions
--- a/.gitignore
+++ b/.gitignore
@ -688,7 +688,7 @@ FodyWeavers.xsd
 dist

 tools/syncConfig.js
-tools/deploy.js
+tools/parse.js
 tools/v2.js
 tools/clean.js
 package-lock.json
--- a/2
+++ b/2
@ -1,6 +1,6 @@
 MIT License

-Copyright (c) 2022 Jonas Pfalzgraf
+Copyright (c) 2024 Jonas Pfalzgraf

 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
--- a/package.json
+++ b/package.json
@ -3,25 +3,20 @@
  "version": "0.0.1",
  "private": true,
  "scripts": {
-    "deploy-v3": "npx rimraf ./dist/ && npm run build-tooling && node ./tools/deploy.js && npm run sync && npm run build-js && npm run build-css && node ./tools/clean.js",
-    "deploy-v2": " npm run deploy-v3 && node ./tools/v2.js",
-    "build-js": "webpack --config ./webpack.config.ts && webpack --config ./webpack.config.settings.ts && webpack --config ./webpack.config.background.ts",
-    "build-css": "sass ./src/sass/:./dist/css/",
+    "deploy-v3": "npx rimraf ./dist/ && npm run build-tooling && npm run sync && npm run build && node ./tools/parse.js",
+    "deploy-v2": "npm run deploy-v3 && node ./tools/v2.js",
+    "build": "vite build",
    "build-tooling": "tsc --project ./tooling.tsconfig.json",
-    "watch-ts": "tsc -w -p tsconfig.json",
-    "watch-sass": "sass --watch ./src/sass/:./dist/css/",
+    "watch": "vite build --watch",
    "sync": "npm run build-tooling && node ./tools/syncConfig.js"
  },
  "devDependencies": {
-    "@types/chrome": "^0.0.206",
-    "@types/node": "^18.11.18",
-    "@webcomponents/webcomponentsjs": "^2.7.0",
-    "sass": "^1.39.0",
-    "ts-loader": "^9.4.2",
-    "ts-node": "^10.9.1",
-    "typescript": "^4.2.4",
-    "webpack": "^5.75.0",
-    "webpack-cli": "^5.0.1"
+    "@types/chrome": "^0.0.268",
+    "@types/node": "^20.13.0",
+    "@webcomponents/webcomponentsjs": "^2.8.0",
+    "sass": "^1.77.4",
+    "vite": "^5.2.12",
+    "vite-tsconfig-paths": "^4.3.2"
  },
  "browserslist": [
    "> 1%",
@ -45,7 +40,7 @@
    "url": "https://github.com/JosunLP/BrowserExtensionTemplate/issues"
  },
  "dependencies": {
-    "@webcomponents/custom-elements": "^1.5.1",
-    "bootstrap": "^5.2.3"
+    "@webcomponents/custom-elements": "^1.6.0",
+    "bootstrap": "^5.3.3"
  }
-}
+}
--- a/public/manifest.json
+++ b/public/manifest.json
@ -21,15 +21,6 @@
    "notifications"
  ],
  "background": {
-    "service_worker": "js/background.js"
-  },
-  "commands": {
-    "_execute_browser_action": {
-      "suggested_key": {
-        "default": "Ctrl+Shift+F",
-        "mac": "MacCtrl+Shift+F"
-      },
-      "description": "Opens popup.html"
-    }
+    "service_worker": "background.js"
  }
 }
--- a/public/options.html
+++ b/public/options.html
@ -6,7 +6,6 @@
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="./favicon.ico">
    <title>{{BET}} Options</title>
-    <link rel="stylesheet" href="css/app.css">
  </head>
  <body>
    <noscript>
@ -20,7 +19,7 @@
      </div>
    </div>
    <footer>
-      <script type="module" src="./js/settings.js"></script>
+      <script type="module" src="./settings.js"></script>
    </footer>
  </body>
 </html>
--- a/public/popup.html
+++ b/public/popup.html
@ -6,7 +6,6 @@
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="./favicon.ico">
    <title>{{BET}}</title>
-    <link rel="stylesheet" href="css/app.css">
  </head>
  <body>
    <noscript>
@ -20,7 +19,7 @@
      </div>
    </div>
    <footer>
-      <script type="module" src="./js/app.js"></script>
+      <script type="module" src="./app.js"></script>
    </footer>
  </body>
 </html>
--- a/src/app.ts
+++ b/src/app.ts
@ -1,4 +1,5 @@
 import { Session } from "./classes/session"
+import "./sass/app.sass"

 class App {

--- a/src/background.ts
+++ b/src/background.ts
@ -1,12 +1,9 @@
 class Background {
+	constructor() {
+		this.main();
+	}

-    constructor() {
-        this.main();
-    }
-
-    async main(): Promise<void> {
-
-    }
+	async main(): Promise<void> {}
 }

-new Background();
+new Background();
--- a/src/settings.ts
+++ b/src/settings.ts
@ -1,5 +1,6 @@
 import { Session } from "./classes/session";
 import { BasicButton } from "./components/button";
+import "./sass/app.sass";

 class Settings {

--- a/tooling.tsconfig.json
+++ b/tooling.tsconfig.json
@ -1,6 +1,9 @@
 {
    "compilerOptions": {
        "target": "ESNext",
+        "lib": [
+            "ESNext"
+        ],
        "module": "ESNext",
        "outDir": "./tools/",
        "rootDir": "./tools/",
--- a/tools/clean.ts
+++ b/tools/clean.ts
@ -1,10 +0,0 @@
-// @ts-ignore
-const fs = require("fs");
-
-function removeExport(file: string) {
-	let content = fs.readFileSync(file, "utf8");
-	content = content.replace("export {};", "");
-	fs.writeFileSync(file, content);
-}
-
-removeExport("./dist/js/background.js");
--- a/tools/deploy.ts
+++ b/tools/deploy.ts
@ -1,86 +0,0 @@
-const path = require('path');
-// @ts-ignore
-const fs = require('fs');
-
-const appConfigJson = JSON.parse(fs.readFileSync('./app.config.json', 'utf8'));
-const DEPLOY_ENTRY = "./public/";
-const DEPLOY_TARGET = "./dist/";
-
-function deleteFolderRecursive(path: string) {
-  if (fs.existsSync(path)) {
-    fs.readdirSync(path).forEach(function (file: string) {
-      const curPath = path + "/" + file;
-      if (fs.lstatSync(curPath).isDirectory()) {
-        deleteFolderRecursive(curPath);
-      } else {
-        fs.unlinkSync(curPath);
-      }
-    });
-    fs.rmdirSync(path);
-  }
-}
-
-function findHtmlFilesRecursive(source: string): string[] {
-  let files: string[] = [];
-  const dir = fs.readdirSync(source);
-  dir.forEach(function (file: string) {
-    const sourceFile = path.join(source, file);
-    const stat = fs.lstatSync(sourceFile);
-    if (stat.isDirectory()) {
-      files = files.concat(findHtmlFilesRecursive(sourceFile));
-    } else {
-      if (path.extname(sourceFile) == '.html') {
-        files.push(sourceFile);
-      }
-    }
-  });
-  return files;
-}
-
-function replaceKeywordsInHtmlFile(file: string) {
-  let content = fs.readFileSync(file, 'utf8');
-  const pairs = appConfigJson.htmlTemplatePairs;
-  pairs.forEach(function (pair: object) {
-    // @ts-ignore
-    content = content.replaceAll(pair.key, pair.value);
-  });
-  file = file.replace("public\\", DEPLOY_TARGET);
-  fs.writeFileSync(file, content);
-}
-
-function buildHtmlFiles(source: string) {
-  const files = findHtmlFilesRecursive(source);
-  files.forEach(function (file: string) {
-    replaceKeywordsInHtmlFile(file);
-  });
-}
-
-function mkdirSync(path: string) {
-  try {
-    fs.mkdirSync(path);
-  } catch (e: any) {
-    if (e.code != 'EEXIST') throw e;
-  }
-}
-
-function copyFiles(source: string, target: string) {
-  const files = fs.readdirSync(source);
-  files.forEach(function (file: string) {
-    const sourceFile = path.join(source, file);
-    const targetFile = path.join(target, file);
-    const stat = fs.lstatSync(sourceFile);
-    if (stat.isDirectory()) {
-      mkdirSync(targetFile);
-      copyFiles(sourceFile, targetFile);
-    } else {
-      fs.writeFileSync(targetFile, fs.readFileSync(sourceFile));
-    }
-  });
-}
-
-deleteFolderRecursive(DEPLOY_TARGET);
-mkdirSync(DEPLOY_TARGET);
-copyFiles(DEPLOY_ENTRY, DEPLOY_TARGET);
-buildHtmlFiles(DEPLOY_ENTRY);
-
-console.log("Deployed to " + DEPLOY_TARGET);
--- a/tools/parse.ts
+++ b/tools/parse.ts
@ -0,0 +1,72 @@
+import * as fs from "fs";
+import * as path from "path";
+const appConfig = JSON.parse(fs.readFileSync("./app.config.json", "utf8"));
+const DEPLOY_TARGET = "./dist/";
+
+function findCssFileNames(source: string): string[] {
+	let files: string[] = [];
+	const dir = fs.readdirSync(source);
+	dir.forEach(function (file: string) {
+		const sourceFile = path.join(source, file);
+		const stat = fs.lstatSync(sourceFile);
+		if (stat.isDirectory()) {
+			files = files.concat(findCssFileNames(sourceFile));
+		} else {
+			if (path.extname(sourceFile) == ".css") {
+				files.push(file);
+			}
+		}
+	});
+	return files;
+}
+
+function findHtmlFilesRecursive(source: string): string[] {
+	let files: string[] = [];
+	const dir = fs.readdirSync(source);
+	dir.forEach(function (file: string) {
+		const sourceFile = path.join(source, file);
+		const stat = fs.lstatSync(sourceFile);
+		if (stat.isDirectory()) {
+			files = files.concat(findHtmlFilesRecursive(sourceFile));
+		} else {
+			if (path.extname(sourceFile) == ".html") {
+				files.push(sourceFile);
+			}
+		}
+	});
+	return files;
+}
+
+function replaceKeywordsInHtmlFile(file: string) {
+	let content = fs.readFileSync(file, "utf8");
+	const pairs: { key: string; value: string }[] = appConfig.htmlTemplatePairs;
+	pairs.forEach(function (pair: { key: string; value: string }) {
+		//@ts-ignore
+		content = content.replaceAll(pair.key, pair.value);
+	});
+	file = file.replace("public\\", DEPLOY_TARGET);
+	fs.writeFileSync(file, content);
+}
+
+function buildHtmlFiles(source: string) {
+	const files = findHtmlFilesRecursive(source);
+	files.forEach(function (file: string) {
+		replaceKeywordsInHtmlFile(file);
+	});
+}
+
+findCssFileNames(DEPLOY_TARGET).forEach((file: string) => {
+	const files = findHtmlFilesRecursive(DEPLOY_TARGET);
+	files.forEach(function (htmlFile: string) {
+		let content = fs.readFileSync(htmlFile, "utf8");
+		content = content.replace(
+			"</head>",
+			`<link rel="stylesheet" href="./assets/${file}">\n</head>`
+		);
+		fs.writeFileSync(htmlFile, content);
+	});
+});
+
+buildHtmlFiles(DEPLOY_TARGET);
+
+console.log("Parsed Files: ", findHtmlFilesRecursive(DEPLOY_TARGET));
--- a/tsconfig.json
+++ b/tsconfig.json
@ -6,7 +6,7 @@
        // "incremental": true,                         /* Enable incremental compilation */
        "target": "ESNext" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', 'ES2021', or 'ESNEXT'. */,
        "module": "ESNext" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */,
-        // "lib": ["ESNext"],                                   /* Specify library files to be included in the compilation. */
+        "lib": ["ESNext", "DOM"],                                   /* Specify library files to be included in the compilation. */
        // "allowJs": true,                             /* Allow javascript files to be compiled. */
        // "checkJs": true,                             /* Report errors in .js files. */
        // "jsx": "preserve",                           /* Specify JSX code generation: 'preserve', 'react-native', 'react', 'react-jsx' or 'react-jsxdev'. */
--- a/vite.config.ts
+++ b/vite.config.ts
@ -0,0 +1,28 @@
+import { defineConfig } from "vite";
+import { resolve } from "path";
+import tsconfigPaths from "vite-tsconfig-paths";
+
+export default defineConfig({
+	build: {
+		rollupOptions: {
+			input: {
+				app: resolve(__dirname, "src/app.ts"),
+				settings: resolve(__dirname, "src/settings.ts"),
+				background: resolve(__dirname, "src/background.ts"),
+			},
+			output: {
+				entryFileNames: "[name].js",
+				dir: resolve(__dirname, "dist"),
+			},
+		},
+		sourcemap: true,
+	},
+	plugins: [tsconfigPaths()],
+	resolve: {
+		extensions: [".tsx", ".ts", ".scss", ".sass"],
+	},
+	esbuild: {
+		include: /.*\.tsx?$/,
+		exclude: [/node_modules/, /dist/],
+	},
+});
--- a/webpack.config.background.ts
+++ b/webpack.config.background.ts
@ -1,28 +0,0 @@
-const path = require('path');
-
-module.exports = {
-	entry: './src/background.ts',
-	mode: 'production',
-	devtool: 'source-map',
-	module: {
-		rules: [
-			{
-				test: /\.tsx?$/,
-				use: 'ts-loader',
-				exclude: [
-					"/node_modules/",
-					"/dist/",
-					"/src/app.ts",
-					"/src/settings.ts"
-				],
-			},
-		],
-	},
-	resolve: {
-		extensions: ['.tsx', '.ts'],
-	},
-	output: {
-		filename: 'background.js',
-		path: path.resolve(__dirname, 'dist/js'),
-	},
-};
--- a/webpack.config.settings.ts
+++ b/webpack.config.settings.ts
@ -1,28 +0,0 @@
-const path = require('path');
-
-module.exports = {
-	entry: './src/settings.ts',
-	mode: 'production',
-	devtool: 'source-map',
-	module: {
-		rules: [
-			{
-				test: /\.tsx?$/,
-				use: 'ts-loader',
-				exclude: [
-					"/node_modules/",
-					"/dist/",
-					"/src/background.ts",
-					"/src/app.ts"
-				],
-			},
-		],
-	},
-	resolve: {
-		extensions: ['.tsx', '.ts'],
-	},
-	output: {
-		filename: 'settings.js',
-		path: path.resolve(__dirname, 'dist/js'),
-	},
-};
--- a/webpack.config.ts
+++ b/webpack.config.ts
@ -1,28 +0,0 @@
-const path = require('path');
-
-module.exports = {
-	entry: './src/app.ts',
-	mode: 'production',
-	devtool: 'source-map',
-	module: {
-		rules: [
-			{
-				test: /\.tsx?$/,
-				use: 'ts-loader',
-				exclude: [
-					"/node_modules/",
-					"/dist/",
-					"/src/background.ts",
-					"/src/settings.ts"
-				],
-			},
-		],
-	},
-	resolve: {
-		extensions: ['.tsx', '.ts'],
-	},
-	output: {
-		filename: 'app.js',
-		path: path.resolve(__dirname, 'dist/js'),
-	},
-};
Author	SHA1	Message	Date
Jonas Pfalzgraf	28f710f9f5	Merge pull request #13 from JosunLP/dev 1.6.1	2024-06-01 03:43:28 +02:00
Jonas Pfalzgraf	8f99895c88	fixing watch	2024-06-01 03:42:25 +02:00
Jonas Pfalzgraf	41094cf6a9	Merge pull request #12 from JosunLP/dev Version 1.6.0	2024-06-01 03:37:36 +02:00
Jonas Pfalzgraf	1723196db6	Merge branch 'feature/vite' into dev	2024-06-01 03:35:46 +02:00
Jonas Pfalzgraf	977ce6719f	integrading new css build	2024-06-01 03:34:53 +02:00
Jonas Pfalzgraf	b225218e94	working on vite style integration	2024-06-01 02:08:14 +02:00
Jonas Pfalzgraf	693a8da648	adding vite	2024-06-01 00:57:25 +02:00