Get wasm bundling working

This commit is contained in:
Jonathan Kelley committed 2023-07-08 14:24:01 -07:00
1 parent a4b4252a5a
commit f59cacb2a0
20 files changed
+414 -295

No files matched your search

+1 -1
View File
@@ -25,7 +25,7 @@ fs_extra = "1.2.0"
cargo_toml = "0.11.4"
futures = "0.3.21"
notify = { version = "5.0.0-pre.16", features = ["serde"] }
html_parser = "0.6.2"
html_parser.workspace = true
binary-install = "0.0.2"
convert_case = "0.5.0"
cargo_metadata = "0.15.0"
-20
View File
@@ -1,20 +0,0 @@
/**@type {import('eslint').Linter.Config} */
// eslint-disable-next-line no-undef
module.exports = {
root: true,
parser: '@typescript-eslint/parser',
plugins: [
'@typescript-eslint',
],
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
],
rules: {
'semi': [2, "always"],
'@typescript-eslint/no-unused-vars': 0,
'@typescript-eslint/no-explicit-any': 0,
'@typescript-eslint/explicit-module-boundary-types': 0,
'@typescript-eslint/no-non-null-assertion': 0,
}
};
-13
View File
@@ -1,13 +0,0 @@
.DS_Store
npm-debug.log
Thumbs.db
*/node_modules/
node_modules/
*/out/
out/
*/.vs/
.vs/
tsconfig.lsif.json
*.lsif
*.db
*.vsix
-10
View File
@@ -1,10 +0,0 @@
## packaging
```
$ cd myExtension
$ vsce package
# myExtension.vsix generated
$ vsce publish
# <publisherID>.myExtension published to VS Code Marketplace
```
-21
View File
@@ -1,21 +0,0 @@
MIT License
Copyright (c) 2021 DioxusLabs
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
-14
View File
@@ -1,14 +0,0 @@
# Dioxus VSCode Extension
![Dioxus Logo](https://dioxuslabs.com/guide/images/dioxuslogo_full.png)
This extension wraps functionality in Dioxus CLI to be used in your editor! Make sure the dioxus-cli is installed before using this extension.
## Current commands:
### Convert HTML to RSX
Converts a selection of html to valid rsx.
### Convert HTML to Dioxus Component
Converts a selection of html to a valid Dioxus component with all SVGs factored out into their own module.
-2
View File
@@ -1,2 +0,0 @@
**
!.gitignore
File diff suppressed because it is too large. Load diff
-102
View File
@@ -1,102 +0,0 @@
{
"name": "dioxus",
"displayName": "Dioxus",
"description": "Useful tools for working with Dioxus",
"version": "0.0.1",
"publisher": "DioxusLabs",
"private": true,
"license": "MIT",
"icon": "static/icon.png",
"repository": {
"type": "git",
"url": "https://github.com/DioxusLabs/cli"
},
"engines": {
"vscode": "^1.68.1"
},
"categories": [
"Programming Languages"
],
"activationEvents": [
"onCommand:extension.htmlToDioxusRsx",
"onCommand:extension.htmlToDioxusComponent",
"onCommand:extension.formatRsx",
"onCommand:extension.formatRsxDocument"
],
"main": "./out/main",
"contributes": {
"commands": [
{
"command": "extension.htmlToDioxusRsx",
"title": "Dioxus: Convert HTML to RSX"
},
{
"command": "extension.htmlToDioxusComponent",
"title": "Dioxus: Convert HTML to Component"
},
{
"command": "extension.formatRsx",
"title": "Dioxus: Format RSX"
},
{
"command": "extension.formatRsxDocument",
"title": "Dioxus: Format RSX Document"
}
],
"configuration": {
"properties": {
"dioxus.formatOnSave": {
"type": [
"string"
],
"default": "followFormatOnSave",
"enum": [
"followFormatOnSave",
"enabled",
"disabled"
],
"enumItemLabels": [
"Follow the normal formatOnSave config",
"Enabled",
"Disabled"
],
"enumDescriptions": [
"Only format Rsx when saving files if the editor.formatOnSave config is enabled",
"Always format Rsx when a Rust file is saved",
"Never format Rsx when a file is saved"
],
"description": "Format RSX when a file is saved."
}
}
}
},
"scripts": {
"vscode:prepublish": "npm run build-base -- --minify",
"package": "vsce package -o rust-analyzer.vsix",
"build-base": "esbuild ./src/main.ts --bundle --outfile=out/main.js --external:vscode --format=cjs --platform=node --target=node16",
"build": "npm run build-base -- --sourcemap",
"watch": "npm run build-base -- --sourcemap --watch",
"lint": "prettier --check . && eslint -c .eslintrc.js --ext ts ./src ./tests",
"fix": "prettier --write . && eslint -c .eslintrc.js --ext ts ./src ./tests --fix",
"pretest": "tsc && npm run build",
"test": "cross-env TEST_VARIABLE=test node ./out/tests/runTests.js"
},
"devDependencies": {
"@types/node": "^18.0.2",
"@types/vscode": "^1.68.1",
"@typescript-eslint/eslint-plugin": "^5.30.5",
"@typescript-eslint/parser": "^5.30.5",
"cross-env": "^7.0.3",
"esbuild": "^0.14.27",
"eslint": "^8.19.0",
"typescript": "^4.7.4",
"eslint-config-prettier": "^8.5.0",
"ovsx": "^0.5.1",
"prettier": "^2.6.2",
"tslib": "^2.3.0",
"vsce": "^2.7.0"
},
"dependencies": {
"vsce": "^2.9.2"
}
}
-3
View File
@@ -1,3 +0,0 @@
**
!Readme.md
!.gitignore
-282
View File
@@ -1,282 +0,0 @@
import * as vscode from 'vscode';
import { spawn } from "child_process";
import { TextEncoder } from 'util';
let serverPath: string = "dioxus";
export async function activate(context: vscode.ExtensionContext) {
let somePath = await bootstrap(context);
if (somePath == undefined) {
await vscode.window.showErrorMessage('Could not find bundled Dioxus-CLI. Please install it manually.');
return;
} else {
serverPath = somePath;
}
context.subscriptions.push(
// vscode.commands.registerTextEditorCommand('editor.action.clipboardPasteAction', onPasteHandler),
vscode.commands.registerCommand('extension.htmlToDioxusRsx', translateBlock),
vscode.commands.registerCommand('extension.htmlToDioxusComponent', translateComponent),
vscode.commands.registerCommand('extension.formatRsx', fmtSelection),
vscode.commands.registerCommand('extension.formatRsxDocument', formatRsxDocument),
vscode.workspace.onWillSaveTextDocument(fmtDocumentOnSave)
);
}
function translateComponent() {
translate(true)
}
function translateBlock() {
translate(false)
}
function translate(component: boolean) {
const editor = vscode.window.activeTextEditor;
if (!editor) return;
const html = editor.document.getText(editor.selection);
if (html.length == 0) {
vscode.window.showWarningMessage("Please select HTML fragment before invoking this command!");
return;
}
let params = ["translate"];
if (component) params.push("--component");
params.push("--raw", html);
const child_proc = spawn(serverPath, params);
let result = '';
child_proc.stdout?.on('data', data => result += data);
child_proc.on('close', () => {
if (result.length > 0) editor.edit(editBuilder => editBuilder.replace(editor.selection, result));
});
child_proc.on('error', (err) => {
vscode.window.showWarningMessage(`Errors occurred while translating. Make sure you have the most recent Dioxus-CLI installed! \n${err}`);
});
}
function onPasteHandler() {
// check settings to see if we should convert HTML to Rsx
if (vscode.workspace.getConfiguration('dioxus').get('convertOnPaste')) {
convertHtmlToRsxOnPaste();
}
}
function convertHtmlToRsxOnPaste() {
const editor = vscode.window.activeTextEditor;
if (!editor) return;
// get the cursor location
const cursor = editor.selection.active;
// try to parse the HTML at the cursor location
const html = editor.document.getText(new vscode.Range(cursor, cursor));
}
function formatRsxDocument() {
const editor = vscode.window.activeTextEditor;
if (!editor) return;
fmtDocument(editor.document);
}
function fmtSelection() {
const editor = vscode.window.activeTextEditor;
if (!editor) return;
const unformatted = editor.document.getText(editor.selection);
if (unformatted.length == 0) {
vscode.window.showWarningMessage("Please select rsx invoking this command!");
return;
}
const fileDir = editor.document.fileName.slice(0, editor.document.fileName.lastIndexOf('\\'));
const child_proc = spawn(serverPath, ["fmt", "--raw", unformatted.toString()], {
cwd: fileDir ? fileDir : undefined,
});
let result = '';
child_proc.stdout?.on('data', data => result += data);
child_proc.on('close', () => {
if (result.length > 0) editor.edit(editBuilder => editBuilder.replace(editor.selection, result));
});
child_proc.on('error', (err) => {
vscode.window.showWarningMessage(`Errors occurred while translating. Make sure you have the most recent Dioxus-CLI installed! \n${err}`);
});
}
function fmtDocumentOnSave(e: vscode.TextDocumentWillSaveEvent) {
// check the settings to make sure format on save is configured
const dioxusConfig = vscode.workspace.getConfiguration('dioxus', e.document).get('formatOnSave');
const globalConfig = vscode.workspace.getConfiguration('editor', e.document).get('formatOnSave');
if (
(dioxusConfig === 'enabled') ||
(dioxusConfig !== 'disabled' && globalConfig)
) {
fmtDocument(e.document);
}
}
function fmtDocument(document: vscode.TextDocument) {
try {
if (document.languageId !== "rust" || document.uri.scheme !== "file") {
return;
}
const [editor,] = vscode.window.visibleTextEditors.filter(editor => editor.document.fileName === document.fileName);
if (!editor) return; // Need an editor to apply text edits.
const fileDir = document.fileName.slice(0, document.fileName.lastIndexOf('\\'));
const child_proc = spawn(serverPath, ["fmt", "--file", document.fileName], {
cwd: fileDir ? fileDir : undefined,
});
let result = '';
child_proc.stdout?.on('data', data => result += data);
/*type RsxEdit = {
formatted: string,
start: number,
end: number
}*/
child_proc.on('close', () => {
if (child_proc.exitCode !== 0) {
vscode.window.showWarningMessage(`Errors occurred while formatting. Make sure you have the most recent Dioxus-CLI installed!\nDioxus-CLI exited with exit code ${child_proc.exitCode}\n\nData from Dioxus-CLI:\n${result}`);
return;
}
/*if (result.length === 0) return;
// Used for error message:
const originalResult = result;
try {
// Only parse the last non empty line, to skip log warning messages:
const lines = result.replaceAll('\r\n', '\n').split('\n');
const nonEmptyLines = lines.filter(line => line.trim().length !== 0);
result = nonEmptyLines[nonEmptyLines.length - 1] ?? '';
if (result.length === 0) return;
const decoded: RsxEdit[] = JSON.parse(result);
if (decoded.length === 0) return;
// Preform edits at the end of the file
// first (to not change previous text file
// offsets):
decoded.sort((a, b) => b.start - a.start);
// Convert from utf8 offsets to utf16 offsets used by VS Code:
const utf8Text = new TextEncoder().encode(text);
const utf8ToUtf16Pos = (posUtf8: number) => {
// Find the line of the position as well as the utf8 and
// utf16 indexes for the start of that line:
let startOfLineUtf8 = 0;
let lineIndex = 0;
const newLineUtf8 = '\n'.charCodeAt(0);
// eslint-disable-next-line no-constant-condition
while (true) {
const nextLineAt = utf8Text.indexOf(newLineUtf8, startOfLineUtf8);
if (nextLineAt < 0 || posUtf8 <= nextLineAt) break;
startOfLineUtf8 = nextLineAt + 1;
lineIndex++;
}
const lineUtf16 = document.lineAt(lineIndex);
// Move forward from a synced position in the text until the
// target pos is found:
let currentUtf8 = startOfLineUtf8;
let currentUtf16 = document.offsetAt(lineUtf16.range.start);
const decodeBuffer = new Uint8Array(10);
const utf8Encoder = new TextEncoder();
while (currentUtf8 < posUtf8) {
const { written } = utf8Encoder.encodeInto(text.charAt(currentUtf16), decodeBuffer);
currentUtf8 += written;
currentUtf16++;
}
return currentUtf16;
};
type FixedEdit = {
range: vscode.Range,
formatted: string,
};
const edits: FixedEdit[] = [];
for (const edit of decoded) {
// Convert from utf8 to utf16:
const range = new vscode.Range(
document.positionAt(utf8ToUtf16Pos(edit.start)),
document.positionAt(utf8ToUtf16Pos(edit.end))
);
if (editor.document.getText(range) !== document.getText(range)) {
// The text that was formatted has changed while we were working.
vscode.window.showWarningMessage(`Dioxus formatting was ignored since the source file changed before the change could be applied.`);
continue;
}
edits.push({
range,
formatted: edit.formatted,
});
}
// Apply edits:
editor.edit(editBuilder => {
edits.forEach((edit) => editBuilder.replace(edit.range, edit.formatted));
}, {
undoStopAfter: false,
undoStopBefore: false
});
} catch (err) {
vscode.window.showWarningMessage(`Errors occurred while formatting. Make sure you have the most recent Dioxus-CLI installed!\n${err}\n\nData from Dioxus-CLI:\n${originalResult}`);
}*/
});
child_proc.on('error', (err) => {
vscode.window.showWarningMessage(`Errors occurred while formatting. Make sure you have the most recent Dioxus-CLI installed! \n${err}`);
});
} catch (error) {
vscode.window.showWarningMessage(`Errors occurred while formatting. Make sure you have the most recent Dioxus-CLI installed! \n${error}`);
}
}
// I'm using the approach defined in rust-analyzer here
//
// We ship the server as part of the extension, but we need to handle external paths and such
//
// https://github.com/rust-lang/rust-analyzer/blob/fee5555cfabed4b8abbd40983fc4442df4007e49/editors/code/src/main.ts#L270
async function bootstrap(context: vscode.ExtensionContext): Promise<string | undefined> {
const ext = process.platform === "win32" ? ".exe" : "";
const bundled = vscode.Uri.joinPath(context.extensionUri, "server", `dioxus${ext}`);
const bundledExists = await vscode.workspace.fs.stat(bundled).then(
() => true,
() => false
);
// if bunddled doesn't exist, try using a locally-installed version
if (!bundledExists) {
return "dioxus";
}
return bundled.fsPath;
}
Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

-12
View File
@@ -1,12 +0,0 @@
{
"compilerOptions": {
"module": "commonjs",
"target": "es2021",
"lib": ["ES2021"],
"outDir": "out",
"sourceMap": true,
"strict": true,
"rootDir": "src"
},
"exclude": ["node_modules", ".vscode-test"]
}