diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index dc527e35..51d3fffe 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -18,7 +18,7 @@ jobs: strategy: matrix: os: [ubuntu-latest] - node_version: [18, 20, 22] + node_version: [20, 22, latest] include: - os: windows-latest node_version: 22 diff --git a/CHANGELOG.md b/CHANGELOG.md index 7d630958..387e81e0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,47 @@ +## [2.0.0-alpha.4](https://github.com/vuejs/vitepress/compare/v2.0.0-alpha.3...v2.0.0-alpha.4) (2025-03-09) + +### Bug Fixes + +- **build/regression:** langAlias not working ([06ae2bf](https://github.com/vuejs/vitepress/commit/06ae2bf3a4ee02351530b0bd055e577ca6509d62)), closes [#4581](https://github.com/vuejs/vitepress/issues/4581) +- don't hardcode `tabindex` attr in table renderer ([#4082](https://github.com/vuejs/vitepress/issues/4082)) ([aadc517](https://github.com/vuejs/vitepress/commit/aadc517c69fb239bdda99173bbc123ace567484b)) +- hmr not working for watched files in path loaders ([e271695](https://github.com/vuejs/vitepress/commit/e271695d716247455ca620948f814e6c8ca0e3c4)), closes [#4525](https://github.com/vuejs/vitepress/issues/4525) +- ignore non-text content in permalink generation and fix types of markdown.config ([a8a1800](https://github.com/vuejs/vitepress/commit/a8a1800ae578be88027aa4ec7561ada4d055b888)) +- prevent reload on first server start in fresh installations ([d8a884e](https://github.com/vuejs/vitepress/commit/d8a884ed0f754523765058a70149cdbaf6942341)) +- properly merge classes in custom containers ([#4128](https://github.com/vuejs/vitepress/issues/4128)) ([8aad617](https://github.com/vuejs/vitepress/commit/8aad617446c03d39a65a0b21e9fce43bc484af1e)) +- rebuild dynamic routes cache on server restart ([9f54714](https://github.com/vuejs/vitepress/commit/9f54714e7db69fd4902f1917f927456c71b5a292)), closes [#4525](https://github.com/vuejs/vitepress/issues/4525) + +### Features + +- allow matching region end in snippets without tag ([#4287](https://github.com/vuejs/vitepress/issues/4287)) ([1a2f81d](https://github.com/vuejs/vitepress/commit/1a2f81de4d6549dd1adf86ae131d1a861158bd2d)) +- improve region regexes for snippet plugin ([1a6684c](https://github.com/vuejs/vitepress/commit/1a6684cf1054d326bc1dd6eeb9fb78b150ac2b2a)) +- support using header anchors in markdown file inclusion ([#4608](https://github.com/vuejs/vitepress/issues/4608)) ([b99d512](https://github.com/vuejs/vitepress/commit/b99d5123c9b2afdc7461089e03476c34d7816faf)), closes [#4375](https://github.com/vuejs/vitepress/issues/4375) [#4382](https://github.com/vuejs/vitepress/issues/4382) + +## [2.0.0-alpha.3](https://github.com/vuejs/vitepress/compare/v2.0.0-alpha.2...v2.0.0-alpha.3) (2025-02-24) + +### Bug Fixes + +- **build:** `--minify` not working as documented ([9b5c037](https://github.com/vuejs/vitepress/commit/9b5c0377cd3474447c84b2901801287f3caf3d82)), closes [#4523](https://github.com/vuejs/vitepress/issues/4523) +- **build:** deterministic code group ids ([#4565](https://github.com/vuejs/vitepress/issues/4565)) ([b930b8d](https://github.com/vuejs/vitepress/commit/b930b8d5310f1691d8d9f009f45b70122e4ce800)) +- **markdown:** include content of all tokens in heading ids ([68dff2a](https://github.com/vuejs/vitepress/commit/68dff2af8547ae70f6622ac826affd76f2f6378e)), closes [#4561](https://github.com/vuejs/vitepress/issues/4561) +- **client:** set correct oldURL and newURL for hashchange ([#4573](https://github.com/vuejs/vitepress/issues/4573)) ([d1f2afd](https://github.com/vuejs/vitepress/commit/d1f2afdf0fbb022f12cc12295723b3b7c7ef5cb1)) +- **theme:** allow interactions behind scroll shadow ([#4537](https://github.com/vuejs/vitepress/issues/4537)) ([091d584](https://github.com/vuejs/vitepress/commit/091d5840ae15b64e04e8c07fbc0263a2749571bd)) +- **theme:** code block contrast ratio ([#4487](https://github.com/vuejs/vitepress/issues/4487)) ([5dccaee](https://github.com/vuejs/vitepress/commit/5dccaeef055beb109919f8990032975a0d630384)) +- **build:** fix flaky embedded languages highlighting ([#4566](https://github.com/vuejs/vitepress/issues/4566)) ([1969cf4](https://github.com/vuejs/vitepress/commit/1969cf4f3b93ad105595e4e2f8b030b04eb1c975)) + +### Features + +- **cli:** support custom `srcDir` ([#4270](https://github.com/vuejs/vitepress/issues/4270)) ([518c094](https://github.com/vuejs/vitepress/commit/518c0945f159aae679ef710bb48ae3ab3891cc9f)) +- **cli:** support custom npm scripts prefix ([#4271](https://github.com/vuejs/vitepress/issues/4271)) ([e5a0ee8](https://github.com/vuejs/vitepress/commit/e5a0ee8161752a77c5bb9546245a940cb5f28fb8)) +- **build:** dynamic routes plugin overhaul ([#4525](https://github.com/vuejs/vitepress/issues/4525)) ([a62ea6a](https://github.com/vuejs/vitepress/commit/a62ea6a832a33b756642b24ad5d38c248e08b554)) +- **build:** update to shiki v3 ([#4571](https://github.com/vuejs/vitepress/issues/4571)) ([52c2aa1](https://github.com/vuejs/vitepress/commit/52c2aa178d4b3fa98b863cf28f0ccf6d2aabcd93)) +- **build:** use `markdown-it-async`, remove `synckit` ([#4507](https://github.com/vuejs/vitepress/issues/4507)) ([8062235](https://github.com/vuejs/vitepress/commit/80622356f1d648577ee47ee3a44b04bb015ee462)) + +### BREAKING CHANGES + +- markdown-it-async is used instead of markdown-it. If you're using custom content renderer for local search, you'll need to do `await md.renderAsync` instead of `md.render`. +- Internals are modified a bit to better support vite 6 and handle HMR more correctly. For most users this won't need any change on their side. +- shiki is upgraded to v3. There shouldn't be any breaking change but if you see any issue, please report it. + ## [2.0.0-alpha.2](https://github.com/vuejs/vitepress/compare/v2.0.0-alpha.1...v2.0.0-alpha.2) (2025-01-23) ### Bug Fixes diff --git a/__tests__/e2e/.vitepress/config.ts b/__tests__/e2e/.vitepress/config.ts index 43dbfa84..121761e7 100644 --- a/__tests__/e2e/.vitepress/config.ts +++ b/__tests__/e2e/.vitepress/config.ts @@ -173,5 +173,13 @@ export default defineConfig({ } } } + }, + vite: { + server: { + watch: { + usePolling: true, + interval: 100 + } + } } }) diff --git a/__tests__/e2e/.vitepress/theme/components/ApiPreference.vue b/__tests__/e2e/.vitepress/theme/components/ApiPreference.vue index 12207764..c286640b 100644 --- a/__tests__/e2e/.vitepress/theme/components/ApiPreference.vue +++ b/__tests__/e2e/.vitepress/theme/components/ApiPreference.vue @@ -30,7 +30,7 @@ function removeSpaces(str: string) { diff --git a/__tests__/e2e/dynamic-routes/[id].paths.ts b/__tests__/e2e/dynamic-routes/[id].paths.ts index 3eca4d91..12a8bc32 100644 --- a/__tests__/e2e/dynamic-routes/[id].paths.ts +++ b/__tests__/e2e/dynamic-routes/[id].paths.ts @@ -1,8 +1,14 @@ -export default { - async paths() { - return [ - { params: { id: 'foo' }, content: `# Foo` }, - { params: { id: 'bar' }, content: `# Bar` } - ] +import { defineRoutes } from 'vitepress' +import paths from './paths' + +export default defineRoutes({ + async paths(watchedFiles: string[]) { + // console.log('watchedFiles', watchedFiles) + return paths + }, + watch: ['**/data-loading/**/*.json'], + async transformPageData(pageData) { + // console.log('transformPageData', pageData.filePath) + pageData.title += ' - transformed' } -} +}) diff --git a/__tests__/e2e/dynamic-routes/paths.ts b/__tests__/e2e/dynamic-routes/paths.ts new file mode 100644 index 00000000..5adb0ed4 --- /dev/null +++ b/__tests__/e2e/dynamic-routes/paths.ts @@ -0,0 +1,4 @@ +export default [ + { params: { id: 'foo' }, content: `# Foo` }, + { params: { id: 'bar' }, content: `# Bar` } +] diff --git a/__tests__/e2e/markdown-extensions/header-include.md b/__tests__/e2e/markdown-extensions/header-include.md new file mode 100644 index 00000000..70fac23b --- /dev/null +++ b/__tests__/e2e/markdown-extensions/header-include.md @@ -0,0 +1,27 @@ +# header 1 + +header 1 content + +## header 1.1 + +header 1.1 content + +### header 1.1.1 + +header 1.1.1 content + +### header 1.1.2 + +header 1.1.2 content + +## header 1.2 + +header 1.2 content + +### header 1.2.1 + +header 1.2.1 content + +### header 1.2.2 + +header 1.2.2 content diff --git a/__tests__/e2e/markdown-extensions/index.md b/__tests__/e2e/markdown-extensions/index.md index 855803f2..3446b4ef 100644 --- a/__tests__/e2e/markdown-extensions/index.md +++ b/__tests__/e2e/markdown-extensions/index.md @@ -213,6 +213,10 @@ export default config +## Markdown File Inclusion with Header + + + ## Image Lazy Loading -![vitepress logo](/vitepress.png) \ No newline at end of file +![vitepress logo](/vitepress.png) diff --git a/__tests__/e2e/markdown-extensions/markdown-extensions.test.ts b/__tests__/e2e/markdown-extensions/markdown-extensions.test.ts index e49a137f..839f953c 100644 --- a/__tests__/e2e/markdown-extensions/markdown-extensions.test.ts +++ b/__tests__/e2e/markdown-extensions/markdown-extensions.test.ts @@ -64,8 +64,61 @@ describe('Emoji', () => { describe('Table of Contents', () => { test('render toc', async () => { const items = page.locator('#table-of-contents + nav ul li') - const count = await items.count() - expect(count).toBe(44) + expect( + await items.evaluateAll((elements) => + elements.map((el) => el.childNodes[0].textContent) + ) + ).toMatchInlineSnapshot(` + [ + "Links", + "Internal Links", + "External Links", + "GitHub-Style Tables", + "Emoji", + "Table of Contents", + "Custom Containers", + "Default Title", + "Custom Title", + "Line Highlighting in Code Blocks", + "Single Line", + "Multiple single lines, ranges", + "Comment Highlight", + "Line Numbers", + "Import Code Snippets", + "Basic Code Snippet", + "Specify Region", + "With Other Features", + "Code Groups", + "Basic Code Group", + "With Other Features", + "Markdown File Inclusion", + "Region", + "Markdown At File Inclusion", + "Markdown Nested File Inclusion", + "Region", + "After Foo", + "Sub sub", + "Sub sub sub", + "Markdown File Inclusion with Range", + "Region", + "Markdown File Inclusion with Range without Start", + "Region", + "Markdown File Inclusion with Range without End", + "Region", + "Markdown At File Region Snippet", + "Region Snippet", + "Markdown At File Range Region Snippet", + "Range Region Line 2", + "Markdown At File Range Region Snippet without start", + "Range Region Line 1", + "Markdown At File Range Region Snippet without end", + "Range Region Line 3", + "Markdown File Inclusion with Header", + "header 1.1.1", + "header 1.1.2", + "Image Lazy Loading", + ] + `) }) }) diff --git a/__tests__/unit/node/markdown/plugins/snippet.test.ts b/__tests__/unit/node/markdown/plugins/snippet.test.ts index 0ae97dd2..aa940784 100644 --- a/__tests__/unit/node/markdown/plugins/snippet.test.ts +++ b/__tests__/unit/node/markdown/plugins/snippet.test.ts @@ -1,4 +1,9 @@ -import { dedent, rawPathToToken } from 'node/markdown/plugins/snippet' +import { + dedent, + findRegion, + rawPathToToken +} from 'node/markdown/plugins/snippet' +import { expect } from 'vitest' const removeEmptyKeys = >(obj: T) => { return Object.fromEntries( @@ -94,9 +99,228 @@ describe('node/markdown/plugins/snippet', () => { }) }) - test('rawPathToToken', () => { - rawPathTokenMap.forEach(([rawPath, token]) => { + describe('rawPathToToken', () => { + test.each(rawPathTokenMap)('%s', (rawPath, token) => { expect(removeEmptyKeys(rawPathToToken(rawPath))).toEqual(token) }) }) + + describe('findRegion', () => { + it('returns null when no region markers are present', () => { + const lines = ['function foo() {', ' console.log("hello");', '}'] + expect(findRegion(lines, 'foo')).toBeNull() + }) + + it('ignores non-matching region names', () => { + const lines = [ + '// #region regionA', + 'some code here', + '// #endregion regionA' + ] + expect(findRegion(lines, 'regionC')).toBeNull() + }) + + it('returns null if a region start marker exists without a matching end marker', () => { + const lines = [ + '// #region missingEnd', + 'console.log("inside region");', + 'console.log("still inside");' + ] + expect(findRegion(lines, 'missingEnd')).toBeNull() + }) + + it('returns null if an end marker exists without a preceding start marker', () => { + const lines = [ + '// #endregion ghostRegion', + 'console.log("stray end marker");' + ] + expect(findRegion(lines, 'ghostRegion')).toBeNull() + }) + + it('detects C#/JavaScript style region markers with matching tags', () => { + const lines = [ + 'Console.WriteLine("Before region");', + '#region hello', + 'Console.WriteLine("Hello, World!");', + '#endregion hello', + 'Console.WriteLine("After region");' + ] + const result = findRegion(lines, 'hello') + expect(result).not.toBeNull() + if (result) { + expect(lines.slice(result.start, result.end).join('\n')).toBe( + 'Console.WriteLine("Hello, World!");' + ) + } + }) + + it('detects region markers even when the end marker omits the region name', () => { + const lines = [ + 'Console.WriteLine("Before region");', + '#region hello', + 'Console.WriteLine("Hello, World!");', + '#endregion', + 'Console.WriteLine("After region");' + ] + const result = findRegion(lines, 'hello') + expect(result).not.toBeNull() + if (result) { + expect(lines.slice(result.start, result.end).join('\n')).toBe( + 'Console.WriteLine("Hello, World!");' + ) + } + }) + + it('handles indented region markers correctly', () => { + const lines = [ + ' Console.WriteLine("Before region");', + ' #region hello', + ' Console.WriteLine("Hello, World!");', + ' #endregion hello', + ' Console.WriteLine("After region");' + ] + const result = findRegion(lines, 'hello') + expect(result).not.toBeNull() + if (result) { + expect(lines.slice(result.start, result.end).join('\n')).toBe( + ' Console.WriteLine("Hello, World!");' + ) + } + }) + + it('detects TypeScript style region markers', () => { + const lines = [ + 'let regexp: RegExp[] = [];', + '// #region foo', + 'let start = -1;', + '// #endregion foo' + ] + const result = findRegion(lines, 'foo') + expect(result).not.toBeNull() + if (result) { + expect(lines.slice(result.start, result.end).join('\n')).toBe( + 'let start = -1;' + ) + } + }) + + it('detects CSS style region markers', () => { + const lines = [ + '.body-content {', + '/* #region foo */', + ' padding-left: 15px;', + '/* #endregion foo */', + ' padding-right: 15px;', + '}' + ] + const result = findRegion(lines, 'foo') + expect(result).not.toBeNull() + if (result) { + expect(lines.slice(result.start, result.end).join('\n')).toBe( + ' padding-left: 15px;' + ) + } + }) + + it('detects HTML style region markers', () => { + const lines = [ + '
Some content
', + '', + '

