Breaking changes in Rspress v2.0.0 #1891
Replies: 26 comments 19 replies
-
Custom themes require named exports
If you want to customize theme, please use named export as below: before
other components use named export import Theme from 'rspress/theme';
const Layout = () => <Theme.Layout beforeNavTitle={<div>some content</div>} />;
export default {
...Theme,
Layout,
};
export * from 'rspress/theme';afterall the components use named export import { Layout as BasicLayout } from '@rspress/core/theme-original';
const Layout = () => <BasicLayout beforeNavTitle={<div>some content</div>} />;
// use named export, no need to `export default`
export { Layout };
export * from '@rspress/core/theme-original'; |
Beta Was this translation helpful? Give feedback.
-
|
https://github.com/web-infra-dev/rspress/releases/tag/v2.0.0-alpha.0 |
Beta Was this translation helpful? Give feedback.
-
ScreenShot
|
Beta Was this translation helpful? Give feedback.
-
Use shiki v3 by default, drop prism supportMigrate all code highlighting from prism to shiki in compile time. It is worth noting that some code block syntax will be changed, e.g before You can only use shiki via import { defineConfig } from 'rspress/config';
import { pluginShiki, createTransformerLineNumber, createTransformerDiff } from '@rspress/plugin-shiki';
export default defineConfig({
plugins: [
pluginShiki({
transformers: [
createTransformerLineNumber(),
createTransformerDiff(),
// createTransformerErrorLevel(),
// createTransformerHighlight(),
// createTransformerFocus(),
],
}),
],
});after use shiki by default, import { defineConfig } from 'rspress/config';
import {
transformerNotationDiff,
} from '@shikijs/transformers';
export default defineConfig({
markdown: {
showLineNumber: true,
shiki: {
transformers: [
transformerNotationDiff(),
// transformerNotationErrorLevel(),
// transformerNotationFocus(),
// transformerNotationHighlight(),
],
}
}
}); |
Beta Was this translation helpful? Give feedback.
This comment has been hidden.
This comment has been hidden.
-
For line-highlight breaking changeMigrate to
|
Beta Was this translation helpful? Give feedback.
-
Remove
|
Beta Was this translation helpful? Give feedback.
-
Builtin Sass and Less plugins removedRspress 2.0 no longer has Rsbuild's Less and Sass plugins built into it. You can manually install and register plugins to support Sass and Less.
// rspress.config.ts
import { defineConfig } from 'rspress/config';
import { pluginSass } from '@rsbuild/plugin-sass';
export default defineConfig({
builderPlugins: [pluginSass()],
});
// rspress.config.ts
import { defineConfig } from 'rspress/config';
import { pluginLess } from '@rsbuild/plugin-less';
export default defineConfig({
builderPlugins: [pluginLess()],
}); |
Beta Was this translation helpful? Give feedback.
-
React 19Rspress 2.0 uses React 19 by default, and the minimum supported React version is 18, which means React 17 will no longer be supported. |
Beta Was this translation helpful? Give feedback.
-
|
Is it expected that React 19 will be derived from rspress? I don't want to have 2 React 19 at runtime. 😀 |
Beta Was this translation helpful? Give feedback.
-
|
Rspress sets aliases for React packages by default to ensure that only one copy of React is bundled. See: |
Beta Was this translation helpful? Give feedback.
-
|
thank you |
Beta Was this translation helpful? Give feedback.
-
|
Related PR: #2073 |
Beta Was this translation helpful? Give feedback.
-
enable
|
Beta Was this translation helpful? Give feedback.
-
Add tailwind prefix to Rspress builtin-theme for CSS isolation
This means you can control the integration of unocss or tailwindcss on your own, and it will not cause any conflict now. If you depend on Rspress' existing CSS class names such as |
Beta Was this translation helpful? Give feedback.
This comment was marked as disruptive content.
This comment was marked as disruptive content.
-
|
It this a breaking change? |
Beta Was this translation helpful? Give feedback.
-
|
For people who rely on |
Beta Was this translation helpful? Give feedback.
-
|
I tend to ignore trivial breaking, as the chances of it affecting users are small. |
Beta Was this translation helpful? Give feedback.
-
|
We can hide it in this thread. |
Beta Was this translation helpful? Give feedback.
-
Make SSG strict by default, remove
|
Beta Was this translation helpful? Give feedback.
-
Update unified@11 and mdx related pkgs
If you are using your own rehype or remark plugin in Rspress, you also need to upgrade to a version compatible with |
Beta Was this translation helpful? Give feedback.
-
Drop support for Node 16 and Node 18
Node16 has reached EOL on September 11th, 2023, see https://nodejs.org/en/blog/announcements/nodejs16-eol Rspress 2.0 will drop support for Node 16, 18 and the minimum supported Node version is 20. |
Beta Was this translation helpful? Give feedback.
-
Beta Was this translation helpful? Give feedback.
-
Support dynamic TOC generation
It brings the application of the mdx component to a new level, ships lots of features and closes lots of issues 1. dynamic TOC generation even in user's tsx component
2. the
|
Beta Was this translation helpful? Give feedback.
-
Enable
|
Beta Was this translation helpful? Give feedback.
-
Enable
|
Beta Was this translation helpful? Give feedback.
-
🔥 Removed PackagesThese will be integrated by default in the
|
Beta Was this translation helpful? Give feedback.
-
Support Single Nav Mode by renaming the top level
|
Beta Was this translation helpful? Give feedback.
-
Reimplement
|
Beta Was this translation helpful? Give feedback.
-
Correct relative link in markdown without
|
Beta Was this translation helpful? Give feedback.
-
|
If you update to Rspress V2, don't worry, our friend It will also print the corresponding actual route, making it convenient for adjustment and modification. 
|
Beta Was this translation helpful? Give feedback.
-
Remove
|
Beta Was this translation helpful? Give feedback.
-
Expose type
|
Beta Was this translation helpful? Give feedback.
-
FIle code block syntax support in core ```tsx file="./demo.tsx"
Users can import an external demo file as a code block. As we support this feature in the core. This also means that the syntax external code blocks are used in before only using with <code src="./example.tsx" />after This is the syntax supported in the core package. ```tsx file="./example.tsx"
```// example.tsx
export default () => <div>I'm a example in another file</div> |
Beta Was this translation helpful? Give feedback.
-
Merge
|
Beta Was this translation helpful? Give feedback.
-
Enable
|
Beta Was this translation helpful? Give feedback.
-
MDX fragments usage (ignore "_" prefix routes via
|
Beta Was this translation helpful? Give feedback.
-
Make raw HTML in md styled
Rspress is now driven by CSS for style, ref: https://github.com/web-infra-dev/rspress/blob/main/packages/theme-default/src/styles/doc.scss So you can:
## List
- list item 1 <------ styled
- list item 2
<ul>
<li>list item 1</li> <------ styled
<li>list item 2</li>
</ul>
<div className="rp-not-doc"> <----- not styled
<ul>
<li>list item 1</li>
<li>list item 2</li>
</ul>
</div>
<ul className="rp-not-doc> <----- not styled
<li>list item 1</li>
<li>list item 2</li>
</ul> |
Beta Was this translation helpful? Give feedback.
-
Add translated text for default theme 🌏
The new theme includes a set of default translation strings and supports "treeshaking" based on the languages configured in your project. For examples:
In most cases, you barely need to configure any i18n text manually, which significantly improves usability. You only need to configure BeforeRspress only provides English text, no translation content is provided. If other languages are used, the text needs to be provided by yourself. // rspress.config.ts
import { defineConfig } from 'rspress/config';
export default defineConfig({
themeConfig: {
locales: [
{
lang: 'en',
label: 'English',
outlineTitle: 'ON THIS PAGE'
},
{
lang: 'zh',
label: '中文',
outlineTitle: '目录'
}
]
},
});AfterIf you're migrating from V1, simply deleting the configuration of
Use // rspress.config.ts
import { defineConfig } from '@rspress/core';
export default defineConfig({
locales: [
{
lang: 'en',
label: 'English'
},
{
lang: 'zh',
label: '中文'
}
],
// Rspress will provide a built-in translated text. Use `i18nSource` configuration only when you want to modify the text.
i18nSource: {
outlineTitle: {
zh: '大纲',
en: 'on this page'
}
}
}); |
Beta Was this translation helpful? Give feedback.
-
react-router-dom 7
The default react-related pkg versions within Rspress V2 are:
The compatible react-related pkg versions for Rspress are:
Rspress will check the versions of react or react-router-dom installed in the user's package.json. If they're installed, it'll default to using the user's versions. |
Beta Was this translation helpful? Give feedback.
-
Are you guys planning to fix the fact that RC versions only seem to be published for the sub-packages ( |
Beta Was this translation helpful? Give feedback.
-
|
#1891 (comment) This package has been removed in Rspress v2. |
Beta Was this translation helpful? Give feedback.
-
|
see https://v2.rspress.rs/guide/migration/rspress-v1#important-package-name-and-import-path-changes to migrate |
Beta Was this translation helpful? Give feedback.
-
|
Oh, damn ... I missed this... thanks for the rapid response! |
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
-
Rsbuild v2.0.0 is under active development.
This thread is used to collect planned breaking changes for Rspress v2.0.0.
Beta Was this translation helpful? Give feedback.
All reactions