12 |
URL is: {{ url }}
14 |Path is: {{ url.pathname }}
15 | 16 | ``` 17 | 18 | ```html [Result in development] 19 |URL is: http://localhost:3000/about
20 |Path is: /about
21 | ``` 22 | 23 | :: 24 | 25 | You can find the list of the [URL instance properties](https://developer.mozilla.org/en-US/docs/Web/API/URL#instance_properties) on the MDN documentation. 26 | -------------------------------------------------------------------------------- /docs/3.api/1.composables/use-server-seo-meta.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: The useServerSeoMeta composable lets you define your site's SEO meta tags as a flat object with full TypeScript support. 3 | --- 4 | 5 | # `useServerSeoMeta` 6 | 7 | Just like [`useSeoMeta`](/docs/api/composables/use-seo-meta), [`useServerSeoMeta`](/docs/api/composables/use-server-seo-meta) composable lets you define your site's SEO meta tags as a flat object with full TypeScript support. 8 | :ReadMore{link="/docs/api/composables/use-seo-meta"} 9 | 10 | In most instances, the meta doesn't need to be reactive as robots will only scan the initial load. So we recommend using [`useServerSeoMeta`](/docs/api/composables/use-server-seo-meta) as a performance-focused utility that will not do anything (or return a `head` object) on the client. 11 | Parameters are exactly the same as with [`useSeoMeta`](/docs/api/composables/use-seo-meta) 12 | -------------------------------------------------------------------------------- /docs/3.api/2.components/7.nuxt-welcome.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: The `3 | Route: {{ $route.fullPath }} 4 |5 | 6 | -------------------------------------------------------------------------------- /test/fixtures/basic/composables/asyncDataTests.ts: -------------------------------------------------------------------------------- 1 | export const useSleep = () => useAsyncData('sleep', async () => { 2 | await new Promise(resolve => setTimeout(resolve, 50)) 3 | 4 | return 'Slept!' 5 | }) 6 | 7 | export const useCounter = () => useFetch('/api/useAsyncData/count') 8 | -------------------------------------------------------------------------------- /test/fixtures/basic/composables/badSideEffect.ts: -------------------------------------------------------------------------------- 1 | export function badSideEffect () { 2 | // ... 3 | } 4 | 5 | throw new Error('composables/badSideEffect.ts should be tree-shaken') 6 | -------------------------------------------------------------------------------- /test/fixtures/basic/composables/export-star.ts: -------------------------------------------------------------------------------- 1 | export * from './nested/bar' 2 | -------------------------------------------------------------------------------- /test/fixtures/basic/composables/foo.ts: -------------------------------------------------------------------------------- 1 | export function useFoo () { 2 | return 'auto imported from ~/composables/foo.ts' 3 | } 4 | -------------------------------------------------------------------------------- /test/fixtures/basic/composables/nested/bar.ts: -------------------------------------------------------------------------------- 1 | export function useNestedBar () { 2 | return 'auto imported from ~/composables/nested/bar.ts via star export' 3 | } 4 | -------------------------------------------------------------------------------- /test/fixtures/basic/composables/override-base.ts: -------------------------------------------------------------------------------- 1 | export const useOverrideableComposable = () => 'test from project' 2 | -------------------------------------------------------------------------------- /test/fixtures/basic/composables/random.ts: -------------------------------------------------------------------------------- 1 | export function useRandomState (max = 100, name = 'default') { 2 | return useState('random:' + name, () => Math.round(Math.random() * max)) 3 | } 4 | -------------------------------------------------------------------------------- /test/fixtures/basic/composables/template.ts: -------------------------------------------------------------------------------- 1 | export const templateAutoImport = 'auto imported from ~/composables/template.ts' 2 | -------------------------------------------------------------------------------- /test/fixtures/basic/composables/tree-shake.ts: -------------------------------------------------------------------------------- 1 | export function useServerOnlyComposable () { 2 | if (process.client) { 3 | throw new Error('this should not be called in the browser') 4 | } 5 | } 6 | 7 | export function useClientOnlyComposable () { 8 | // need to do some code that fails in node but not in the browser 9 | if (process.server) { 10 | throw new Error('this should not be called on the server') 11 | } 12 | } 13 | 14 | export function setTitleToPink () { 15 | document.querySelector('h1')!.style.color = 'pink' 16 | } 17 | -------------------------------------------------------------------------------- /test/fixtures/basic/error.vue: -------------------------------------------------------------------------------- 1 | 2 |
{{ someProp }}
4 |{{ mountedHTML }}15 |
4 | hello 5 |
6 |foo
4 |