diff --git a/packages/vscode-ext/.gitignore b/packages/vscode-ext/.gitignore
index 2d1b51da..c712b96a 100644
--- a/packages/vscode-ext/.gitignore
+++ b/packages/vscode-ext/.gitignore
@@ -1,3 +1,3 @@
-/media/components.css
-/media/components-bundle.js
+/media/vendor
/out
+/*.vsix
diff --git a/packages/vscode-ext/package.json b/packages/vscode-ext/package.json
index 02305dee..a39258ed 100644
--- a/packages/vscode-ext/package.json
+++ b/packages/vscode-ext/package.json
@@ -30,11 +30,12 @@
},
"scripts": {
"vscode:prepublish": "yarn run compile",
- "compile": "tsc -p ./ && (cd ../components && yarn all) && cp ../components/dist/bundle.js media/components-bundle.js && cp ../components/dist/main.css media/components.css",
+ "compile:tsc": "tsc -p ./",
+ "compile:vendor": "(cd ../components && yarn run build) && mkdir -p media/vendor && cp ../components/dist/bundle.js media/vendor/components.js && cp ../components/dist/main.css media/vendor/components.css && cp ../../node_modules/react/umd/react.production.min.js media/vendor/react.js && cp ../../node_modules/react-dom/umd/react-dom.production.min.js media/vendor/react-dom.js",
+ "compile": "yarn run compile:tsc && yarn run compile:vendor",
"watch": "tsc -watch -p ./",
"pretest": "yarn run compile && yarn run lint",
- "lint": "eslint src --ext ts",
- "test": "node ./out/test/runTest.js"
+ "lint": "eslint src --ext ts"
},
"devDependencies": {
"@types/vscode": "^1.68.0",
diff --git a/packages/vscode-ext/src/squiggleEditor.ts b/packages/vscode-ext/src/squiggleEditor.ts
index 11c5739c..f4fd7a8d 100644
--- a/packages/vscode-ext/src/squiggleEditor.ts
+++ b/packages/vscode-ext/src/squiggleEditor.ts
@@ -85,18 +85,23 @@ export class SquiggleEditorProvider implements vscode.CustomTextEditorProvider {
private getHtmlForWebview(webview: vscode.Webview): string {
// Local path to main script run in the webview
- const bundleUri = webview.asWebviewUri(
+ const styleUri = webview.asWebviewUri(
vscode.Uri.joinPath(
this.context.extensionUri,
- "media",
- "components-bundle.js"
+ "media/vendor/components.css"
)
);
- const styleUri = webview.asWebviewUri(
- vscode.Uri.joinPath(this.context.extensionUri, "media", "components.css")
- );
- const scriptUri = webview.asWebviewUri(
- vscode.Uri.joinPath(this.context.extensionUri, "media", "wysiwyg.js")
+
+ const scriptUris = [
+ // vendor files are copied over by `yarn run compile`
+ "media/vendor/react.js",
+ "media/vendor/react-dom.js",
+ "media/vendor/components.js",
+ "media/wysiwyg.js",
+ ].map((script) =>
+ webview.asWebviewUri(
+ vscode.Uri.joinPath(this.context.extensionUri, script)
+ )
);
// Use a nonce to whitelist which scripts can be run
@@ -113,15 +118,14 @@ export class SquiggleEditorProvider implements vscode.CustomTextEditorProvider {
-->
-
-
-
Squiggle Editor
-
+
-
+ ${scriptUris.map(
+ (uri) => ``
+ )}
`;
}