Skip to content

Commit b7ed23b

Browse files
harlan-zwharlan-zw
committed
feat: add îles support
1 parent 4054568 commit b7ed23b

38 files changed

+4457
-13
lines changed

‎docs/v1/content/1.guide/1.getting-started/2.nuxt.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ This should be done in either your `app.vue` or `layout/default.vue` file.
7979
```vue [Composition API]
8080
<script lang="ts" setup>
8181
useSchemaOrg([
82-
// @todo Select Identity: https://vue-schema-org.netlify.app/guide/getting-started/nuxt
82+
// @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity
8383
defineWebSite({
8484
name: 'My Awesome Website',
8585
}),
@@ -90,7 +90,7 @@ useSchemaOrg([
9090

9191
```vue [Component API]
9292
<template>
93-
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/getting-started/nuxt -->
93+
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity -->
9494
<SchemaOrgWebSite name="My Awesome Website" />
9595
<SchemaOrgWebPage />
9696
</template>

‎docs/v1/content/1.guide/1.getting-started/3.vitesse.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,7 @@ This should be done in your `App.vue`.
115115
```vue [Composition API]
116116
<script lang="ts" setup>
117117
useSchemaOrg([
118-
// @todo Select Identity: https://vue-schema-org.netlify.app/guide/getting-started/nuxt
118+
// @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity
119119
defineWebSite({
120120
name: 'My Awesome Website',
121121
}),
@@ -126,7 +126,7 @@ useSchemaOrg([
126126

127127
```vue [Component API]
128128
<template>
129-
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/getting-started/nuxt -->
129+
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity -->
130130
<SchemaOrgWebSite name="My Awesome Website" />
131131
<SchemaOrgWebPage />
132132
</template>

