PrivateCoffee/tldraw
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1
tldraw/vscode/extension/README.md

35 lines
1.1 KiB
Markdown
Raw Normal View History

Prepare for Publishing VS Code Extension (#227) * Changed Wardlt use back to Tldraw. Added some VS Code marketplace categories * Missed removing one Wardlt mention * Initial support for esbuild based vscode extension workflow. * Hacky start of vs code extension build script * Fixed categories of extension * Added script for generating VS Code extension installer * Temp fix for file format change affecting VS Code extension * Temp fix for file format change issue * Cleanup, prevent changes from saving pagestates * Remove logic around saving pageState * standardize capitalization * v0.1.8 * Edit readme, scripts * Update .eslintignore * v0.1.9 * v0.1.10 * cleans up build scripts, adds publishing notes * Added VS Code extension implementation references links. start:vscode now auto opens the extension folder in VS Code * Removed step from VS Code README to manually open the extensions folder * Removed file * v0.1.11 * v0.1.12 * Fix empty file * v0.1.13 * README cleanup * v0.1.14 * Update TLDrawEditorProvider.ts * v0.1.15 * Fix types for file extension (sort of) build script for extension Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
2021-11-10 15:35:51 +00:00
## Introduction
TLDraw extends VS Code with support for [TLDraw](https://tldraw.com) files.
[TLDraw](https://tldraw.com) is a free drawing and diagramming tool with a hand-drawn style and convenient features such as smart arrows, snapping, and sticky notes. With the TLDraw extension for VS Code, your TLDraw files can be version controlled alongside your code.
> **Tip:** The files you create or edit here can also be opened in the TLDraw [web app](https://tldraw.com).
## Installation
You can install TLDraw from the Visual Studio Code Marketplace or by searching within VS Code.
Create VS Code Extension (#4) * Start of vscode extension. Current code is copy/paste from custom editor samples from Microsoft. We need to evaluate if using their text based customer editor or full on new custom editor is the way to go * Not sure how I missed these files. Adding them * Have a custom editor triggering off of .tldr files. Added gitignores for generated folder. Have iframed tldraw loading and security policies set to do so * Can now load a .tldr file. No saving support yet. Load times are slow, mostly from editor loading up I think * Have temporary solution for saving working now too. * Missed af ile * Backing up progress in syncing tldraw editor history changes * Removed console * ... * ... * Cleanup * Have save working well now. * Moved extension into 'integrations' folder * Trying out WebviewPanelOptions.retainContextWhenHidden=true and it's looking promising * Some cleanup * Trying out new @tldraw/editor module * Have prototype loading using new embedded editor * ... * Shaved off 1 second from editor loadtime * Got save working again. Had to manually fixuppreviously created .tldr files as the format changed a bit * More tuning * Starting work to get new tldraw/tldraw working. * Added example tldr files to vscode package * Removed old editor package * Have onChange working with latest fix. Back to iframed for a few mom * Fixed up .tldr files * Have iframe free extension working, but requiring hand crafted building * ... * Better handling of empty .tldr files. Still an issue with freshly created files trying to save as .js or .json * Thoroughly added comments for the extension code. Need to add diagrams though and now will document/comment/diagram the editor src code * Added comments to all of the editor side of the VS Code Extension. Also cleaned up the code * More cleanup of VS Code Extension code and have script automating generating the initial webview's html content from the cra editor static build * Tweaks to watch logic * Improved scripts for publishing to VS Code Marketplace * Improved name * Made the smiley angry * Reverted * Turned smiley mad * Turned smiley mad * Made smiley sad * Have a lot of plumbing working for Github codespaces and github.dev support * Imported new tldraw vs code extension code. Added instructions for workflows * Quick fix * Fix for corrupted arrows files * Updated editor build step to new location * Merge branch 'main' into vscode-extension-v1, add local file updating * Update App.tsx * Cleanup, bumped to 0.0.124 @tldraw/tdlraw and published a 0.10.0 version of hte extension * Added Trello/Kanban style file * Finished video * brings up to date * Fix scripts * Update README.md * Update .babelrc Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
2021-11-06 16:49:53 +00:00
## Features
Prepare for Publishing VS Code Extension (#227) * Changed Wardlt use back to Tldraw. Added some VS Code marketplace categories * Missed removing one Wardlt mention * Initial support for esbuild based vscode extension workflow. * Hacky start of vs code extension build script * Fixed categories of extension * Added script for generating VS Code extension installer * Temp fix for file format change affecting VS Code extension * Temp fix for file format change issue * Cleanup, prevent changes from saving pagestates * Remove logic around saving pageState * standardize capitalization * v0.1.8 * Edit readme, scripts * Update .eslintignore * v0.1.9 * v0.1.10 * cleans up build scripts, adds publishing notes * Added VS Code extension implementation references links. start:vscode now auto opens the extension folder in VS Code * Removed step from VS Code README to manually open the extensions folder * Removed file * v0.1.11 * v0.1.12 * Fix empty file * v0.1.13 * README cleanup * v0.1.14 * Update TLDrawEditorProvider.ts * v0.1.15 * Fix types for file extension (sort of) build script for extension Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
2021-11-10 15:35:51 +00:00
1. View, edit and save TLDraw files (`.tldr`)
Create VS Code Extension (#4) * Start of vscode extension. Current code is copy/paste from custom editor samples from Microsoft. We need to evaluate if using their text based customer editor or full on new custom editor is the way to go * Not sure how I missed these files. Adding them * Have a custom editor triggering off of .tldr files. Added gitignores for generated folder. Have iframed tldraw loading and security policies set to do so * Can now load a .tldr file. No saving support yet. Load times are slow, mostly from editor loading up I think * Have temporary solution for saving working now too. * Missed af ile * Backing up progress in syncing tldraw editor history changes * Removed console * ... * ... * Cleanup * Have save working well now. * Moved extension into 'integrations' folder * Trying out WebviewPanelOptions.retainContextWhenHidden=true and it's looking promising * Some cleanup * Trying out new @tldraw/editor module * Have prototype loading using new embedded editor * ... * Shaved off 1 second from editor loadtime * Got save working again. Had to manually fixuppreviously created .tldr files as the format changed a bit * More tuning * Starting work to get new tldraw/tldraw working. * Added example tldr files to vscode package * Removed old editor package * Have onChange working with latest fix. Back to iframed for a few mom * Fixed up .tldr files * Have iframe free extension working, but requiring hand crafted building * ... * Better handling of empty .tldr files. Still an issue with freshly created files trying to save as .js or .json * Thoroughly added comments for the extension code. Need to add diagrams though and now will document/comment/diagram the editor src code * Added comments to all of the editor side of the VS Code Extension. Also cleaned up the code * More cleanup of VS Code Extension code and have script automating generating the initial webview's html content from the cra editor static build * Tweaks to watch logic * Improved scripts for publishing to VS Code Marketplace * Improved name * Made the smiley angry * Reverted * Turned smiley mad * Turned smiley mad * Made smiley sad * Have a lot of plumbing working for Github codespaces and github.dev support * Imported new tldraw vs code extension code. Added instructions for workflows * Quick fix * Fix for corrupted arrows files * Updated editor build step to new location * Merge branch 'main' into vscode-extension-v1, add local file updating * Update App.tsx * Cleanup, bumped to 0.0.124 @tldraw/tdlraw and published a 0.10.0 version of hte extension * Added Trello/Kanban style file * Finished video * brings up to date * Fix scripts * Update README.md * Update .babelrc Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
2021-11-06 16:49:53 +00:00
## Usage
Prepare for Publishing VS Code Extension (#227) * Changed Wardlt use back to Tldraw. Added some VS Code marketplace categories * Missed removing one Wardlt mention * Initial support for esbuild based vscode extension workflow. * Hacky start of vs code extension build script * Fixed categories of extension * Added script for generating VS Code extension installer * Temp fix for file format change affecting VS Code extension * Temp fix for file format change issue * Cleanup, prevent changes from saving pagestates * Remove logic around saving pageState * standardize capitalization * v0.1.8 * Edit readme, scripts * Update .eslintignore * v0.1.9 * v0.1.10 * cleans up build scripts, adds publishing notes * Added VS Code extension implementation references links. start:vscode now auto opens the extension folder in VS Code * Removed step from VS Code README to manually open the extensions folder * Removed file * v0.1.11 * v0.1.12 * Fix empty file * v0.1.13 * README cleanup * v0.1.14 * Update TLDrawEditorProvider.ts * v0.1.15 * Fix types for file extension (sort of) build script for extension Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
2021-11-10 15:35:51 +00:00
- To view an existing TLDraw file, open a file with the `.tldr` extension in VS Code.
- To create a new TLDraw file, use the provided command: "TLDraw: New TLDraw File".
## Release Notes
For full release notes, see the [changelog](https://github.com/tldraw/tldraw).
## Community
### Support
Need help? Please [open an issue](https://github.com/tldraw/tldraw/issues/new) for support.
### Discussion
Update discord channel link
2021-11-11 12:25:25 +00:00
Want to connect with other devs? Visit the [Discord channel](https://discord.gg/SBBEVCA4PG).
Reference in a new issue Copy permalink