Skip to content

docs: apply twoslash #4560

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 60 commits into
base: main
Choose a base branch
from
Open

docs: apply twoslash #4560

wants to merge 60 commits into from

Conversation

serkodev
Copy link
Contributor

@serkodev serkodev commented Feb 4, 2025

Before submitting the PR, please make sure you do the following

  • Read the Contributing Guidelines.
  • Read the Pull Request Guidelines.
  • Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
  • Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
  • Ideally, include relevant tests that fail without this PR but pass with it.

Description

Related: #4548 (comment)

This PR applies Twoslash to document of VueUse and still in progress.

  • Makes all ts and vue code blocks in the index.md document automatically apply Twoslash.
  • Automatically imports vue in all code blocks (silently).
  • Some sample code includes vue imports while others do not. Instead of enforcing uniform importing or non-importing, I believe that keeping shorter code snippets import-free can enhance readability. Therefore, I aim to preserve the original code snippets as much as possible.
  • I believe some sample code is more like pseudo-code. Although certain null checks or type checks may not pass, they improve readability. As a result, I have enabled Twoslash’s noErrors option by default.
  • Updates vitepress > vite to npm:rolldown-vite@latest to reduce the memory usage and build time on Netlify.

Preview

screenshot

Progress

Core
Category Status
State
Elements
Browser
Sensors
Network
Animation
Component
Watch
Reactivity
Array
Time
Utilities
Add-ons
Category Status
Electron
Firebase
Head 🔗
Integrations
Math
Motion 🔗
Router
RxJS ⚠️
SchemaOrg 🔗
Sound 🔗

@ilyaliao ilyaliao added the documentation Improvements or additions to documentation label Feb 5, 2025
@userquin
Copy link
Contributor

userquin commented Feb 6, 2025

@serkodev You need to change the node max_old_space_size here https://github.com/vueuse/vueuse/blob/main/netlify.toml#L6

Just try with 8192 (the free tier is limited to 6GB), iirc Anthony doesn't have any restriction at Netlifly

@serkodev
Copy link
Contributor Author

serkodev commented Feb 6, 2025

@userquin Oh! Thanks for the reminder. I’m currently researching whether there’s a way to reduce build memory usage (it does require more than 16GB at the moment). So, it’s still uncertain whether this flag will be changed. If I decide to modify it later, I’ll add it to Netlify’s config. 👍

@userquin
Copy link
Contributor

userquin commented Feb 6, 2025

@serkodev don't waste your time, looks like it is a problem with Vue version, check:

If we can run the build at Netlify with 16GB it should be fine /cc @antfu

In the meantime you can also try using buildConcurrency: 10 (or even small number, beware, will be slow) at VP config file (by default it is 64) here https://github.com/vueuse/vueuse/blob/main/packages/.vitepress/config.ts#L67:

@userquin
Copy link
Contributor

userquin commented Feb 6, 2025

@serkodev Maybe you can try with VP 2.0.2.alpha (using Vite 6) in a new local branch from this one (or even using a new clean clone of the branch, no idea if updating to Vite 6 will have some side effect on the build): https://github.com/vuejs/vitepress/releases

(If you don't have time, I can give it a try next Saturday)

@userquin
Copy link
Contributor

userquin commented Feb 6, 2025

we can also try updating the dependency to latest version 2.3.2: https://github.com/vueuse/vueuse/blob/main/pnpm-workspace.yaml#L12

@userquin
Copy link
Contributor

userquin commented Feb 7, 2025

Thx @brc-dd :

You can try enabling the fs cache thing that twoslash added (it might not work though 🫠). Twoslash is rebuilding whole ts graph for each file which is both slow + goes OOM.

@serkodev
Copy link
Contributor Author

serkodev commented Feb 7, 2025

@userquin Thanks for providing this information and saving me a lot of time! 💚 I’ll take a look and see if it fixes the issue.

@ilyaliao
Copy link
Member

ilyaliao commented Jul 29, 2025

Looks like it works 👀

@serkodev
Copy link
Contributor Author

Yep, after plenty of trial-and-error, I finally got it building successfully on Netlify! 😭

@serkodev serkodev changed the title (WIP) docs: apply twoslash docs: apply twoslash Jul 29, 2025
@serkodev serkodev marked this pull request as ready for review July 29, 2025 13:29
@dosubot dosubot bot added the size:L This PR changes 100-499 lines, ignoring generated files. label Jul 29, 2025
@serkodev
Copy link
Contributor Author

Currently I'm working on passing the test:browser test, seems there are some bug related to rolldown.
I'm trying to only apply rolldown-vite to vitepress

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation Improvements or additions to documentation size:L This PR changes 100-499 lines, ignoring generated files.
Projects
Status: No status
Development

Successfully merging this pull request may close these issues.

5 participants