‎docs/v1/content/1.guide/1.getting-started/4.iles.md

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
---
2+
title: îles
3+
icon: noto:desert-island
4+
description: Setup Schema.org with your îles app.
5+
---
6+
7+
## Install
8+
9+
::code-group
10+
11+
```bash [yarn]
12+
yarn add -D @vueuse/schema-org-vite
13+
```
14+
15+
```bash [npm]
16+
npm install -D @vueuse/schema-org-vite
17+
```
18+
19+
```bash [pnpm]
20+
pnpm add -D @vueuse/schema-org-vite
21+
```
22+
23+
::
24+
25+
26+
## Setup Module
27+
28+
### 1. Add Module
29+
30+
Start by adding in the îles Schema.org module which handles aliasing and component auto-imports.
31+
32+
```ts [iles.config.ts]
33+
import { defineConfig } from 'iles'
34+
import { schemaOrgIles } from '@vueuse/schema-org-vite/iles-module'
35+
36+
export default defineConfig({
37+
siteUrl: 'https://iles-docs.netlify.app/',
38+
modules: [
39+
schemaOrgIles({
40+
// select which types you'd like
41+
full: false,
42+
}),
43+
],
44+
})
45+
```
46+
47+
Note: Make sure you set your `siteUrl` if you haven't already.
48+
49+
### 2. Install Vue Plugin
50+
51+
Add the vue plugin in your `app.ts` file.
52+
53+
```ts [app.ts]
54+
import { defineApp } from 'iles'
55+
import { installSchemaOrg } from '@vueuse/schema-org-vite/iles-app'
56+
57+
export default defineApp({
58+
async enhanceApp(ctx) {
59+
installSchemaOrg(ctx, {
60+
// any default meta
61+
})
62+
},
63+
})
64+
65+
```
66+
67+
See the [User Config page](/guide/guides/user-config) for all options you can pass.
68+
69+
### 3. Add Site Schema.org
70+
71+
Within your `layouts/default.vue` file you can add your site-wide schema.
72+
73+
::code-group
74+
75+
```vue [Composition API]
76+
<script lang="ts" setup>
77+
import { defineWebPage, defineWebSite, useSchemaOrg } from '@vueuse/schema-org/runtime'
78+
79+
useSchemaOrg([
80+
defineWebPage(),
81+
defineWebSite({
82+
name: 'test',
83+
}),
84+
])
85+
</script>
86+
```
87+
88+
```vue [Component API]
89+
<template>
90+
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity -->
91+
<SchemaOrgWebPage />
92+
<SchemaOrgWebSite name="îles" />
93+
</template>
94+
```
95+
96+
::
97+
98+
### Next Steps
99+
100+
Your îles app is now serving basic Schema.org, congrats! 🎉
101+
102+
The next steps are:
103+
1. Choose an [Identity](/guide/guides/identity)
104+
2. Set up your pages for [Runtime Inferences](/guide/getting-started/how-it-works#runtime-inferences)
105+
3. Then feel free to follow some recipes:
106+
107+
- [Breadcrumbs](/guide/recipes/breadcrumbs)
108+
- [FAQ Page](/guide/recipes/faq)
109+
- [Site Search](/guide/recipes/site-search)

‎docs/v1/content/1.guide/1.getting-started/4.vite.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -164,7 +164,7 @@ useSchemaOrg([
164164
import { SchemaOrgWebPage, SchemaOrgWebSite } from '#vueuse/schema-org/runtime'
165165
</script>
166166
<template>
167-
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/getting-started/nuxt -->
167+
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity -->
168168
<SchemaOrgWebSite name="My Awesome Website" />
169169
<SchemaOrgWebPage />
170170
</template>
@@ -183,7 +183,7 @@ This should be done in your `App.vue`.
183183
```vue [Composition API]
184184
<script lang="ts" setup>
185185
useSchemaOrg([
186-
// @todo Select Identity: https://vue-schema-org.netlify.app/guide/getting-started/nuxt
186+
// @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity
187187
defineWebSite({
188188
name: 'My Awesome Website',
189189
}),
@@ -194,7 +194,7 @@ useSchemaOrg([
194194

195195
```vue [Component API]
196196
<template>
197-
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/getting-started/nuxt -->
197+
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity -->
198198
<SchemaOrgWebSite name="My Awesome Website" />
199199
<SchemaOrgWebPage />
200200
</template>

‎docs/v1/content/1.guide/1.getting-started/5.vitepress.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -134,7 +134,7 @@ useSchemaOrg([
134134
import { SchemaOrgWebPage, SchemaOrgWebSite } from '#vueuse/schema-org/runtime'
135135
</script>
136136
<template>
137-
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/getting-started/nuxt -->
137+
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity -->
138138
<SchemaOrgWebSite name="My Awesome Website" />
139139
<SchemaOrgWebPage />
140140
</template>
@@ -156,7 +156,7 @@ To add global Schema in VitePress, you need to override the default layout.
156156
```vue [Composition API]
157157
<script lang="ts" setup>
158158
useSchemaOrg([
159-
// @todo Select Identity: https://vue-schema-org.netlify.app/guide/getting-started/nuxt
159+
// @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity
160160
defineWebSite({
161161
name: 'My Awesome Website',
162162
}),
@@ -167,7 +167,7 @@ useSchemaOrg([
167167

168168
```vue [Component API]
169169
<template>
170-
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/getting-started/nuxt -->
170+
<!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity -->
171171
<SchemaOrgWebSite name="My Awesome Website" />
172172
<SchemaOrgWebPage />
173173
</template>

‎packages/vite/build.config.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,11 @@ export default defineBuildConfig({
1111
{ input: 'src/vitesse' },
1212
{ input: 'src/vitepress' },
1313
{ input: 'src/vite' },
14+
{ input: 'src/iles-app' },
15+
{ input: 'src/iles-module' },
1416
],
1517
externals: [
18+
'iles',
1619
'@vueuse/head',
1720
'vite-ssg',
1821
'vitepress',

‎packages/vite/package.json

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,16 @@
4242
"types": "./dist/vitepress.d.ts",
4343
"require": "./dist/vitepress.cjs",
4444
"import": "./dist/vitepress.mjs"
45+
},
46+
"./iles-app": {
47+
"types": "./dist/iles-app.d.ts",
48+
"require": "./dist/iles-app.cjs",
49+
"import": "./dist/iles-app.mjs"
50+
},
51+
"./iles-module": {
52+
"types": "./dist/iles-module.d.ts",
53+
"require": "./dist/iles-module.cjs",
54+
"import": "./dist/iles-module.mjs"
4555
}
4656
},
4757
"main": "dist/index.cjs",
@@ -62,6 +72,7 @@
6272
"schema-dts": "^1.1.0"
6373
},
6474
"devDependencies": {
75+
"iles": "^0.8.3",
6576
"vite": "^3.0.9",
6677
"vite-ssg": "^0.20.2",
6778
"vitepress": "1.0.0-alpha.10",

‎packages/vite/src/iles-app.ts

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import type { UserConfig } from '@vueuse/schema-org'
2+
import { createSchemaOrg, resolveUserConfig } from '@vueuse/schema-org'
3+
import type { EnhanceAppContext } from 'iles'
4+
5+
export function installSchemaOrg(ctx: EnhanceAppContext, config: UserConfig) {
6+
if (!config.canonicalHost)
7+
config.canonicalHost = ctx.site.url
8+
const resolvedConfig = resolveUserConfig(config)
9+
10+
const client = createSchemaOrg({
11+
position: 'head',
12+
updateHead(fn) {
13+
ctx.head.addHeadObjs(fn)
14+
if (typeof document !== 'undefined')
15+
ctx.head.updateDOM()
16+
},
17+
meta() {
18+
const inferredMeta: Record<string, any> = {}
19+
20+
const tags = ctx.head.headTags?.reverse()
21+
if (tags) {
22+
const headTag = tags.filter(t => t.tag === 'title' && !!t.props.children)
23+
if (headTag.length)
24+
inferredMeta.title = headTag[0].props.children
25+
const descTag = tags.filter(t => t.tag === 'meta' && t.props.name === 'description' && !!t.props.content)
26+
if (descTag.length)
27+
inferredMeta.description = descTag[0].props.content
28+
const imageTag = tags.filter(t => t.tag === 'meta' && t.props.property === 'og:image' && !!t.props.content)
29+
if (imageTag.length)
30+
inferredMeta.image = imageTag[0].props.content
31+
}
32+
33+
return {
34+
path: ctx.router?.currentRoute.value.path || '/',
35+
...inferredMeta,
36+
...resolvedConfig.meta,
37+
...ctx.meta,
38+
...ctx.frontmatter,
39+
...ctx.router?.currentRoute.value.meta || {},
40+
}
41+
},
42+
})
43+
44+
ctx.app.use(client)
45+
46+
if (typeof document === 'undefined') {
47+
client.generateSchema()
48+
client.setupDOM()
49+
return
50+
}
51+
52+
ctx.router.afterEach(() => {
53+
client.generateSchema()
54+
client.setupDOM()
55+
})
56+
return client
57+
}

‎packages/vite/src/iles-module.ts

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import { SchemaOrgResolver } from '@vueuse/schema-org'
2+
import type { SchemaOrgPluginOptions } from '@vueuse/schema-org'
3+
import type { IlesModule } from 'iles'
4+
import type { UserConfig as IlesUserConfig } from 'iles/types/shared'
5+
import { SchemaOrg } from '.'
6+
7+
export function schemaOrgIles(pluginOptions: SchemaOrgPluginOptions) {
8+
return <IlesModule> {
9+
name: '@vueuse-schema-org/schema-org-iles',
10+
components: {
11+
resolvers: [
12+
SchemaOrgResolver(),
13+
],
14+
},
15+
config(config: IlesUserConfig) {
16+
config.vite = config.vite || {}
17+
// config.vite.optimizeDeps = config.vite.optimizeDeps || {}
18+
// config.vite.optimizeDeps.exclude = config.vite.optimizeDeps.exclude || []
19+
// config.vite.optimizeDeps.exclude.push(...['webpack-virtual-modules', 'unplugin', '@vueuse/schema-org/vite', '@vueuse/schema-org'])
20+
config.vite.plugins = config.vite.plugins || []
21+
config.vite.plugins.push(SchemaOrg({
22+
// use simple types
23+
full: false,
24+
// write type alias to tsconfig.json
25+
dts: true,
26+
// Note: iles will already strip out all javascript so we don't need to do it
27+
mock: false,
28+
...pluginOptions,
29+
}))
30+
},
31+
}
32+
}
33+

‎playgrounds/iles/.gitignore

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
.DS_Store
12+
dist
13+
dist-ssr
14+
*.local
15+
16+
/cypress/videos/
17+
/cypress/screenshots/
18+
19+
# Editor directories and files
20+
.vscode
21+
!.vscode/extensions.json
22+
.idea
23+
*.suo
24+
*.ntvs*
25+
*.njsproj
26+
*.sln
27+
*.sw?
28+
29+
.iles-ssg-temp/

‎playgrounds/iles/.npmrc

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
ignore-workspace-root-check=true
2+
shamefully-hoist=true

0 commit comments

Comments
 (0)