https://github.com/shahabganji/aurelia-meta
An aurelia plugin handling meta tags
https://github.com/shahabganji/aurelia-meta
aurelia aurelia-meta aurelia-plugins meta-tags
Last synced: 8 months ago
JSON representation
An aurelia plugin handling meta tags
- Host: GitHub
- URL: https://github.com/shahabganji/aurelia-meta
- Owner: shahabganji
- License: mit
- Created: 2019-02-11T20:26:32.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2019-05-18T09:37:43.000Z (over 6 years ago)
- Last Synced: 2025-02-24T06:50:31.192Z (8 months ago)
- Topics: aurelia, aurelia-meta, aurelia-plugins, meta-tags
- Language: TypeScript
- Homepage:
- Size: 494 KB
- Stars: 3
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# aurelia-meta
A plugin on top of `aurelia-router` to handle meta tags of your application, both automatically and manually.
## Usage
1. Install the plugin
```shell
yarn install aurelia-meta
```2. Make Aurelia aware of your application
```ts
aurelia.use.plugin('aurelia-meta');
```
* Bear in mind to use `PLATFORM.moduleName` if you use `webpack`3. It's ready to use, just add your meta tags to your routes as a property, no matter whether it's a parent route or a child one.
```ts
config.map([
{
route: '',
name: 'home',
moduleId: PLATFORM.moduleName('./routes/home'),
nav: true,
title: 'Home',meta: [
{
name: 'home', content: 'This is a Home page'
},
{
property: 'og:title' , content:'Home'
},
{
property: 'og:description' , content:'Aurelia meta is a plugin for Aurelia'
}
]
},
...
]);
```* If you want to add meta tags manually and not necessarily on route changes, use one of these services: **Router**, **AureliaMetaService** and use the appropriate methods for your purpose.
```ts
import { autoinject } from "aurelia-framework";
import { AureliaMetaService } from "aurelia-meta";@autoinject()
export class HomeRouteComponent{message: string = "Hello world!";
constructor(private aureliaMetaService: AureliaMetaService) { }
activate() {
this.aureliaMetaService.addTag({
name: 'author' , content:'Saeed Ganji'
});
}
deactivate() {
this.aureliaMetaService.removeTag({
name: 'author' , content:'Saeed Ganji'
})
}
}
```* Keep in mind that you are responsible to remove tags that you have added manually, the plugin only automatically handles tags defined on the routes.
## Build
* To build the plugin `clone` this repository and run `au build-plugin`
* To run the sample project run `npm start`