Hello world

', + '', + '
Other content
' + ] + const result = findRegion(lines, 'foo') + expect(result).not.toBeNull() + if (result) { + expect(lines.slice(result.start, result.end).join('\n')).toBe( + '

Hello world

' + ) + } + }) + + it('detects Visual Basic style region markers (with case-insensitive "End")', () => { + const lines = [ + 'Console.WriteLine("VB")', + '#Region VBRegion', + ' Console.WriteLine("Inside region")', + '#End Region VBRegion', + 'Console.WriteLine("Done")' + ] + const result = findRegion(lines, 'VBRegion') + expect(result).not.toBeNull() + if (result) { + expect(lines.slice(result.start, result.end).join('\n')).toBe( + ' Console.WriteLine("Inside region")' + ) + } + }) + + it('detects Bat style region markers', () => { + const lines = ['::#region foo', 'echo off', '::#endregion foo'] + const result = findRegion(lines, 'foo') + expect(result).not.toBeNull() + if (result) { + expect(lines.slice(result.start, result.end).join('\n')).toBe( + 'echo off' + ) + } + }) + + it('detects C/C++ style region markers using #pragma', () => { + const lines = [ + '#pragma region foo', + 'int a = 1;', + '#pragma endregion foo' + ] + const result = findRegion(lines, 'foo') + expect(result).not.toBeNull() + if (result) { + expect(lines.slice(result.start, result.end).join('\n')).toBe( + 'int a = 1;' + ) + } + }) + + it('returns the first complete region when multiple regions exist', () => { + const lines = [ + '// #region foo', + 'first region content', + '// #endregion foo', + '// #region foo', + 'second region content', + '// #endregion foo' + ] + const result = findRegion(lines, 'foo') + expect(result).not.toBeNull() + if (result) { + expect(lines.slice(result.start, result.end).join('\n')).toBe( + 'first region content' + ) + } + }) + + it('handles nested regions with different names properly', () => { + const lines = [ + '// #region foo', + "console.log('line before nested');", + '// #region bar', + "console.log('nested content');", + '// #endregion bar', + '// #endregion foo' + ] + const result = findRegion(lines, 'foo') + expect(result).not.toBeNull() + if (result) { + const extracted = lines.slice(result.start, result.end).join('\n') + const expected = [ + "console.log('line before nested');", + '// #region bar', + "console.log('nested content');", + '// #endregion bar' + ].join('\n') + expect(extracted).toBe(expected) + } + }) + }) }) diff --git a/__tests__/unit/node/utils/moduleGraph.test.ts b/__tests__/unit/node/utils/moduleGraph.test.ts new file mode 100644 index 00000000..9b3db9e5 --- /dev/null +++ b/__tests__/unit/node/utils/moduleGraph.test.ts @@ -0,0 +1,72 @@ +import { ModuleGraph } from 'node/utils/moduleGraph' + +describe('node/utils/moduleGraph', () => { + let graph: ModuleGraph + + beforeEach(() => { + graph = new ModuleGraph() + }) + + it('should correctly delete a module and its dependents', () => { + graph.add('A', ['B', 'C']) + graph.add('B', ['D']) + graph.add('C', []) + graph.add('D', []) + + expect(graph.delete('D')).toEqual(new Set(['D', 'B', 'A'])) + }) + + it('should handle shared dependencies correctly', () => { + graph.add('A', ['B', 'C']) + graph.add('B', ['D']) + graph.add('C', ['D']) // Shared dependency + graph.add('D', []) + + expect(graph.delete('D')).toEqual(new Set(['A', 'B', 'C', 'D'])) + }) + + it('merges dependencies correctly', () => { + // Add module A with dependency B + graph.add('A', ['B']) + // Merge new dependency C into module A (B should remain) + graph.add('A', ['C']) + + // Deleting B should remove A as well, since A depends on B. + expect(graph.delete('B')).toEqual(new Set(['B', 'A'])) + }) + + it('handles cycles gracefully', () => { + // Create a cycle: A -> B, B -> C, C -> A. + graph.add('A', ['B']) + graph.add('B', ['C']) + graph.add('C', ['A']) + + // Deleting any module in the cycle should delete all modules in the cycle. + expect(graph.delete('A')).toEqual(new Set(['A', 'B', 'C'])) + }) + + it('cleans up dependencies when deletion', () => { + // Setup A -> B relationship. + graph.add('A', ['B']) + graph.add('B', []) + + // Deleting B should remove both B and A from the graph. + expect(graph.delete('B')).toEqual(new Set(['B', 'A'])) + + // After deletion, add modules again. + graph.add('C', []) + graph.add('A', ['C']) // Now A depends only on C. + + expect(graph.delete('C')).toEqual(new Set(['C', 'A'])) + }) + + it('handles independent modules', () => { + // Modules with no dependencies. + graph.add('X', []) + graph.add('Y', []) + + // Deletion of one should only remove that module. + expect(graph.delete('X')).toEqual(new Set(['X'])) + expect(graph.delete('Y')).toEqual(new Set(['Y'])) + }) +}) diff --git a/art/vitepress-logo.svg b/art/vitepress-logo.svg index 1052015b..0805ed51 100644 --- a/art/vitepress-logo.svg +++ b/art/vitepress-logo.svg @@ -1,4 +1,4 @@ - + diff --git a/docs/.vitepress/theme/styles.css b/docs/.vitepress/theme/styles.css index 1c4b3af5..ce1c75d2 100644 --- a/docs/.vitepress/theme/styles.css +++ b/docs/.vitepress/theme/styles.css @@ -1,9 +1,9 @@ @import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@100..900&display=swap'); :root:where(:lang(fa)) { - --vp-font-family-base: 'Vazirmatn', 'Inter', ui-sans-serif, system-ui, - sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', - 'Noto Color Emoji'; + --vp-font-family-base: + 'Vazirmatn', 'Inter', ui-sans-serif, system-ui, sans-serif, + 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; } :root { @@ -33,6 +33,11 @@ } } +.VPHero .VPImage { + filter: drop-shadow(-2px 4px 6px rgba(0, 0, 0, 0.2)); + padding: 18px; +} + /* used in reference/default-theme-search */ img[src='/search.png'] { width: 100%; diff --git a/docs/en/guide/deploy.md b/docs/en/guide/deploy.md index a4093df2..ed6331c1 100644 --- a/docs/en/guide/deploy.md +++ b/docs/en/guide/deploy.md @@ -111,7 +111,7 @@ Set up a new project and change these settings using your dashboard: - **Build Command:** `npm run docs:build` - **Output Directory:** `docs/.vitepress/dist` -- **Node Version:** `18` (or above) +- **Node Version:** `20` (or above) ::: warning Don't enable options like _Auto Minify_ for HTML code. It will remove comments from output which have meaning to Vue. You may see hydration mismatch errors if they get removed. @@ -163,7 +163,7 @@ Don't enable options like _Auto Minify_ for HTML code. It will remove comments f - name: Setup Node uses: actions/setup-node@v4 with: - node-version: 20 + node-version: 22 cache: npm # or pnpm / yarn - name: Setup Pages uses: actions/configure-pages@v4 diff --git a/docs/en/guide/markdown.md b/docs/en/guide/markdown.md index 06b8b776..bbd2b2a3 100644 --- a/docs/en/guide/markdown.md +++ b/docs/en/guide/markdown.md @@ -255,7 +255,7 @@ This is a special container that can be used to prevent style and router conflic ```md ::: raw -Wraps in a
+Wraps in a `
` ::: ``` @@ -824,7 +824,7 @@ It also supports selecting a line range: **Input** -```md +```md:line-numbers # Docs ## Basics @@ -834,7 +834,7 @@ It also supports selecting a line range: **Part file** (`parts/basics.md`) -```md +```md:line-numbers Some getting started stuff. ### Configuration @@ -844,7 +844,7 @@ Can be created using `.foorc.json`. **Equivalent code** -```md +```md:line-numbers # Docs ## Basics @@ -860,7 +860,7 @@ You can also use a [VS Code region](https://code.visualstudio.com/docs/editor/co **Input** -```md +```md:line-numbers # Docs ## Basics @@ -871,7 +871,7 @@ You can also use a [VS Code region](https://code.visualstudio.com/docs/editor/co **Part file** (`parts/basics.md`) -```md +```md:line-numbers ## Usage Line 1 @@ -883,7 +883,7 @@ You can also use a [VS Code region](https://code.visualstudio.com/docs/editor/co **Equivalent code** -```md +```md:line-numbers # Docs ## Basics @@ -897,6 +897,53 @@ You can also use a [VS Code region](https://code.visualstudio.com/docs/editor/co Note that this does not throw errors if your file is not present. Hence, when using this feature make sure that the contents are being rendered as expected. ::: +Instead of VS Code regions, you can also use header anchors to include a specific section of the file. For example, if you have a header in your markdown file like this: + +```md +## My Base Section + +Some content here. + +### My Sub Section + +Some more content here. + +## Another Section + +Content outside `My Base Section`. +``` + +You can include the `My Base Section` section like this: + +```md +## My Extended Section + +``` + +**Equivalent code** + +```md +## My Extended Section + +Some content here. + +### My Sub Section + +Some more content here. +``` + +Here, `my-base-section` is the generated id of the heading element. In case it's not easily guessable, you can open the part file in your browser and click on the heading anchor (`#` symbol left to the heading when hovered) to see the id in the URL bar. Or use browser dev tools to inspect the element. Alternatively, you can also specify the id to the part file like this: + +```md +## My Base Section {#custom-id} +``` + +and include it like this: + +```md + +``` + ## Math Equations This is currently opt-in. To enable it, you need to install `markdown-it-mathjax3` and set `markdown.math` to `true` in your config file: diff --git a/docs/en/guide/using-vue.md b/docs/en/guide/using-vue.md index 5a82dc75..8420ea7f 100644 --- a/docs/en/guide/using-vue.md +++ b/docs/en/guide/using-vue.md @@ -288,4 +288,4 @@ Vue provides IntelliSense support out of the box via the [Vue - Official VS Code "vue.server.includeLanguages": ["vue", "markdown"] } ``` -::: \ No newline at end of file +::: diff --git a/docs/en/index.md b/docs/en/index.md index d65ee07b..c91ce953 100644 --- a/docs/en/index.md +++ b/docs/en/index.md @@ -19,7 +19,7 @@ hero: text: GitHub link: https://github.com/vuejs/vitepress image: - src: /vitepress-logo-large.webp + src: /vitepress-logo-large.svg alt: VitePress features: diff --git a/docs/en/reference/default-theme-config.md b/docs/en/reference/default-theme-config.md index c8afc554..8f71d4af 100644 --- a/docs/en/reference/default-theme-config.md +++ b/docs/en/reference/default-theme-config.md @@ -457,3 +457,38 @@ Can be used to customize the label of the skip to content link. This link is sho - Default: `false` Whether to show an external link icon next to external links in markdown. + +## `useLayout` + +Returns layout-related data. The returned object has the following type: + +```ts +interface { + isHome: ComputedRef + + sidebar: ComputedRef + sidebarGroups: ComputedRef + hasSidebar: ComputedRef + isSidebarEnabled: ComputedRef + + hasAside: ComputedRef + leftAside: ComputedRef + + headers: ShallowRef + hasLocalNav: ComputedRef +} +``` + +**Example:** + +```vue + + + +``` diff --git a/docs/en/reference/default-theme-sidebar.md b/docs/en/reference/default-theme-sidebar.md index 9a64a074..67893cf6 100644 --- a/docs/en/reference/default-theme-sidebar.md +++ b/docs/en/reference/default-theme-sidebar.md @@ -180,36 +180,3 @@ export default { } } ``` - -## `useSidebar` - -Returns sidebar-related data. The returned object has the following type: - -```ts -export interface DocSidebar { - isOpen: Ref - sidebar: ComputedRef - sidebarGroups: ComputedRef - hasSidebar: ComputedRef - hasAside: ComputedRef - leftAside: ComputedRef - isSidebarEnabled: ComputedRef - open: () => void - close: () => void - toggle: () => void -} -``` - -**Example:** - -```vue - - - -``` diff --git a/docs/en/reference/default-theme-team-page.md b/docs/en/reference/default-theme-team-page.md index 29b071ff..6c37c6a7 100644 --- a/docs/en/reference/default-theme-team-page.md +++ b/docs/en/reference/default-theme-team-page.md @@ -53,12 +53,12 @@ const members = [ Say hello to our awesome team. - + ``` The above will display a team member in card looking element. It should display something similar to below. - + `` component comes in 2 different sizes, `small` and `medium`. While it boils down to your preference, usually `small` size should fit better when used in doc page. Also, you may add more properties to each member such as adding "description" or "sponsor" button. Learn more about it in [``](#vpteammembers). @@ -107,9 +107,7 @@ const members = [ team, some of whom have chosen to be featured below. - + ``` diff --git a/docs/en/reference/frontmatter-config.md b/docs/en/reference/frontmatter-config.md index 955d4ad7..4d6f86c0 100644 --- a/docs/en/reference/frontmatter-config.md +++ b/docs/en/reference/frontmatter-config.md @@ -225,3 +225,16 @@ Then you can customize styles of this specific page in `.vitepress/theme/custom. /* page-specific styles */ } ``` + +### isHome + +- Type: `boolean` + +The default theme relies on checks like `frontmatter.layout === 'home'` to determine if the current page is the home page.\ +This is useful when you want to force show the home page elements in a custom layout. + +```yaml +--- +isHome: true +--- +``` diff --git a/docs/es/guide/deploy.md b/docs/es/guide/deploy.md index 005f05c9..5d2c9c06 100644 --- a/docs/es/guide/deploy.md +++ b/docs/es/guide/deploy.md @@ -163,7 +163,7 @@ No active opciones como _Auto Minify_ para código HTML. Eso removera comentario - name: Setup Node uses: actions/setup-node@v4 with: - node-version: 20 + node-version: 22 cache: npm # o pnpm / yarn - name: Setup Pages uses: actions/configure-pages@v4 diff --git a/docs/es/guide/markdown.md b/docs/es/guide/markdown.md index 174e5752..00f973ed 100644 --- a/docs/es/guide/markdown.md +++ b/docs/es/guide/markdown.md @@ -234,7 +234,7 @@ Este es un recipiente especial que puee ser usado para evitar conflictos de esti ```md ::: raw -Envuelve en un
+Envuelve en un `
` ::: ``` diff --git a/docs/es/guide/using-vue.md b/docs/es/guide/using-vue.md index 9d18d92d..0131cc76 100644 --- a/docs/es/guide/using-vue.md +++ b/docs/es/guide/using-vue.md @@ -286,4 +286,4 @@ Vue ofrece soporte para IntelliSense de forma predeterminada mediante el [Plugin "vue.server.includeLanguages": ["vue", "markdown"] } ``` -::: \ No newline at end of file +::: diff --git a/docs/es/index.md b/docs/es/index.md index 6ced6057..04a4c68f 100644 --- a/docs/es/index.md +++ b/docs/es/index.md @@ -19,7 +19,7 @@ hero: text: GitHub link: https://github.com/vuejs/vitepress image: - src: /vitepress-logo-large.webp + src: /vitepress-logo-large.svg alt: VitePress features: diff --git a/docs/es/reference/default-theme-sidebar.md b/docs/es/reference/default-theme-sidebar.md index 05dd42f3..41cd5cac 100644 --- a/docs/es/reference/default-theme-sidebar.md +++ b/docs/es/reference/default-theme-sidebar.md @@ -181,37 +181,3 @@ export default { } } ``` - -## `useSidebar` - -Devuelve datos relacionados con la barra lateral. El objeto devuelto tiene el siguiente tipo: - -```ts -export interface DocSidebar { - isOpen: Ref - sidebar: ComputedRef - sidebarGroups: ComputedRef - hasSidebar: ComputedRef - hasAside: ComputedRef - leftAside: ComputedRef - isSidebarEnabled: ComputedRef - open: () => void - close: () => void - toggle: () => void -} -``` - -**Exemplo:** - -```vue - - - -``` diff --git a/docs/es/reference/default-theme-team-page.md b/docs/es/reference/default-theme-team-page.md index 1f6492a8..996e8f18 100644 --- a/docs/es/reference/default-theme-team-page.md +++ b/docs/es/reference/default-theme-team-page.md @@ -53,12 +53,12 @@ const members = [ Saluda a nuestro increible equipo. - + ``` El código anterior mostrará a un miembro del equipo en un elemento similar a una tarjeta. Debería mostrar algo similar a lo siguiente. - + El componente `` viene en dos tamaños diferentes, pequeño `small` y médio `medium`. Si bien es una cuestión de preferencia, generalmente el tamaño `small` debería encajar mejor cuando se use en la página del documento. Además, puede agregar más propiedades a cada miembro, como agregar el botón "descripción" o "patrocinador". Obtenga más información sobre en [``](#vpteammembers). @@ -107,9 +107,7 @@ const members = [ Algunos de los miembros han elegido aparecer a continuación. - + ``` diff --git a/docs/fa/guide/asset-handling.md b/docs/fa/guide/asset-handling.md index 94554217..efa4710f 100644 --- a/docs/fa/guide/asset-handling.md +++ b/docs/fa/guide/asset-handling.md @@ -60,4 +60,4 @@ const { theme } = useData() -``` \ No newline at end of file +``` diff --git a/docs/fa/guide/deploy.md b/docs/fa/guide/deploy.md index dcc74f69..1b89f334 100644 --- a/docs/fa/guide/deploy.md +++ b/docs/fa/guide/deploy.md @@ -161,7 +161,7 @@ Cache-Control: max-age=31536000,immutable - name: Setup Node uses: actions/setup-node@v4 with: - node-version: 20 + node-version: 22 cache: npm # or pnpm / yarn - name: Setup Pages uses: actions/configure-pages@v4 diff --git a/docs/fa/guide/frontmatter.md b/docs/fa/guide/frontmatter.md index 7f748b1e..4b4af163 100644 --- a/docs/fa/guide/frontmatter.md +++ b/docs/fa/guide/frontmatter.md @@ -45,4 +45,4 @@ editLink: true "editLink": true } --- -``` \ No newline at end of file +``` diff --git a/docs/fa/guide/markdown.md b/docs/fa/guide/markdown.md index 862fe7a0..1d2ca9f9 100644 --- a/docs/fa/guide/markdown.md +++ b/docs/fa/guide/markdown.md @@ -233,7 +233,7 @@ export default defineConfig({ ```md ::: raw -بسته‌بندی در یک
+بسته‌بندی در یک `
` ::: ``` diff --git a/docs/fa/guide/migration-from-vitepress-0.md b/docs/fa/guide/migration-from-vitepress-0.md index 8a1380df..211bb0f9 100644 --- a/docs/fa/guide/migration-from-vitepress-0.md +++ b/docs/fa/guide/migration-from-vitepress-0.md @@ -20,4 +20,4 @@ ## پیکربندی Frontmatter - گزینه `home: true` به `layout: home` تغییر کرده است. همچنین، تنظیمات مربوط به صفحه اصلی بسیار تغییر کرده‌اند تا ویژگی‌های اضافی را ارائه دهند. برای جزئیات بیشتر، [راهنمای صفحه اصلی](../reference/default-theme-home-page) را ببینید. -- گزینه `footer` به [`themeConfig.footer`](../reference/default-theme-config#footer) منتقل شده است. \ No newline at end of file +- گزینه `footer` به [`themeConfig.footer`](../reference/default-theme-config#footer) منتقل شده است. diff --git a/docs/fa/guide/migration-from-vuepress.md b/docs/fa/guide/migration-from-vuepress.md index a7f8fbc8..536a37c5 100644 --- a/docs/fa/guide/migration-from-vuepress.md +++ b/docs/fa/guide/migration-from-vuepress.md @@ -27,4 +27,4 @@ --- -ادامه دارد... \ No newline at end of file +ادامه دارد... diff --git a/docs/fa/guide/mpa-mode.md b/docs/fa/guide/mpa-mode.md index 9e08e7b3..a18bb1c2 100644 --- a/docs/fa/guide/mpa-mode.md +++ b/docs/fa/guide/mpa-mode.md @@ -20,4 +20,4 @@ document.querySelector('h1').addEventListener('click', () => { ` - - -``` \ No newline at end of file diff --git a/docs/fa/reference/default-theme-team-page.md b/docs/fa/reference/default-theme-team-page.md index ccd9738d..57fc2814 100644 --- a/docs/fa/reference/default-theme-team-page.md +++ b/docs/fa/reference/default-theme-team-page.md @@ -53,12 +53,12 @@ const members = [ با سلام به تیم فوق‌العاده‌ی ما خوش آمدید. - + ``` بالا به صورت عنصری با شکل کارتی اعضای تیم را نمایش می‌دهد. باید به شکل زیر نمایش داده شود. - + کامپوننت `` دارای دو اندازه مختلف، `small` و `medium` است. معمولاً اندازه `small` برای استفاده در صفحات مستندات مناسب‌تر است. همچنین می‌توانید ویژگی‌های بیشتری برای هر عضو اضافه کنید مانند "توضیحات" یا "دکمه حامی". جهت کسب اطلاعات بیشتر به [``](#vpteammembers) مراجعه کنید. @@ -106,9 +106,7 @@ const members = [ توسعه ویت‌پرس توسط تیمی بین‌المللی راهنمایی می‌شود، برخی از اعضا که انتخاب کرده‌اند تا در زیر نمایش داده شوند. - + ``` diff --git a/docs/fa/reference/runtime-api.md b/docs/fa/reference/runtime-api.md index 31059ef1..67e076cd 100644 --- a/docs/fa/reference/runtime-api.md +++ b/docs/fa/reference/runtime-api.md @@ -165,4 +165,4 @@ title: سلام ```md - نام بسته: {{ $params.pkg }} - نسخه: {{ $params.version }} -``` \ No newline at end of file +``` diff --git a/docs/fa/reference/site-config.md b/docs/fa/reference/site-config.md index 0585f5c2..72343ffa 100644 --- a/docs/fa/reference/site-config.md +++ b/docs/fa/reference/site-config.md @@ -723,4 +723,4 @@ export default { interface TransformPageContext { siteConfig: SiteConfig } -``` \ No newline at end of file +``` diff --git a/docs/ko/guide/deploy.md b/docs/ko/guide/deploy.md index 797015da..7a57a8ad 100644 --- a/docs/ko/guide/deploy.md +++ b/docs/ko/guide/deploy.md @@ -162,7 +162,7 @@ HTML 코드에 대해 _Auto Minify_ 옵션을 활성화하지 마세요. 이는 - name: Setup Node uses: actions/setup-node@v4 with: - node-version: 20 + node-version: 22 cache: npm # 또는 pnpm / yarn - name: Setup Pages uses: actions/configure-pages@v4 diff --git a/docs/ko/guide/markdown.md b/docs/ko/guide/markdown.md index 0e12ff65..5f03bbf6 100644 --- a/docs/ko/guide/markdown.md +++ b/docs/ko/guide/markdown.md @@ -233,7 +233,7 @@ export default defineConfig({ ```md ::: raw -
로 감쌉니다 +`
`로 감쌉니다 ::: ``` diff --git a/docs/ko/index.md b/docs/ko/index.md index 6a16ff49..3ddaa07d 100644 --- a/docs/ko/index.md +++ b/docs/ko/index.md @@ -19,7 +19,7 @@ hero: text: GitHub link: https://github.com/vuejs/vitepress image: - src: /vitepress-logo-large.webp + src: /vitepress-logo-large.svg alt: VitePress features: diff --git a/docs/ko/reference/default-theme-sidebar.md b/docs/ko/reference/default-theme-sidebar.md index 21e19ccc..8e4709cd 100644 --- a/docs/ko/reference/default-theme-sidebar.md +++ b/docs/ko/reference/default-theme-sidebar.md @@ -180,36 +180,3 @@ export default { } } ``` - -## `useSidebar` - -사이드바 관련 데이터를 반환합니다. 반환된 객체는 다음과 같은 타입을 가집니다: - -```ts -export interface DocSidebar { - isOpen: Ref - sidebar: ComputedRef - sidebarGroups: ComputedRef - hasSidebar: ComputedRef - hasAside: ComputedRef - leftAside: ComputedRef - isSidebarEnabled: ComputedRef - open: () => void - close: () => void - toggle: () => void -} -``` - -**예제:** - -```vue - - - -``` diff --git a/docs/ko/reference/default-theme-team-page.md b/docs/ko/reference/default-theme-team-page.md index 2123f349..b4fddb0f 100644 --- a/docs/ko/reference/default-theme-team-page.md +++ b/docs/ko/reference/default-theme-team-page.md @@ -53,12 +53,12 @@ const members = [ Say hello to our awesome team. - + ``` 위 코드는 카드 형태의 엘리먼트로 팀 구성원을 표시합니다. 아래와 비슷한 형태로 표시됩니다. - + `` 컴포넌트는 `small`과 `medium` 두 가지 크기로 제공됩니다. 개인의 선호도에 따라 선택할 수 있지만, 일반적으로 `small` 사이즈가 문서 페이지에 더 적합합니다. 또한, 각 구성원에 "설명"이나 "후원" 버튼과 같은 프로퍼티를 추가할 수도 있습니다. 자세한 내용은 [``](#vpteammembers)에서 확인할 수 있습니다. @@ -107,9 +107,7 @@ const members = [ team, some of whom have chosen to be featured below. - + ``` diff --git a/docs/package.json b/docs/package.json index d3cc0755..18ffeb9c 100644 --- a/docs/package.json +++ b/docs/package.json @@ -15,6 +15,6 @@ "open-cli": "^8.0.0", "postcss-rtlcss": "^5.6.0", "vitepress": "workspace:*", - "vitepress-plugin-group-icons": "^1.3.5" + "vitepress-plugin-group-icons": "^1.3.8" } } diff --git a/docs/pt/guide/deploy.md b/docs/pt/guide/deploy.md index 9a03631b..b112bf7d 100644 --- a/docs/pt/guide/deploy.md +++ b/docs/pt/guide/deploy.md @@ -163,7 +163,7 @@ Não ative opções como _Auto Minify_ para código HTML. Isso removerá coment - name: Setup Node uses: actions/setup-node@v4 with: - node-version: 20 + node-version: 22 cache: npm # ou pnpm / yarn - name: Setup Pages uses: actions/configure-pages@v4 diff --git a/docs/pt/guide/markdown.md b/docs/pt/guide/markdown.md index 25f03482..b5245259 100644 --- a/docs/pt/guide/markdown.md +++ b/docs/pt/guide/markdown.md @@ -233,7 +233,7 @@ Este é um recipiente especial que pode ser usado para evitar conflitos de estil ```md ::: raw -Envolve em um
+Envolve em um `
` ::: ``` diff --git a/docs/pt/index.md b/docs/pt/index.md index fccf03a0..71fff26b 100644 --- a/docs/pt/index.md +++ b/docs/pt/index.md @@ -19,7 +19,7 @@ hero: text: GitHub link: https://github.com/vuejs/vitepress image: - src: /vitepress-logo-large.webp + src: /vitepress-logo-large.svg alt: VitePress features: diff --git a/docs/pt/reference/default-theme-sidebar.md b/docs/pt/reference/default-theme-sidebar.md index 62c3b3b1..0d8baf8d 100644 --- a/docs/pt/reference/default-theme-sidebar.md +++ b/docs/pt/reference/default-theme-sidebar.md @@ -180,36 +180,3 @@ export default { } } ``` - -## `useSidebar` - -Retorna dados relacionados à barra lateral. O objeto retornado tem o seguinte tipo: - -```ts -export interface DocSidebar { - isOpen: Ref - sidebar: ComputedRef - sidebarGroups: ComputedRef - hasSidebar: ComputedRef - hasAside: ComputedRef - leftAside: ComputedRef - isSidebarEnabled: ComputedRef - open: () => void - close: () => void - toggle: () => void -} -``` - -**Exemplo:** - -```vue - - - -``` diff --git a/docs/pt/reference/default-theme-team-page.md b/docs/pt/reference/default-theme-team-page.md index 1daa47a5..32a9db0d 100644 --- a/docs/pt/reference/default-theme-team-page.md +++ b/docs/pt/reference/default-theme-team-page.md @@ -53,12 +53,12 @@ const members = [ Diga olá à nossa equipe incrível. - + ``` O código acima exibirá um membro da equipe em um elemento tipo cartão. Ele deve exibir algo semelhante ao abaixo. - + O componente `` vem em 2 tamanhos diferentes, pequeno `small` e médio `medium`. Enquanto é uma questão de preferência, geralmente o tamanho `small` deve encaixar melhor quando usado na página de documento. Além disso, você pode adicionar mais propriedades a cada membro, como adicionar o botão "descrição" ou "patrocinador". Saiba mais sobre em [``](#vpteammembers). @@ -107,9 +107,7 @@ const members = [ alguns dos membros escolheram ser apresentados abaixo. - + ``` diff --git a/docs/public/vitepress-logo-large.svg b/docs/public/vitepress-logo-large.svg new file mode 120000 index 00000000..59e331aa --- /dev/null +++ b/docs/public/vitepress-logo-large.svg @@ -0,0 +1 @@ +../../art/vitepress-logo.svg \ No newline at end of file diff --git a/docs/public/vitepress-logo-mini.svg b/docs/public/vitepress-logo-mini.svg deleted file mode 100644 index 47756f7a..00000000 --- a/docs/public/vitepress-logo-mini.svg +++ /dev/null @@ -1,21 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - diff --git a/docs/public/vitepress-logo-mini.svg b/docs/public/vitepress-logo-mini.svg new file mode 120000 index 00000000..f7c9b3af --- /dev/null +++ b/docs/public/vitepress-logo-mini.svg @@ -0,0 +1 @@ +../../art/vitepress-logo-mini.svg \ No newline at end of file diff --git a/docs/ru/guide/deploy.md b/docs/ru/guide/deploy.md index 0de4fbe0..ff12be6c 100644 --- a/docs/ru/guide/deploy.md +++ b/docs/ru/guide/deploy.md @@ -111,7 +111,7 @@ Cache-Control: max-age=31536000,immutable - **Build Command:** `npm run docs:build` - **Output Directory:** `docs/.vitepress/dist` -- **Node Version:** `18` (или выше) +- **Node Version:** `20` (или выше) ::: warning ПРЕДУПРЕЖДЕНИЕ Не включайте такие опции, как _Auto Minify_ для HTML-кода. Он удалит из вывода комментарии, которые имеют значение для Vue. При их удалении могут возникать ошибки несоответствия гидратации. @@ -163,7 +163,7 @@ Cache-Control: max-age=31536000,immutable - name: Setup Node uses: actions/setup-node@v4 with: - node-version: 20 + node-version: 22 cache: npm # или pnpm / yarn - name: Setup Pages uses: actions/configure-pages@v4 diff --git a/docs/ru/guide/extending-default-theme.md b/docs/ru/guide/extending-default-theme.md index d3e5fe8f..a8f0acc7 100644 --- a/docs/ru/guide/extending-default-theme.md +++ b/docs/ru/guide/extending-default-theme.md @@ -123,7 +123,7 @@ export default { ## Слоты макета {#layout-slots} -Компонент `` темы по умолчанию имеет несколько слотов, которые можно использовать для вставки содержимого в определённые места страницы. Вот пример внедрения компонента в структуру before: +Компонент `` темы по умолчанию имеет несколько слотов, которые можно использовать для вставки содержимого в определённые места страницы. Вот пример внедрения компонента перед оглавлением: ```js [.vitepress/theme/index.js] import DefaultTheme from 'vitepress/theme' @@ -131,8 +131,8 @@ import MyLayout from './MyLayout.vue' export default { extends: DefaultTheme, - // переопределяем макет с помощью компонента-обёртки, который - // вводит слоты + // переопределяем макет с помощью компонента-обёртки, + // который внедряет слоты Layout: MyLayout } ``` @@ -147,7 +147,7 @@ const { Layout } = DefaultTheme diff --git a/docs/ru/guide/i18n.md b/docs/ru/guide/i18n.md index d698f030..b982eece 100644 --- a/docs/ru/guide/i18n.md +++ b/docs/ru/guide/i18n.md @@ -27,7 +27,7 @@ export default defineConfig({ ru: { label: 'Русский', lang: 'ru', // необязательный, будет добавлен как атрибут `lang` в тег `html` - link: '/ru/guide' // по умолчанию /ru/ -- отображается в меню переводов на панели навигации, может быть внешним + link: '/ru/guide' // по умолчанию /ru/ -- ссылка в меню переводов на панели навигации, может быть внешней // другие свойства, специфичные для локали... } diff --git a/docs/ru/guide/markdown.md b/docs/ru/guide/markdown.md index a84fd0f6..b67e1355 100644 --- a/docs/ru/guide/markdown.md +++ b/docs/ru/guide/markdown.md @@ -259,7 +259,7 @@ console.log('Привет, VitePress!') ```md ::: raw -Заворачивается в
+Заворачивается в `
` ::: ``` @@ -844,7 +844,7 @@ export default config Может быть создана с помощью `.foorc.json`. ``` -**Эквивалентный код** +**Соответствующий код** ```md # Документация @@ -883,7 +883,7 @@ export default config ``` -**Эквивалентный код** +**Соответствующий код** ```md # Документация @@ -899,6 +899,53 @@ export default config Обратите внимание, что это не приводит к ошибкам, если ваш файл отсутствует. Поэтому при использовании этой функции убедитесь, что содержимое отображается так, как ожидается. ::: +Вместо регионов VS Code вы также можете использовать якоря заголовков, чтобы включить определённый раздел файла. Например, если у вас есть заголовок в вашем markdown-файле, например: + +```md +## Мой основной раздел + +Какой-то контент здесь. + +### Мой подраздел + +Ещё немного контента здесь. + +## Другой раздел + +Контент вне `Моего основного раздела`. +``` + +Вы можете включить раздел `Мой основной раздел` следующим образом: + +```md +## Мой дополнительный раздел + +``` + +**Соответствующий код** + +```md +## Мой дополнительный раздел + +Какой-то контент здесь. + +### Мой подраздел + +Ещё немного контента здесь. +``` + +Здесь `мои-основнои-раздел` — это сгенерированный идентификатор элемента заголовка. Если его нелегко угадать, вы можете открыть файл в браузере и нажать на якорь заголовка (символ `#` слева от заголовка при наведении), чтобы увидеть идентификатор в адресной строке. Или используйте инструменты разработчика браузера для проверки элемента. Кроме того, вы также можете указать идентификатор для файла части следующим образом: + +```md +## Мой основной раздел {#custom-id} +``` + +и включить его следующим образом: + +```md + +``` + ## Математические уравнения {#math-equations} В настоящее время эта фича предоставляется по желанию. Чтобы включить её, вам нужно установить `markdown-it-mathjax3` и установить значение `true` для опции `markdown.math` в вашем файле конфигурации: diff --git a/docs/ru/guide/using-vue.md b/docs/ru/guide/using-vue.md index 8b6051aa..e031c3f7 100644 --- a/docs/ru/guide/using-vue.md +++ b/docs/ru/guide/using-vue.md @@ -148,13 +148,13 @@ HTML, обёрнутый ``, будет отображаться как е **Разметка** ```md -Это {{ будет отображаться как есть}}. +Это {{ будет отображаться как есть }}. ``` **Результат**
-

Это {{ будет отображаться как есть}}

+

Это {{ будет отображаться как есть }}

В качестве альтернативы вы можете обернуть весь абзац в пользовательский контейнер `v-pre`: @@ -175,7 +175,7 @@ HTML, обёрнутый ``, будет отображаться как е
-## Unescape в блоках кода {#unescape-in-code-blocks} +## Отключение экранирования в блоках кода {#unescape-in-code-blocks} По умолчанию все изолированные блоки кода автоматически оборачиваются `v-pre`, поэтому внутри них не будет обрабатываться синтаксис Vue. Чтобы включить интерполяцию в стиле Vue внутри фигурных скобок, можно добавить к языку суффикс `-vue`, например `js-vue`: @@ -199,7 +199,9 @@ HTML, обёрнутый ``, будет отображаться как е VitePress имеет [встроенную поддержку](https://vitejs.dev/guide/features.html#css-pre-processors) для препроцессоров CSS: файлы `.scss`, `.sass`, `.less`, `.styl` и `.stylus`. Для них не нужно устанавливать специфические для Vite плагины, но сам соответствующий препроцессор должен быть установлен: -``` +::: code-group + +```sh [npm] # .scss и .sass npm install -D sass @@ -210,7 +212,41 @@ npm install -D less npm install -D stylus ``` -Затем вы можете использовать следующее в Markdown и компонентах темы: +```sh [pnpm] +# .scss и .sass +pnpm add -D sass + +# .less +pnpm add -D less + +# .styl и .stylus +pnpm add -D stylus +``` + +```sh [yarn] +# .scss и .sass +yarn add -D sass + +# .less +yarn add -D less + +# .styl и .stylus +yarn add -D stylus +``` + +```sh [bun] +# .scss и .sass +bun add -D sass + +# .less +bun add -D less + +# .styl и .stylus +bun add -D stylus +``` +::: + +Затем вы можете использовать соответствующий атрибут `lang` в Markdown и компонентах темы: ```vue