Skip to content

v0.48.0
Compare
Choose a tag to compare
@github-actions github-actions released this 10 Mar 13:48
· 119 commits to main since this release
v0.48.0
6cc9290

💡 Highlights

Slidev v0.48.0 is one of the biggest changes and improvements released since it launched. Huge thanks to our new team member @KermanX, who pushed a lot of aspects of Slidev and made a lot of cool new features.

🎩 Shiki Magic Move

Shiki Magic Move allows you to do morphing animation between codes, making it smoother to compare code changes in your slides

Screen.Recording.2024-03-10.at.15.53.03.mov

Learn more at https://sli.dev/guide/syntax#shiki-magic-move

✍️ v-mark Rough Notation

We also integrated Rough Notation to Slidev, making it easier to highlight and notation sections you might want to emphasize.

Screen.Recording.2024-02-24.at.17.29.05.mov

Learn more at https://sli.dev/guide/animations#rough-markers

🧑‍💻 Runable Monaco Editor

Monaco Editor integrations get refreshed! It is much more performant and robust. In addition, we also introduced the Runnable Monaco that you can edit and execute the code in your slide:

Screen.Recording.2024-03-07.at.23.11.59.mov

Learn more at https://sli.dev/guide/syntax#monaco-editor

📋 New Overview View

We introduced a new /overview screen for you to review all your slides and notes together:

Screen.Recording.2024-03-08.at.00.45.53.mov

Learn more at https://sli.dev/guide/overview

👆 Clicks Sliders

We introduced the click sliders in both the Overview and Presenter views so that you can quickly see the clicks you have for each slide by dragging them to preview each click.

Screen.Recording.2024-03-10.at.15.24.37.mov

📝 Notes Markers

To make your notes (that might be long) in sync with the progress of your presentation, we introduced that [click] marker to separate your notes into sections so you can follow your notes more easily as you go forward:

Screen.Recording.2024-03-10.at.15.37.23.mov

Learn more at https://sli.dev/guide/syntax#click-markers

🔍 Slide Zooming

You can now have a zooming option for each slide via frontmatter to resize the canvas:

---
zoom: 1.5
---

Your content

Learn more at #1322

🚨 Breaking Changes

Click System Rework

See #1279. This would give the v-click system a much more reliable behavior and better API to work with. It shouldn't affect most usages unless you are using programmatic conditional heavily — try going through your slides after the upgrade to make sure. You should be good to go!

Monaco Editor Rework

See #1330. At the very beginning, Slidev integrated Monaco Editor in an iframe because of the limitation of hover positioning with scaled slides. @KermanX took a deep look and figured out a solid way to make Monaco aware of the current scaling of the slide. Now, Monaco Editors will directly render in the DOM without iframe - this gives us a much more efficient and robust Monaco experience.

Meanwhile, since this approach makes Monaco components, if you don't use Monaco, it will not ship into your production bundle, and you don't need to turn Monaco on and off anymore explicitly. In that case, Monaco support is on by default for both dev and build now.

We also have a new runnable Monaco Editor that can serve as REPL in your presentation, check the docs for more.

Internal Refactorings

If you are using direct import from @slidev/client/**, those might break because we took a huge internal refactor to make the code base future-proof. We suggest you import from @slidev/client (new in v0.48) to use only the public API:

<script setup>
import { useDarkMode, useNav, useSlidevContext } from '@slidev/client'

const { $slidev } = useSlidevContext()
const { currentSlideRoute } = useNav()
const { isDark } = useDarkMode()
// ...
</script>

See https://sli.dev/custom/vue-context#composable-usage

🗺️ Future Plans

We created a few RFC (Request for Comments) issues to address the plans we have for the future:

The major one is that we have a long-term plan to migrate Slidev to use Nuxt as the underlying framework. It would allow us to have built-in server support for production, as well as reusing the rich ecosystem Nuxt has (like installing a module, etc).

Check them out if you are interested. We look forward to hearing from you! Thank you and hope you enjoy Slidev!

Generated changelogs

   🚨 Breaking Changes

   🚀 Features

   🐞 Bug Fixes

   🏎 Performance

  • Use lz-string to pass data more efficiently instead of js-base64. Remove unused deps  -  by @antfu (adf2a)
    View changes on GitHub

Contributors

twitwi, tangramor, and 18 other contributors
Assets 2