refactor(scripts): Reorganize Build Scripts (#1847)

.github/workflows/host_plugins.yml

@@ -27,10 +27,10 @@ jobs:
 
       - if: github.repository == 'LNReader/lnreader-plugins'
         name: Publish Plugins Main Repo
-        run: npm run host-linux 2>> $GITHUB_STEP_SUMMARY
+        run: npm run publish:plugins 2>> $GITHUB_STEP_SUMMARY
         shell: bash
 
       - if: github.repository != 'LNReader/lnreader-plugins'
         name: Publish Plugins All Branches
-        run: npm run host-linux -- --all-branches
+        run: npm run publish:plugins -- --all-branches
         shell: bash

README.md

@@ -24,19 +24,19 @@ Repository to host plugins and related issues, and requests for
 
 #### via the testing website
 
-1. Run `npm start` and open `localhost:3000` to test!
+1. Run `npm run dev:start` and open `localhost:3000` to test!
 
 [Detailed tutorial for testing website](./docs/website-tutorial.md)
 
 #### via an app
 
 1. Plugins from GitHub
-    * Run `npm run host-linux` or `npm run host-windows` (depending on your operating system)
+   - Run `npm run publish:plugins` or `npm run publish:plugins:windows` (depending on your operating system)
-    * Add your `https://raw.githubusercontent.com/<username>/<repo>/plugins/<tag>/.dist/plugins.min.json` to app repository
+   - Add your `https://raw.githubusercontent.com/<username>/<repo>/plugins/<tag>/.dist/plugins.min.json` to app repository
 2. Plugins from localhost
-    * Copy `.env.template` to `.env` and update `USER_CONTENT_BASE` according to the comment there
+   - Copy `.env.template` to `.env` and update `USER_CONTENT_BASE` according to the comment there
-    * Run `npm run host-dev`
+   - Run `npm run serve:dev`
-    * Add plugin listing to app repository (e.g. for android emulator `http://10.0.2.2/.dist/plugins.min.json`)
+   - Add plugin listing to app repository (e.g. for android emulator `http://10.0.2.2/.dist/plugins.min.json`)
 
 ---
 

generate-plugin-index.js

@@ -1,4 +1,5 @@
 import fs from 'fs';
+import { execSync } from 'child_process';
 
 let content = `import { Plugin } from '@typings/plugin';\n`;
 let pluginCounter = 0;
@@ -21,4 +22,7 @@ content += `\nconst PLUGINS: Plugin.PluginBase[] = [${Array(pluginCounter)
   .map((v, index) => 'p_' + index.toString())
   .join(', ')}];\nexport default PLUGINS`;
 
-fs.writeFileSync('./src/plugins/index.ts', content, { encoding: 'utf-8' });
+const outputPath = './src/plugins/index.ts';
+fs.writeFileSync(outputPath, content, { encoding: 'utf-8' });
+
+execSync(`npx prettier --write ${outputPath}`, { stdio: 'inherit' });

package.json

@@ -5,20 +5,24 @@
   "main": "index.js",
   "type": "module",
   "scripts": {
-    "clearMultisrc": "find . -type f -wholename \"*plugins*\\[*\\]*.[t,j]s\" -delete",
+    "clean:multisrc": "find . -type f -wholename \"*plugins*\\[*\\]*.[t,j]s\" -delete",
-    "clearMultisrc-windows": "powershell -Command \"Get-ChildItem -Recurse -Include \\\"*].ts\\\",\\\"*].js\\\" | Where-Object { $_.FullName -like \\\"*plugins*\\\" } | Remove-Item\"",
+    "clean:multisrc:windows": "powershell -Command \"Get-ChildItem -Recurse -Include \\\"*].ts\\\",\\\"*].js\\\" | Where-Object { $_.FullName -like \\\"*plugins*\\\" } | Remove-Item\"",
     "dev": "vite",
-    "generate": "node ./scripts/multisrc/generate.js",
+    "dev:start": "node generate-plugin-index.js && vite",
-    "host-linux": "chmod +x ./host.sh && ./host.sh",
+    "build:multisrc": "node ./scripts/multisrc/generate-multisrc-plugins.js",
-    "host-windows": "powershell ./host.ps1",
+    "build:compile": "npx tsc --project tsconfig.production.json",
-    "host-dev": "npx tsc --project tsconfig.production.json && node --env-file=.env ./scripts/json_plugins.js && serve",
+    "build:manifest": "node ./scripts/build-plugin-manifest.js",
-    "icons": "npm run clearMultisrc && npm run generate && npx tsc --project tsconfig.production.json && npm run json && node ./scripts/icon_reloading.js",
+    "build:manifest:dev": "node --env-file=.env ./scripts/build-plugin-manifest.js",
-    "json": "node ./scripts/json_plugins.js",
+    "build:icons": "npm run clean:multisrc && npm run build:multisrc && npm run build:compile && npm run build:manifest && node ./scripts/download-plugin-icons.js",
+    "build:full": "npm run clean:multisrc && npm run build:multisrc && npm run build:compile && npm run build:manifest",
+    "publish:plugins": "chmod +x ./publish-plugins.sh && ./publish-plugins.sh",
+    "publish:plugins:windows": "powershell ./publish-plugins.ps1",
+    "serve:dev": "npm run build:compile && npm run build:manifest:dev && serve",
     "lint": "npx eslint .",
-    "prepare": "husky",
+    "lint:fix": "npx eslint . --fix",
-    "prettier": "prettier --write \"./**/*.{js,ts}\"",
+    "format": "prettier --write \"./**/*.{js,ts}\"",
-    "start": "node importPlugins.js && vite",
+    "format:check": "prettier --check \"./**/*.{js,ts}\"",
-    "test": "exit 0"
+    "prepare": "husky"
   },
   "author": "LNReader",
   "license": "MIT",

publish-plugins.ps1

@@ -18,10 +18,10 @@ if(-Not $?){
 
 git reset
 rm -r -fo .js
-npm run clearMultisrc
+npm run clean:multisrc
-npm run generate
+npm run build:multisrc
 npx tsc --project tsconfig.production.json
-npm run json
+npm run build:manifest
 
 if (-not (Test-Path .dist) -or -not (Get-ChildItem -Path .dist -Force)) {
     echo "=========="

publish-plugins.sh

@@ -13,9 +13,9 @@ if [[ "$1" == "--all-branches" ]]; then
     git fetch --all
     branches=$(git branch -r | grep -v '\->')
     for branch in $branches; do
-        # Check if the branch has the same version of host.sh as the current branch
+        # Check if the branch has the same version of publish-plugins.sh as the current branch
-        if ! diff host.sh <(git show "$branch:host.sh") >/dev/null; then
+        if ! diff publish-plugins.sh <(git show "$branch:publish-plugins.sh") >/dev/null; then
-            echo "Branch $branch does not have the current version of host.sh. Skipping."
+            echo "Branch $branch does not have the current version of publish-plugins.sh. Skipping."
             continue
         fi
         echo "::group::Branch $branch"
@@ -26,11 +26,11 @@ if [[ "$1" == "--all-branches" ]]; then
             git branch -D $dist
         fi
         git stash pop
-        npm run clearMultisrc
+        npm run clean:multisrc
-        npm run generate
+        npm run build:multisrc
         npx tsc --project tsconfig.production.json
         echo "# $branch" >> $GITHUB_STEP_SUMMARY
-        npm run json -- --only-new 2>> $GITHUB_STEP_SUMMARY
+        npm run build:manifest -- --only-new 2>> $GITHUB_STEP_SUMMARY
         if [ ! -d ".dist" ] || [ -z "$(ls -A .dist)" ]; then
             echo "=========="
             echo "JSON files were not generated! See the error above and fix it!"
@@ -73,10 +73,10 @@ fi
 
 git reset
 rm -rf .js
-npm run clearMultisrc
+npm run clean:multisrc
-npm run generate
+npm run build:multisrc
 npx tsc --project tsconfig.production.json
-npm run json
+npm run build:manifest
 
 if [ ! -d ".dist" ] || [ -z "$(ls -A .dist)" ]; then
     echo "=========="

scripts/download-plugin-icons.js

@@ -43,7 +43,11 @@ const notAvailableImage = fs.readFileSync(
   console.log('Loading plugins.json ⌛');
   const plugin_path = path.join('.dist', 'plugins.json');
   if (!fs.existsSync(plugin_path)) {
-    console.log('❌', plugin_path, 'not found (run "json_plugins.js" first)');
+    console.log(
+      '❌',
+      plugin_path,
+      'not found (run "npm run build:manifest" first)',
+    );
     return;
   }
   const plugins = JSON.parse(fs.readFileSync(plugin_path, 'utf-8'));

scripts/multisrc/lightnovelwp/README.md

@@ -34,7 +34,7 @@ To add a new source you need to add it to sources.json:
 
 ### icon
 
-To add an icon to the source you can just run `npm run icons` to generate all icons (make sure `npm run generate` works on your machine)
+To add an icon to the source you can just run `npm run build:icons` to generate all icons (make sure `npm run build:multisrc` works on your machine)
 
 Or you can manualy find the icon of the site \
 (try the favicon of the site (https://site.com/favicon.ico) most of the times it redirects you to an image named something like "cropped-site-32x32.png" try to access "cropped-site.png" or "site.png" if that did not work you can try to access "https://site.com/wp-json/" at the end of this very long file there should be a "site_icon_url" value

scripts/multisrc/madara/README.md

@@ -29,7 +29,7 @@ To add a new source you need to add it to sources.json:
 
 ### icon
 
-To add an icon to the source you can just run `npm run icons` to generate all icons (make sure `npm run generate` works on your machine)
+To add an icon to the source you can just run `npm run build:icons` to generate all icons (make sure `npm run build:multisrc` works on your machine)
 
 Or you can manualy find the icon of the site \
 (try the favicon of the site (https://site.com/favicon.ico) most of the times it redirects you to an image named something like "cropped-site-32x32.png" try to access "cropped-site.png" or "site.png" if that did not work you can try to access "https://site.com/wp-json/" at the end of this very long file there should be a "site_icon_url" value