Optimise Web via treeshaking, cleanup build scripts
This commit is contained in:
Vendicated
parent
845088ec02
commit
01ae0983b3
124
build.mjs
124
build.mjs
@ -1,124 +0,0 @@
|
||||
#!/usr/bin/node
|
||||
import { execSync } from "child_process";
|
||||
import esbuild from "esbuild";
|
||||
import { readdirSync } from "fs";
|
||||
|
||||
/**
|
||||
* @type {esbuild.WatchMode|false}
|
||||
*/
|
||||
const watch = process.argv.includes("--watch");
|
||||
|
||||
// https://github.com/evanw/esbuild/issues/619#issuecomment-751995294
|
||||
/**
|
||||
* @type {esbuild.Plugin}
|
||||
*/
|
||||
const makeAllPackagesExternalPlugin = {
|
||||
name: "make-all-packages-external",
|
||||
setup(build) {
|
||||
let filter = /^[^.\/]|^\.[^.\/]|^\.\.[^\/]/; // Must not start with "/" or "./" or "../"
|
||||
build.onResolve({ filter }, args => ({ path: args.path, external: true }));
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {esbuild.Plugin}
|
||||
*/
|
||||
const globPlugins = {
|
||||
name: "glob-plugins",
|
||||
setup: build => {
|
||||
build.onResolve({ filter: /^plugins$/ }, args => {
|
||||
return {
|
||||
namespace: "import-plugins",
|
||||
path: args.path
|
||||
};
|
||||
});
|
||||
|
||||
build.onLoad({ filter: /^plugins$/, namespace: "import-plugins" }, () => {
|
||||
const files = readdirSync("./src/plugins");
|
||||
let code = "";
|
||||
let obj = "";
|
||||
for (let i = 0; i < files.length; i++) {
|
||||
if (files[i] === "index.ts") {
|
||||
continue;
|
||||
}
|
||||
const mod = `__pluginMod${i}`;
|
||||
code += `import ${mod} from "./${files[i].replace(/.tsx?$/, "")}";\n`;
|
||||
obj += `[${mod}.name]: ${mod},`;
|
||||
}
|
||||
code += `export default {${obj}}`;
|
||||
return {
|
||||
contents: code,
|
||||
resolveDir: "./src/plugins"
|
||||
};
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const gitHash = execSync("git rev-parse --short HEAD", { encoding: "utf-8" }).trim();
|
||||
/**
|
||||
* @type {esbuild.Plugin}
|
||||
*/
|
||||
const gitHashPlugin = {
|
||||
name: "git-hash-plugin",
|
||||
setup: build => {
|
||||
const filter = /^git-hash$/;
|
||||
build.onResolve({ filter }, args => ({
|
||||
namespace: "git-hash", path: args.path
|
||||
}));
|
||||
build.onLoad({ filter, namespace: "git-hash" }, () => ({
|
||||
contents: `export default "${gitHash}"`
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
await Promise.all([
|
||||
esbuild.build({
|
||||
logLevel: "info",
|
||||
entryPoints: ["src/preload.ts"],
|
||||
outfile: "dist/preload.js",
|
||||
format: "cjs",
|
||||
bundle: true,
|
||||
platform: "node",
|
||||
target: ["esnext"],
|
||||
sourcemap: "linked",
|
||||
plugins: [makeAllPackagesExternalPlugin],
|
||||
watch
|
||||
}),
|
||||
esbuild.build({
|
||||
logLevel: "info",
|
||||
entryPoints: ["src/patcher.ts"],
|
||||
outfile: "dist/patcher.js",
|
||||
bundle: true,
|
||||
format: "cjs",
|
||||
target: ["esnext"],
|
||||
external: ["electron"],
|
||||
platform: "node",
|
||||
sourcemap: "linked",
|
||||
plugins: [makeAllPackagesExternalPlugin],
|
||||
watch
|
||||
}),
|
||||
esbuild.build({
|
||||
logLevel: "info",
|
||||
entryPoints: ["src/Vencord.ts"],
|
||||
outfile: "dist/renderer.js",
|
||||
format: "iife",
|
||||
bundle: true,
|
||||
target: ["esnext"],
|
||||
footer: { js: "//# sourceURL=VencordRenderer" },
|
||||
globalName: "Vencord",
|
||||
external: ["plugins", "git-hash"],
|
||||
plugins: [
|
||||
globPlugins,
|
||||
gitHashPlugin
|
||||
],
|
||||
sourcemap: false,
|
||||
watch,
|
||||
minify: true,
|
||||
}),
|
||||
]).catch(err => {
|
||||
console.error("Build failed");
|
||||
console.error(err.message);
|
||||
// make ci fail
|
||||
if (!watch)
|
||||
process.exitCode = 1;
|
||||
});
|
||||
110
buildWeb.mjs
110
buildWeb.mjs
@ -1,110 +0,0 @@
|
||||
// TODO: Modularise the plugins since both build scripts use them
|
||||
|
||||
import { execSync } from "child_process";
|
||||
import { createWriteStream, readdirSync, readFileSync } from "fs";
|
||||
import yazl from "yazl";
|
||||
import esbuild from "esbuild";
|
||||
// wtf is this assert syntax
|
||||
import PackageJSON from "./package.json" assert { type: "json" };
|
||||
|
||||
/**
|
||||
* @type {esbuild.Plugin}
|
||||
*/
|
||||
const globPlugins = {
|
||||
name: "glob-plugins",
|
||||
setup: build => {
|
||||
build.onResolve({ filter: /^plugins$/ }, args => {
|
||||
return {
|
||||
namespace: "import-plugins",
|
||||
path: args.path
|
||||
};
|
||||
});
|
||||
|
||||
build.onLoad({ filter: /^plugins$/, namespace: "import-plugins" }, () => {
|
||||
const files = readdirSync("./src/plugins");
|
||||
let code = "";
|
||||
let obj = "";
|
||||
for (let i = 0; i < files.length; i++) {
|
||||
if (files[i] === "index.ts") {
|
||||
continue;
|
||||
}
|
||||
const mod = `__pluginMod${i}`;
|
||||
code += `import ${mod} from "./${files[i].replace(/.tsx?$/, "")}";\n`;
|
||||
obj += `[${mod}.name]: ${mod},`;
|
||||
}
|
||||
code += `export default {${obj}}`;
|
||||
return {
|
||||
contents: code,
|
||||
resolveDir: "./src/plugins"
|
||||
};
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const gitHash = execSync("git rev-parse --short HEAD", { encoding: "utf-8" }).trim();
|
||||
/**
|
||||
* @type {esbuild.Plugin}
|
||||
*/
|
||||
const gitHashPlugin = {
|
||||
name: "git-hash-plugin",
|
||||
setup: build => {
|
||||
const filter = /^git-hash$/;
|
||||
build.onResolve({ filter }, args => ({
|
||||
namespace: "git-hash", path: args.path
|
||||
}));
|
||||
build.onLoad({ filter, namespace: "git-hash" }, () => ({
|
||||
contents: `export default "${gitHash}"`
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {esbuild.BuildOptions}
|
||||
*/
|
||||
const commonOptions = {
|
||||
logLevel: "info",
|
||||
entryPoints: ["browser/Vencord.ts"],
|
||||
globalName: "Vencord",
|
||||
format: "iife",
|
||||
bundle: true,
|
||||
minify: true,
|
||||
sourcemap: false,
|
||||
external: ["plugins", "git-hash"],
|
||||
plugins: [
|
||||
globPlugins,
|
||||
gitHashPlugin
|
||||
],
|
||||
target: ["esnext"],
|
||||
};
|
||||
|
||||
await Promise.all(
|
||||
[
|
||||
esbuild.build({
|
||||
...commonOptions,
|
||||
outfile: "dist/browser.js",
|
||||
footer: { js: "//# sourceURL=VencordWeb" },
|
||||
}),
|
||||
esbuild.build({
|
||||
...commonOptions,
|
||||
outfile: "dist/Vencord.user.js",
|
||||
banner: {
|
||||
js: readFileSync("browser/userscript.meta.js", "utf-8").replace("%version%", PackageJSON.version)
|
||||
},
|
||||
footer: {
|
||||
// UserScripts get wrapped in an iife, so define Vencord prop on window that returns our local
|
||||
js: "Object.defineProperty(window,'Vencord',{get:()=>Vencord});"
|
||||
},
|
||||
})
|
||||
]
|
||||
);
|
||||
|
||||
const zip = new yazl.ZipFile();
|
||||
zip.outputStream.pipe(createWriteStream("dist/extension.zip")).on("close", () => {
|
||||
console.info("Extension written to dist/extension.zip");
|
||||
});
|
||||
|
||||
zip.addFile("dist/browser.js", "dist/Vencord.js");
|
||||
["background.js", "content.js", "manifest.json"].forEach(f => {
|
||||
zip.addFile(`browser/${f}`, `${f}`);
|
||||
});
|
||||
zip.end();
|
||||
@ -18,15 +18,15 @@
|
||||
"doc": "docs"
|
||||
},
|
||||
"scripts": {
|
||||
"build": "node build.mjs",
|
||||
"buildWeb": "node --require=./scripts/suppressExperimentalWarnings.js buildWeb.mjs",
|
||||
"build": "node scripts/build/build.mjs",
|
||||
"buildWeb": "node --require=./scripts/suppressExperimentalWarnings.js scripts/build/buildWeb.mjs",
|
||||
"inject": "node scripts/patcher/install.js",
|
||||
"lint": "eslint . --ext .js,.jsx,.ts,.tsx",
|
||||
"lint:fix": "pnpm lint --fix",
|
||||
"test": "pnpm lint && pnpm build && pnpm testTsc",
|
||||
"testTsc": "tsc --noEmit",
|
||||
"uninject": "node scripts/patcher/uninstall.js",
|
||||
"watch": "node build.mjs --watch"
|
||||
"watch": "node scripts/build/build.mjs --watch"
|
||||
},
|
||||
"dependencies": {
|
||||
"console-menu": "^0.1.0",
|
||||
|
||||
53
scripts/build/build.mjs
Executable file
53
scripts/build/build.mjs
Executable file
@ -0,0 +1,53 @@
|
||||
#!/usr/bin/node
|
||||
import esbuild from "esbuild";
|
||||
import { commonOpts, gitHashPlugin, globPlugins, makeAllPackagesExternalPlugin } from "./common.mjs";
|
||||
|
||||
/**
|
||||
* @type {esbuild.BuildOptions}
|
||||
*/
|
||||
const nodeCommonOpts = {
|
||||
...commonOpts,
|
||||
format: "cjs",
|
||||
platform: "node",
|
||||
target: ["esnext"],
|
||||
sourcemap: "linked",
|
||||
plugins: [makeAllPackagesExternalPlugin],
|
||||
};
|
||||
|
||||
await Promise.all([
|
||||
esbuild.build({
|
||||
...nodeCommonOpts,
|
||||
entryPoints: ["src/preload.ts"],
|
||||
outfile: "dist/preload.js",
|
||||
}),
|
||||
esbuild.build({
|
||||
...nodeCommonOpts,
|
||||
entryPoints: ["src/patcher.ts"],
|
||||
outfile: "dist/patcher.js",
|
||||
}),
|
||||
esbuild.build({
|
||||
...commonOpts,
|
||||
entryPoints: ["src/Vencord.ts"],
|
||||
outfile: "dist/renderer.js",
|
||||
format: "iife",
|
||||
target: ["esnext"],
|
||||
footer: { js: "//# sourceURL=VencordRenderer" },
|
||||
globalName: "Vencord",
|
||||
external: ["plugins", "git-hash"],
|
||||
plugins: [
|
||||
globPlugins,
|
||||
gitHashPlugin
|
||||
],
|
||||
sourcemap: "inline",
|
||||
minify: true,
|
||||
define: {
|
||||
IS_WEB: "false"
|
||||
}
|
||||
}),
|
||||
]).catch(err => {
|
||||
console.error("Build failed");
|
||||
console.error(err.message);
|
||||
// make ci fail
|
||||
if (!watch)
|
||||
process.exitCode = 1;
|
||||
});
|
||||
61
scripts/build/buildWeb.mjs
Normal file
61
scripts/build/buildWeb.mjs
Normal file
@ -0,0 +1,61 @@
|
||||
// TODO: Modularise the plugins since both build scripts use them
|
||||
|
||||
import { createWriteStream, readFileSync } from "fs";
|
||||
import yazl from "yazl";
|
||||
import esbuild from "esbuild";
|
||||
// wtf is this assert syntax
|
||||
import PackageJSON from "../../package.json" assert { type: "json" };
|
||||
import { commonOpts, gitHashPlugin, globPlugins } from "./common.mjs";
|
||||
|
||||
/**
|
||||
* @type {esbuild.BuildOptions}
|
||||
*/
|
||||
const commonOptions = {
|
||||
...commonOpts,
|
||||
entryPoints: ["browser/Vencord.ts"],
|
||||
globalName: "Vencord",
|
||||
format: "iife",
|
||||
minify: true,
|
||||
sourcemap: false,
|
||||
external: ["plugins", "git-hash"],
|
||||
plugins: [
|
||||
globPlugins,
|
||||
gitHashPlugin
|
||||
],
|
||||
target: ["esnext"],
|
||||
define: {
|
||||
IS_WEB: "true"
|
||||
}
|
||||
};
|
||||
|
||||
await Promise.all(
|
||||
[
|
||||
esbuild.build({
|
||||
...commonOptions,
|
||||
outfile: "dist/browser.js",
|
||||
footer: { js: "//# sourceURL=VencordWeb" },
|
||||
}),
|
||||
esbuild.build({
|
||||
...commonOptions,
|
||||
outfile: "dist/Vencord.user.js",
|
||||
banner: {
|
||||
js: readFileSync("browser/userscript.meta.js", "utf-8").replace("%version%", PackageJSON.version)
|
||||
},
|
||||
footer: {
|
||||
// UserScripts get wrapped in an iife, so define Vencord prop on window that returns our local
|
||||
js: "Object.defineProperty(window,'Vencord',{get:()=>Vencord});"
|
||||
},
|
||||
})
|
||||
]
|
||||
);
|
||||
|
||||
const zip = new yazl.ZipFile();
|
||||
zip.outputStream.pipe(createWriteStream("dist/extension.zip")).on("close", () => {
|
||||
console.info("Extension written to dist/extension.zip");
|
||||
});
|
||||
|
||||
zip.addFile("dist/browser.js", "dist/Vencord.js");
|
||||
["background.js", "content.js", "manifest.json"].forEach(f => {
|
||||
zip.addFile(`browser/${f}`, `${f}`);
|
||||
});
|
||||
zip.end();
|
||||
80
scripts/build/common.mjs
Normal file
80
scripts/build/common.mjs
Normal file
@ -0,0 +1,80 @@
|
||||
import { execSync } from "child_process";
|
||||
import esbuild from "esbuild";
|
||||
import { readdir } from "fs/promises";
|
||||
|
||||
/**
|
||||
* @type {esbuild.WatchMode|false}
|
||||
*/
|
||||
export const watch = process.argv.includes("--watch");
|
||||
|
||||
/**
|
||||
* @type {esbuild.BuildOptions}
|
||||
*/
|
||||
export const commonOpts = {
|
||||
logLevel: "info",
|
||||
bundle: true,
|
||||
watch
|
||||
};
|
||||
|
||||
// https://github.com/evanw/esbuild/issues/619#issuecomment-751995294
|
||||
/**
|
||||
* @type {esbuild.Plugin}
|
||||
*/
|
||||
export const makeAllPackagesExternalPlugin = {
|
||||
name: "make-all-packages-external",
|
||||
setup(build) {
|
||||
let filter = /^[^.\/]|^\.[^.\/]|^\.\.[^\/]/; // Must not start with "/" or "./" or "../"
|
||||
build.onResolve({ filter }, args => ({ path: args.path, external: true }));
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {esbuild.Plugin}
|
||||
*/
|
||||
export const globPlugins = {
|
||||
name: "glob-plugins",
|
||||
setup: build => {
|
||||
build.onResolve({ filter: /^plugins$/ }, args => {
|
||||
return {
|
||||
namespace: "import-plugins",
|
||||
path: args.path
|
||||
};
|
||||
});
|
||||
|
||||
build.onLoad({ filter: /^plugins$/, namespace: "import-plugins" }, async () => {
|
||||
const files = await readdir("./src/plugins");
|
||||
let code = "";
|
||||
let plugins = "\n";
|
||||
for (let i = 0; i < files.length; i++) {
|
||||
if (files[i] === "index.ts") {
|
||||
continue;
|
||||
}
|
||||
const mod = `p${i}`;
|
||||
code += `import ${mod} from "./${files[i].replace(/.tsx?$/, "")}";\n`;
|
||||
plugins += `[${mod}.name]:${mod},\n`;
|
||||
}
|
||||
code += `export default {${plugins}};`;
|
||||
return {
|
||||
contents: code,
|
||||
resolveDir: "./src/plugins"
|
||||
};
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const gitHash = execSync("git rev-parse --short HEAD", { encoding: "utf-8" }).trim();
|
||||
/**
|
||||
* @type {esbuild.Plugin}
|
||||
*/
|
||||
export const gitHashPlugin = {
|
||||
name: "git-hash-plugin",
|
||||
setup: build => {
|
||||
const filter = /^git-hash$/;
|
||||
build.onResolve({ filter }, args => ({
|
||||
namespace: "git-hash", path: args.path
|
||||
}));
|
||||
build.onLoad({ filter, namespace: "git-hash" }, () => ({
|
||||
contents: `export default "${gitHash}"`
|
||||
}));
|
||||
}
|
||||
};
|
||||
@ -17,12 +17,6 @@ import { checkForUpdates, UpdateLogger } from "./utils/updater";
|
||||
import { onceReady } from "./webpack";
|
||||
import { Router } from "./webpack/common";
|
||||
|
||||
Object.defineProperty(window, "IS_WEB", {
|
||||
get: () => !window.DiscordNative,
|
||||
configurable: true,
|
||||
enumerable: true
|
||||
});
|
||||
|
||||
export let Components: any;
|
||||
|
||||
async function init() {
|
||||
@ -30,6 +24,7 @@ async function init() {
|
||||
startAllPlugins();
|
||||
Components = await import("./components");
|
||||
|
||||
if (!IS_WEB) {
|
||||
try {
|
||||
const isOutdated = await checkForUpdates();
|
||||
if (isOutdated && Settings.notifyAboutUpdates)
|
||||
@ -47,5 +42,6 @@ async function init() {
|
||||
UpdateLogger.error("Failed to check for updates", err);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
init();
|
||||
|
||||
@ -72,7 +72,7 @@ export default ErrorBoundary.wrap(function Settings() {
|
||||
SettingsDir: <code style={{ userSelect: "text", cursor: "text" }}>{settingsDir}</code>
|
||||
</Forms.FormText>
|
||||
|
||||
{!IS_WEB && <Flex className={classes(Margins.marginBottom20)}>
|
||||
{!IS_WEB && <Flex className={Margins.marginBottom20}>
|
||||
<Button
|
||||
onClick={() => window.DiscordNative.app.relaunch()}
|
||||
size={Button.Sizes.SMALL}
|
||||
@ -95,8 +95,8 @@ export default ErrorBoundary.wrap(function Settings() {
|
||||
Open QuickCSS File
|
||||
</Button>
|
||||
</Flex>}
|
||||
|
||||
<Forms.FormDivider />
|
||||
<Forms.FormTitle tag="h5">Settings</Forms.FormTitle>
|
||||
<Switch
|
||||
value={settings.useQuickCss}
|
||||
onChange={(v: boolean) => settings.useQuickCss = v}
|
||||
|
||||
@ -158,7 +158,7 @@ function Newer(props: CommonProps) {
|
||||
);
|
||||
}
|
||||
|
||||
export default ErrorBoundary.wrap(function Updater() {
|
||||
function Updater() {
|
||||
const [repo, err, repoPending] = useAwaiter(getRepo, "Loading...");
|
||||
|
||||
React.useEffect(() => {
|
||||
@ -188,4 +188,6 @@ export default ErrorBoundary.wrap(function Updater() {
|
||||
{isNewer ? <Newer {...commonProps} /> : <Updatable {...commonProps} />}
|
||||
</Forms.FormSection >
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
export default IS_WEB ? null : ErrorBoundary.wrap(Updater);
|
||||
|
||||
20
src/globals.d.ts
vendored
20
src/globals.d.ts
vendored
@ -1,10 +1,30 @@
|
||||
declare global {
|
||||
/**
|
||||
* This exists only at build time, so references to it in patches should insert it
|
||||
* via String interpolation OR use different replacement code based on this
|
||||
* but NEVER refrence it inside the patched code
|
||||
*
|
||||
* @example
|
||||
* // BAD
|
||||
* replace: "IS_WEB?foo:bar"
|
||||
* // GOOD
|
||||
* replace: IS_WEB ? "foo" : "bar"
|
||||
* // also good
|
||||
* replace: `${IS_WEB}?foo:bar`
|
||||
*/
|
||||
export var IS_WEB: boolean;
|
||||
export var VencordNative: typeof import("./VencordNative").default;
|
||||
export var Vencord: typeof import("./Vencord");
|
||||
export var appSettings: {
|
||||
set(setting: string, v: any): void;
|
||||
};
|
||||
/**
|
||||
* Only available when running in Electron, undefined on web.
|
||||
* Thus, avoid using this or only use it inside an {@link IS_WEB} guard.
|
||||
*
|
||||
* If you really must use it, mark your plugin as Desktop App only via
|
||||
* `target: "DESKTOP"`
|
||||
*/
|
||||
export var DiscordNative: any;
|
||||
|
||||
interface Window {
|
||||
|
||||
@ -18,7 +18,16 @@ export default definePlugin({
|
||||
],
|
||||
|
||||
copyToClipBoard(color: string) {
|
||||
window.DiscordNative.clipboard.copy(color);
|
||||
if (IS_WEB) {
|
||||
navigator.clipboard.writeText(color)
|
||||
.then(() => this.notifySuccess);
|
||||
} else {
|
||||
DiscordNative.clipboard.copy(color);
|
||||
this.notifySuccess();
|
||||
}
|
||||
},
|
||||
|
||||
notifySuccess() {
|
||||
Toasts.show({
|
||||
message: "Copied to Clipboard!",
|
||||
type: Toasts.Type.SUCCESS,
|
||||
|
||||
@ -5,6 +5,7 @@ export default definePlugin({
|
||||
name: "No RPC",
|
||||
description: "Disables Discord's RPC server.",
|
||||
authors: [Devs.Cyn],
|
||||
target: "DESKTOP",
|
||||
patches: [
|
||||
{
|
||||
find: '.ensureModule("discord_rpc")',
|
||||
|
||||
@ -5,6 +5,7 @@ export default definePlugin({
|
||||
name: "NoSystemBadge",
|
||||
description: "Disables the taskbar and system tray unread count badge.",
|
||||
authors: [Devs.rushii],
|
||||
target: "DESKTOP",
|
||||
patches: [
|
||||
{
|
||||
find: "setSystemTrayApplications:function",
|
||||
|
||||
@ -28,12 +28,15 @@ export default definePlugin({
|
||||
find: "Messages.ACTIVITY_SETTINGS",
|
||||
replacement: {
|
||||
match: /\{section:(.{1,2})\.ID\.HEADER,\s*label:(.{1,2})\..{1,2}\.Messages\.ACTIVITY_SETTINGS\}/,
|
||||
replace: (m, mod) =>
|
||||
replace: (m, mod) => {
|
||||
const updater = !IS_WEB ? '{section:"VencordUpdater",label:"Updater",element:Vencord.Components.Updater},' : "";
|
||||
return (
|
||||
`{section:${mod}.ID.HEADER,label:"Vencord"},` +
|
||||
'{section:"VencordSetting",label:"Vencord",element:Vencord.Components.Settings},' +
|
||||
'{section:"VencordUpdater",label:"Updater",element:Vencord.Components.Updater,predicate:()=>!IS_WEB},' +
|
||||
updater +
|
||||
`{section:${mod}.ID.DIVIDER},${m}`
|
||||
|
||||
);
|
||||
}
|
||||
}
|
||||
}]
|
||||
});
|
||||
|
||||
Loading…
Reference in New Issue
Block a user