https://github.com/phanect/nuxt-canonical-ogurl
[Deprecated] Automatically generate canonical and og:url meta tags for Nuxt applications
https://github.com/phanect/nuxt-canonical-ogurl
Last synced: 2 months ago
JSON representation
[Deprecated] Automatically generate canonical and og:url meta tags for Nuxt applications
- Host: GitHub
- URL: https://github.com/phanect/nuxt-canonical-ogurl
- Owner: phanect
- License: mit
- Archived: true
- Created: 2022-02-26T07:47:07.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2022-11-17T21:02:17.000Z (over 3 years ago)
- Last Synced: 2025-01-28T05:44:45.608Z (over 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 10.7 KB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# nuxt-canonical-ogurl
A Nuxt module to automatically generate canonical and og:url meta tags
# Deprecation Notice
This module is deprecated because it only works with Nuxt 2.
On Nuxt 3, this module is not required to automatically add `canonical` and `og:url`.
To automatically add `canonical` and `og:url`, try following code in app.vue:
```vue
const route = useRoute();
const canonical = `https://example.com${route.path.replace(/\/$/, "")}`; // without trailing slash
const canonicalWithSlash = `https://example.com${route.path.replace(/\/$/, "")}/`; // with trailing slash
useHead({
meta: [
{ name: "og:url", content: canonical },
],
link: [
{ rel: "canonical", href: canonical },
],
});
```
# Set up
1. Add `nuxt-canonical-ogurl` to the dependency in your project
```shell
$ npm install nuxt-canonical-ogurl
```
or
```shell
$ yarn add nuxt-canonical-ogurl
```
2. Add `nuxt-canonical-ogurl` to `buildModules` in nuxt.config.js, then configure options
```javascript
export default {
// ...
buildModules: [
"nuxt-canonical-ogurl",
],
canonicalOgUrl: {
baseURL: "https://example.com",
},
// You need to set router.trailingSlash true or false to use this module
router: {
trailingSlash: true,
},
}
```
To complete set up `nuxt-canonical-ogurl`, you need to set router.trailingSlash.
If you set `router.trailingSlash: true`, trailing slashes are added to the canonical URLs. (e.g. https://example.com/foo/)
If you set `router.trailingSlash: false`, trailing slashes are stripped from the canonical URLs. (e.g. https://example.com/foo)
If you don't set `router.trailingSlash`, `nuxt-canonical-ogurl` raises an error.
# Options
```javascript
export default {
// ...
canonicalOgUrl: {
baseURL: "https://example.com",
},
}
```
## `baseURL`
type: `String`
Base URL for canonical tags.
If you set `baseURL: "https://example.com"`, canonical URL for pages/foo.vue would be "https://example.com/foo/" (in case `router.trailingSlash: true`).
## License
MIT