diff --git a/.github/contributing/writing-guide.md b/.github/contributing/writing-guide.md index be69caad5f..a686f0924e 100644 --- a/.github/contributing/writing-guide.md +++ b/.github/contributing/writing-guide.md @@ -85,7 +85,7 @@ Writing documentation is an exercise in empathy. We're not describing an objecti ### Tips, Callouts, Alerts, and Line Highlights -We have some dedicated styles to denote something that's worth highlighting in a particular way. These are captured [on this page](https://vitepress.vuejs.org/guide/markdown.html#custom-containers). **They are to be used sparingly.** +We have some dedicated styles to denote something that's worth highlighting in a particular way. These are captured [on this page](https://vitepress.dev/guide/markdown#custom-containers). **They are to be used sparingly.** There is a certain temptation to abuse these styles, as one can simply add a change inside a callout. However, this breaks up the flow of reading for the user and should only be used in special circumstances. Wherever possible, we should attempt to create a narrative and flow within the page to respect the reader's cognitive load. diff --git a/.gitignore b/.gitignore index 4f548e6b75..e52da2f480 100644 --- a/.gitignore +++ b/.gitignore @@ -98,6 +98,7 @@ dist/ # vitepress build output .vitepress/dist .vitepress/cache +.vitepress/.temp # Serverless directories .serverless/ @@ -110,3 +111,6 @@ src/api/index.json src/examples/data.json src/tutorial/data.json draft.md + +# folders created by IDE +.idea diff --git a/.npmrc b/.npmrc new file mode 100644 index 0000000000..e941d13c20 --- /dev/null +++ b/.npmrc @@ -0,0 +1 @@ +package-manager-strict=false diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000000..65a7d0588f --- /dev/null +++ b/.prettierignore @@ -0,0 +1 @@ +*.vue diff --git a/.vitepress/config.ts b/.vitepress/config.ts index a97b6f7139..80c74de089 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -1,7 +1,8 @@ import fs from 'fs' import path from 'path' -import { defineConfigWithTheme } from 'vitepress' +import { defineConfigWithTheme, type HeadConfig, type Plugin } from 'vitepress' import type { Config as ThemeConfig } from '@vue/theme' +import llmstxt from 'vitepress-plugin-llms' import baseConfig from '@vue/theme/config' import { headerPlugin } from './headerMdPlugin' // import { textAdPlugin } from './textAdMdPlugin' @@ -17,6 +18,7 @@ const nav: ThemeConfig['nav'] = [ { text: 'Quick Start', link: '/guide/quick-start' }, // { text: 'Style Guide', link: '/style-guide/' }, { text: 'Glossary', link: '/glossary/' }, + { text: 'Error Reference', link: '/error-reference/' }, { text: 'Vue 2 Docs', link: 'https://v2.vuejs.org/' @@ -44,10 +46,12 @@ const nav: ThemeConfig['nav'] = [ text: 'Resources', items: [ { text: 'Partners', link: '/partners/' }, + { text: 'Developers', link: '/developers/' }, { text: 'Themes', link: '/ecosystem/themes' }, + { text: 'UI Components', link: 'https://ui-libs.vercel.app/' }, { text: 'Certification', - link: 'https://certification.vuejs.org/?ref=vuejs-nav' + link: 'https://certificates.dev/vuejs/?ref=vuejs-nav' }, { text: 'Jobs', link: 'https://vuejobs.com/?ref=vuejs' }, { text: 'T-Shirt Shop', link: 'https://vue.threadless.com/' } @@ -111,6 +115,7 @@ const nav: ThemeConfig['nav'] = [ link: '/about/community-guide' }, { text: 'Code of Conduct', link: '/about/coc' }, + { text: 'Privacy Policy', link: '/about/privacy' }, { text: 'The Documentary', link: 'https://www.youtube.com/watch?v=OrxmtDw4pVI' @@ -122,9 +127,13 @@ const nav: ThemeConfig['nav'] = [ link: '/sponsor/' }, { - text: 'Partners', - link: '/partners/', - activeMatch: `^/partners/` + text: 'Experts', + badge: { text: 'NEW' }, + activeMatch: `^/(partners|developers)/`, + items: [ + { text: 'Partners', link: '/partners/' }, + { text: 'Developers', link: '/developers/', badge: { text: 'NEW' } } + ] } ] @@ -173,15 +182,15 @@ export const sidebar: ThemeConfig['sidebar'] = { link: '/guide/essentials/event-handling' }, { text: 'Form Input Bindings', link: '/guide/essentials/forms' }, - { - text: 'Lifecycle Hooks', - link: '/guide/essentials/lifecycle' - }, { text: 'Watchers', link: '/guide/essentials/watchers' }, { text: 'Template Refs', link: '/guide/essentials/template-refs' }, { text: 'Components Basics', link: '/guide/essentials/component-basics' + }, + { + text: 'Lifecycle Hooks', + link: '/guide/essentials/lifecycle' } ] }, @@ -365,6 +374,10 @@ export const sidebar: ThemeConfig['sidebar'] = { { text: 'Dependency Injection', link: '/api/composition-api-dependency-injection' + }, + { + text: 'Helpers', + link: '/api/composition-api-helpers' } ] }, @@ -414,10 +427,12 @@ export const sidebar: ThemeConfig['sidebar'] = { { text: 'Advanced APIs', items: [ + { text: 'Custom Elements', link: '/api/custom-elements' }, { text: 'Render Function', link: '/api/render-function' }, { text: 'Server-Side Rendering', link: '/api/ssr' }, { text: 'TypeScript Utility Types', link: '/api/utility-types' }, - { text: 'Custom Renderer', link: '/api/custom-renderer' } + { text: 'Custom Renderer', link: '/api/custom-renderer' }, + { text: 'Compile-Time Flags', link: '/api/compile-time-flags' } ] } ], @@ -482,10 +497,6 @@ export const sidebar: ThemeConfig['sidebar'] = { text: 'List with Transitions', link: '/examples/#list-transition' }, - { - text: 'TodoMVC', - link: '/examples/#todomvc' - } ] }, { @@ -556,9 +567,24 @@ export const sidebar: ThemeConfig['sidebar'] = { // const i18n: ThemeConfig['i18n'] = { // } +function inlineScript(file: string): HeadConfig { + return [ + 'script', + {}, + fs.readFileSync( + path.resolve(__dirname, `./inlined-scripts/${file}`), + 'utf-8' + ) + ] +} + export default defineConfigWithTheme({ extends: baseConfig, + sitemap: { + hostname: 'https://vuejs.org/' + }, + lang: 'en-US', title: 'Vue.js', description: 'Vue.js - The Progressive JavaScript Framework', @@ -567,30 +593,34 @@ export default defineConfigWithTheme({ head: [ ['meta', { name: 'theme-color', content: '#3c8772' }], - ['meta', { name: 'twitter:site', content: '@vuejs' }], - ['meta', { name: 'twitter:card', content: 'summary' }], + ['meta', { property: 'og:url', content: 'https://vuejs.org/' }], + ['meta', { property: 'og:type', content: 'website' }], + ['meta', { property: 'og:title', content: 'Vue.js' }], + [ + 'meta', + { + property: 'og:description', + content: 'Vue.js - The Progressive JavaScript Framework' + } + ], [ 'meta', { - name: 'twitter:image', + property: 'og:image', content: 'https://vuejs.org/images/logo.png' } ], + ['meta', { name: 'twitter:site', content: '@vuejs' }], + ['meta', { name: 'twitter:card', content: 'summary' }], [ 'link', { rel: 'preconnect', - href: 'https://sponsors.vuejs.org/' + href: 'https://automation.vuejs.org/' } ], - [ - 'script', - {}, - fs.readFileSync( - path.resolve(__dirname, './inlined-scripts/restorePreference.js'), - 'utf-8' - ) - ], + inlineScript('restorePreference.js'), + inlineScript('uwu.js'), [ 'script', { @@ -606,7 +636,8 @@ export default defineConfigWithTheme({ src: 'https://vueschool.io/banner.js?affiliate=vuejs&type=top', async: 'true' } - ] + ], + inlineScript('perfops.js') ], themeConfig: { @@ -636,6 +667,51 @@ export default defineConfigWithTheme({ text: 'Français', repo: 'https://github.com/vuejs-translations/docs-fr' }, + { + link: 'https://ko.vuejs.org/', + text: '한국어', + repo: 'https://github.com/vuejs-translations/docs-ko' + }, + { + link: 'https://pt.vuejs.org/', + text: 'Português', + repo: 'https://github.com/vuejs-translations/docs-pt' + }, + { + link: 'https://bn.vuejs.org/', + text: 'বাংলা', + repo: 'https://github.com/vuejs-translations/docs-bn' + }, + { + link: 'https://it.vuejs.org/', + text: 'Italiano', + repo: 'https://github.com/vuejs-translations/docs-it' + }, + { + link: 'https://fa.vuejs.org/', + text: 'فارسی', + repo: 'https://github.com/vuejs-translations/docs-fa' + }, + { + link: 'https://ru.vuejs.org/', + text: 'Русский', + repo: 'https://github.com/vuejs-translations/docs-ru' + }, + { + link: 'https://cs.vuejs.org/', + text: 'Čeština', + repo: 'https://github.com/vuejs-translations/docs-cs' + }, + { + link: 'https://zh-hk.vuejs.org/', + text: '繁體中文', + repo: 'https://github.com/vuejs-translations/docs-zh-hk' + }, + { + link: 'https://pl.vuejs.org/', + text: 'Polski', + repo: 'https://github.com/vuejs-translations/docs-pl', + }, { link: '/translations/', text: 'Help Us Translate!', @@ -646,7 +722,7 @@ export default defineConfigWithTheme({ algolia: { indexName: 'vuejs', appId: 'ML0LEBN7FQ', - apiKey: 'f49cbd92a74532cc55cfbffa5e5a7d01', + apiKey: '21cf9df0734770a2448a9da64a700c22', searchParameters: { facetFilters: ['version:v3'] } @@ -660,7 +736,7 @@ export default defineConfigWithTheme({ socialLinks: [ { icon: 'github', link: 'https://github.com/vuejs/' }, { icon: 'twitter', link: 'https://twitter.com/vuejs' }, - { icon: 'discord', link: 'https://discord.com/invite/HBherRA' } + { icon: 'discord', link: 'https://discord.com/invite/vue' } ], editLink: { @@ -678,9 +754,10 @@ export default defineConfigWithTheme({ }, markdown: { + theme: 'github-dark', config(md) { md.use(headerPlugin) - // .use(textAdPlugin) + // .use(textAdPlugin) } }, @@ -704,11 +781,34 @@ export default defineConfigWithTheme({ } }, build: { - minify: 'terser', chunkSizeWarningLimit: Infinity }, json: { stringify: true - } + }, + plugins: [ + llmstxt({ + ignoreFiles: [ + 'about/team/**/*', + 'about/team.md', + 'about/privacy.md', + 'about/coc.md', + 'developers/**/*', + 'ecosystem/themes.md', + 'examples/**/*', + 'partners/**/*', + 'sponsor/**/*', + 'index.md' + ], + customLLMsTxtTemplate: `\ +# Vue.js + +Vue.js - The Progressive JavaScript Framework + +## Table of Contents + +{toc}` + }) as Plugin + ] } }) diff --git a/.vitepress/inlined-scripts/perfops.js b/.vitepress/inlined-scripts/perfops.js new file mode 100644 index 0000000000..381ff494a7 --- /dev/null +++ b/.vitepress/inlined-scripts/perfops.js @@ -0,0 +1,9 @@ +;((d) => { + window.rum = { key: 'a9efvfeu' } + var script = d.createElement('script') + script.src = '/rom3.min.js' + script.type = 'text/javascript' + script.defer = true + script.async = true + d.getElementsByTagName('head')[0].appendChild(script) +})(document) diff --git a/.vitepress/inlined-scripts/uwu.js b/.vitepress/inlined-scripts/uwu.js new file mode 100644 index 0000000000..5b25107e42 --- /dev/null +++ b/.vitepress/inlined-scripts/uwu.js @@ -0,0 +1,3 @@ +if (location.search.includes('?uwu')) { + document.documentElement.classList.add('uwu') +} diff --git a/.vitepress/theme/components/CallToActionSection.vue b/.vitepress/theme/components/CallToActionSection.vue new file mode 100644 index 0000000000..546d05fbd2 --- /dev/null +++ b/.vitepress/theme/components/CallToActionSection.vue @@ -0,0 +1,73 @@ + + + + + diff --git a/.vitepress/theme/components/CardList.vue b/.vitepress/theme/components/CardList.vue new file mode 100644 index 0000000000..e29722bf13 --- /dev/null +++ b/.vitepress/theme/components/CardList.vue @@ -0,0 +1,105 @@ + + + + + diff --git a/.vitepress/theme/components/Home.vue b/.vitepress/theme/components/Home.vue index 505c693adb..f5fb2f6dc7 100644 --- a/.vitepress/theme/components/Home.vue +++ b/.vitepress/theme/components/Home.vue @@ -6,13 +6,12 @@ import { load, data, base } from './sponsors' import SponsorsGroup from './SponsorsGroup.vue' import VueMasteryModal from './VueMasteryModal.vue' -onMounted(async () => { - await load() -}) +onMounted(load)