Migrate build system from Webpack to Parcel (#1102)

* Migrate webpack to parcel

* Always colour shell output

* Fix typos

* Fix updateImage function having undefined editorInstance

* Readd webpack for deployment builds (licence checker)

* Only use webpack for license generation

* Re add typscript support

* Fix cloudlare deploy

* Bump wasm-pack version

* Update ci script

* Print versions in ci script

* Use optional-dependencies for wasm-pack

* Execute wget after rust install

* Finding wasm-opt version

* Print wasm-opt version

* Revert test?

* Try to revert

* Deploy cloudflare via github actions

* Fix indentation in ci script

* Change project to graphite-dev

* Trigger ci

* Parcel ci (#1152)

* CI Test

* Add write permissions for pr

* Manually add cloudflare ci comment to prs

* Unskip cargo about

* Make compile on new versions of npm

* Add deployment script to rebuild editor.graphite.rs on tag creation

* Remove deploy script

* Comment out unused Svelte props causing warnings

* Many small fixes, including fixing @ imports

---------

Co-authored-by: hypercube <0hypercube@gmail.com>
Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
Dennis Kobert
2023-04-25 00:43:27 +02:00
committed by GitHub
co-authored by hypercube Keavon Chambers
parent b0a3632868
commit 1180b19284
29 changed files with 4532 additions and 7616 deletions
+16 -18
View File
@@ -1,15 +1,15 @@
import type WasmBindgenPackage from "@graphite/../wasm/pkg";
import type WasmBindgenPackage from "@graphite-frontend/wasm/pkg";
import init, { setRandomSeed, wasmMemory, JsEditorHandle } from "@graphite-frontend/wasm/pkg/graphite_wasm.js";
import { panicProxy } from "@graphite/utility-functions/panic-proxy";
import { type JsMessageType } from "@graphite/wasm-communication/messages";
import { createSubscriptionRouter, type SubscriptionRouter } from "@graphite/wasm-communication/subscription-router";
export type WasmRawInstance = typeof WasmBindgenPackage;
export type WasmEditorInstance = InstanceType<WasmRawInstance["JsEditorHandle"]>;
export type WasmRawInstance = WebAssembly.Memory;
export type WasmEditorInstance = JsEditorHandle;
export type Editor = Readonly<ReturnType<typeof createEditor>>;
// `wasmImport` starts uninitialized because its initialization needs to occur asynchronously, and thus needs to occur by manually calling and awaiting `initWasm()`
let wasmImport: WasmRawInstance | undefined;
let editorInstance: WasmEditorInstance | undefined;
let wasmImport: WebAssembly.Memory | undefined;
export async function updateImage(path: BigUint64Array, mime: string, imageData: Uint8Array, transform: Float64Array, documentId: bigint): Promise<void> {
const blob = new Blob([imageData], { type: mime });
@@ -21,7 +21,7 @@ export async function updateImage(path: BigUint64Array, mime: string, imageData:
image.src = blobURL;
await image.decode();
editorInstance?.setImageBlobURL(documentId, path, blobURL, image.naturalWidth, image.naturalHeight,transform);
window["editorInstance"]?.setImageBlobURL(documentId, path, blobURL, image.naturalWidth, image.naturalHeight, transform);
}
export async function fetchImage(path: BigUint64Array, mime: string, documentId: bigint, url: string): Promise<void> {
@@ -35,7 +35,7 @@ export async function fetchImage(path: BigUint64Array, mime: string, documentId:
image.src = blobURL;
await image.decode();
editorInstance?.setImageBlobURL(documentId, path, blobURL, image.naturalWidth, image.naturalHeight, undefined);
window["editorInstance"]?.setImageBlobURL(documentId, path, blobURL, image.naturalWidth, image.naturalHeight, undefined);
}
const tauri = "__TAURI_METADATA__" in window && import("@tauri-apps/api");
@@ -44,7 +44,7 @@ export async function dispatchTauri(message: unknown): Promise<void> {
try {
const response = await (await tauri).invoke("handle_message", { message });
editorInstance?.tauriResponse(response);
window["editorInstance"]?.tauriResponse(response);
} catch {
// eslint-disable-next-line no-console
console.error("Failed to dispatch Tauri message");
@@ -58,18 +58,16 @@ export async function initWasm(): Promise<void> {
// Import the WASM module JS bindings and wrap them in the panic proxy
// eslint-disable-next-line import/no-cycle
wasmImport = await import("@graphite/../wasm/pkg");
await init();
wasmImport = await wasmMemory();
// Provide a random starter seed which must occur after initializing the WASM module, since WASM can't generate its own random numbers
const randomSeedFloat = Math.floor(Math.random() * Number.MAX_SAFE_INTEGER);
const randomSeed = BigInt(randomSeedFloat);
wasmImport?.setRandomSeed(randomSeed);
// TODO: Tauri: reenable this
// try {
// await invoke("set_random_seed", { seed: randomSeedFloat });
// } catch {
// // Ignore errors
// }
setRandomSeed(randomSeed);
if (!tauri) return;
await (await tauri).invoke("set_random_seed", { seed: randomSeedFloat });
}
// Should be called after running `initWasm()` and its promise resolving
@@ -80,12 +78,12 @@ export function createEditor() {
const raw: WasmRawInstance = wasmImport;
// Instance: Object containing many functions from `editor_api.rs` that are part of the editor instance (generated by wasm-bindgen)
const instance: WasmEditorInstance = new raw.JsEditorHandle((messageType: JsMessageType, messageData: Record<string, unknown>): void => {
const instance: WasmEditorInstance = new JsEditorHandle((messageType: JsMessageType, messageData: Record<string, unknown>): void => {
// This callback is called by WASM when a FrontendMessage is received from the WASM wrapper editor instance
// We pass along the first two arguments then add our own `raw` and `instance` context for the last two arguments
subscriptions.handleJsMessage(messageType, messageData, raw, instance);
});
editorInstance = instance;
window["editorInstance"] = instance;
// Subscriptions: Allows subscribing to messages in JS that are sent from the WASM backend
const subscriptions: SubscriptionRouter = createSubscriptionRouter();
+23 -23
View File
@@ -506,15 +506,15 @@ export class TriggerFileDownload extends JsMessage {
readonly name!: string;
}
export class TriggerLoadAutoSaveDocuments extends JsMessage {}
export class TriggerLoadAutoSaveDocuments extends JsMessage { }
export class TriggerLoadPreferences extends JsMessage {}
export class TriggerLoadPreferences extends JsMessage { }
export class TriggerOpenDocument extends JsMessage {}
export class TriggerOpenDocument extends JsMessage { }
export class TriggerImport extends JsMessage {}
export class TriggerImport extends JsMessage { }
export class TriggerPaste extends JsMessage {}
export class TriggerPaste extends JsMessage { }
export class TriggerRasterDownload extends JsMessage {
readonly svg!: string;
@@ -618,7 +618,7 @@ export class TriggerNodeGraphFrameGenerate extends JsMessage {
readonly imaginateNode!: BigUint64Array | undefined;
}
export class TriggerRefreshBoundsOfViewports extends JsMessage {}
export class TriggerRefreshBoundsOfViewports extends JsMessage { }
export class TriggerRevokeBlobUrl extends JsMessage {
readonly url!: string;
@@ -628,7 +628,7 @@ export class TriggerSavePreferences extends JsMessage {
readonly preferences!: Record<string, unknown>;
}
export class DocumentChanged extends JsMessage {}
export class DocumentChanged extends JsMessage { }
export class UpdateDocumentLayerTreeStructureJs extends JsMessage {
constructor(readonly layerId: bigint, readonly children: UpdateDocumentLayerTreeStructureJs[]) {
@@ -645,7 +645,7 @@ export function newUpdateDocumentLayerTreeStructure(input: { dataBuffer: DataBuf
const pointerNum = Number(input.dataBuffer.pointer);
const lengthNum = Number(input.dataBuffer.length);
const wasmMemoryBuffer = wasm.wasmMemory().buffer;
const wasmMemoryBuffer = wasm.buffer;
// Decode the folder structure encoding
const encoding = new DataView(wasmMemoryBuffer, pointerNum, lengthNum);
@@ -713,7 +713,7 @@ export class UpdateImageData extends JsMessage {
readonly imageData!: ImaginateImageData[];
}
export class DisplayRemoveEditableTextbox extends JsMessage {}
export class DisplayRemoveEditableTextbox extends JsMessage { }
export class UpdateDocumentLayerDetails extends JsMessage {
@Type(() => LayerPanelEntry)
@@ -772,7 +772,7 @@ export class ImaginateImageData {
readonly transform!: Float64Array ;
}
export class DisplayDialogDismiss extends JsMessage {}
export class DisplayDialogDismiss extends JsMessage { }
export class Font {
fontFamily!: string;
@@ -791,7 +791,7 @@ export class TriggerVisitLink extends JsMessage {
url!: string;
}
export class TriggerTextCommit extends JsMessage {}
export class TriggerTextCommit extends JsMessage { }
export class TriggerTextCopy extends JsMessage {
readonly copyText!: string;
@@ -801,7 +801,7 @@ export class TriggerAboutGraphiteLocalizedCommitDate extends JsMessage {
readonly commitDate!: string;
}
export class TriggerViewportResize extends JsMessage {}
export class TriggerViewportResize extends JsMessage { }
// WIDGET PROPS
@@ -1145,7 +1145,7 @@ export class PivotAssist extends WidgetProps {
// WIDGET
const widgetSubTypes = [
{ value: BreadcrumbTrailButtons, name: "BreadcrumbTrailButtons"},
{ value: BreadcrumbTrailButtons, name: "BreadcrumbTrailButtons" },
{ value: CheckboxInput, name: "CheckboxInput" },
{ value: ColorInput, name: "ColorInput" },
{ value: DropdownInput, name: "DropdownInput" },
@@ -1327,25 +1327,25 @@ function createLayoutGroup(layoutGroup: any): LayoutGroup {
}
// WIDGET LAYOUTS
export class UpdateDialogDetails extends WidgetDiffUpdate {}
export class UpdateDialogDetails extends WidgetDiffUpdate { }
export class UpdateDocumentModeLayout extends WidgetDiffUpdate {}
export class UpdateDocumentModeLayout extends WidgetDiffUpdate { }
export class UpdateToolOptionsLayout extends WidgetDiffUpdate {}
export class UpdateToolOptionsLayout extends WidgetDiffUpdate { }
export class UpdateDocumentBarLayout extends WidgetDiffUpdate {}
export class UpdateDocumentBarLayout extends WidgetDiffUpdate { }
export class UpdateToolShelfLayout extends WidgetDiffUpdate {}
export class UpdateToolShelfLayout extends WidgetDiffUpdate { }
export class UpdateWorkingColorsLayout extends WidgetDiffUpdate {}
export class UpdateWorkingColorsLayout extends WidgetDiffUpdate { }
export class UpdatePropertyPanelOptionsLayout extends WidgetDiffUpdate {}
export class UpdatePropertyPanelOptionsLayout extends WidgetDiffUpdate { }
export class UpdatePropertyPanelSectionsLayout extends WidgetDiffUpdate {}
export class UpdatePropertyPanelSectionsLayout extends WidgetDiffUpdate { }
export class UpdateLayerTreeOptionsLayout extends WidgetDiffUpdate {}
export class UpdateLayerTreeOptionsLayout extends WidgetDiffUpdate { }
export class UpdateNodeGraphBarLayout extends WidgetDiffUpdate {}
export class UpdateNodeGraphBarLayout extends WidgetDiffUpdate { }
export class UpdateMenuBarLayout extends JsMessage {
layoutTarget!: unknown;