svelte-meta-tags 2.3.0 → 2.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/README.md +71 -46
  3. package/index.js +7 -2
  4. package/package.json +18 -17
package/CHANGELOG.md CHANGED
@@ -1,3 +1,21 @@
1
+ ## [2.3.2](https://github.com/oekazuma/svelte-meta-tags/compare/v2.3.1...v2.3.2) (2022-02-28)
2
+
3
+ ### Bug Fixes
4
+
5
+ - **deps:** update dependency schema-dts to v1.1.0 ([d57c99d](https://github.com/oekazuma/svelte-meta-tags/commit/d57c99d89b5071e1e2045892ee2814a7105251ce))
6
+
7
+ ## [2.3.1](https://github.com/oekazuma/svelte-meta-tags/compare/v2.3.0...v2.3.1) (2022-02-25)
8
+
9
+ ### Bug Fixes
10
+
11
+ - fix lint error in `@typescript-eslint/no-empty-interface` ([6f41cc4](https://github.com/oekazuma/svelte-meta-tags/commit/6f41cc4e0d0022b1be6c778d4520bdd7b0188127))
12
+
13
+ # [2.3.0](https://github.com/oekazuma/svelte-meta-tags/compare/v2.2.3...v2.3.0) (2022-01-28)
14
+
15
+ ### Features
16
+
17
+ - add twitter title description image imageAlt ([e3270f5](https://github.com/oekazuma/svelte-meta-tags/commit/e3270f54fda56483a192d34dfc9d589c7949fc5b))
18
+
1
19
  ## [2.2.3](https://github.com/oekazuma/svelte-meta-tags/compare/v2.2.2...v2.2.3) (2022-01-14)
2
20
 
3
21
  ### Bug Fixes
package/README.md CHANGED
@@ -48,19 +48,19 @@ This library is inspired by [next-seo](https://github.com/garmeeh/next-seo)
48
48
  ### 📦 Installing
49
49
 
50
50
  ```shell
51
- npm install svelte-meta-tags
51
+ npm install -D svelte-meta-tags
52
52
  ```
53
53
 
54
54
  or
55
55
 
56
56
  ```shell
57
- yarn add svelte-meta-tags
57
+ yarn add -D svelte-meta-tags
58
58
  ```
59
59
 
60
60
  or
61
61
 
62
62
  ```shell
63
- pnpm add svelte-meta-tags
63
+ pnpm add -D svelte-meta-tags
64
64
  ```
65
65
 
66
66
  ### 🚀 Usage
@@ -111,7 +111,11 @@ pnpm add svelte-meta-tags
111
111
  twitter={{
112
112
  handle: '@handle',
113
113
  site: '@site',
114
- cardType: 'summary_large_image'
114
+ cardType: 'summary_large_image',
115
+ title: 'Using More of Config',
116
+ description: 'This example uses more of the available config options.',
117
+ image: 'https://www.example.ie/twitter-image.jpg',
118
+ imageAlt: 'Twitter image alt'
115
119
  }}
116
120
  facebook={{
117
121
  appId: '1234567890'
@@ -121,49 +125,65 @@ pnpm add svelte-meta-tags
121
125
 
122
126
  ### Properties
123
127
 
124
- | Property | Type | Description |
125
- | ---------------------------------- | ----------------------- | -------------------------------------------------------------------------------------------------------------------------------------- |
126
- | `title` | string | Sets the page meta title. |
127
- | `noindex` | boolean (default false) | Sets whether page should be indexed or not |
128
- | `nofollow` | boolean (default false) | Sets whether page should be followed or not |
129
- | `additionRobotsProps` | Object | Set the more meta information for the `X-Robots-Tag` [More Info](#robotsprops) |
130
- | `description` | string | Sets the page meta description. |
131
- | `canonical` | string | Set the page canonical url. |
132
- | `mobileAlternate.media` | string | Set what screen size the mobile website should be served from |
133
- | `mobileAlternate.href` | string | Set the mobile page alternate url |
134
- | `languageAlternates` | array | Set the language of the alternate urls. Expects array of objects with the shape: `{ hrefLang: string, href: string }` |
135
- | `additionalMetaTags` | array | Allows you to add a meta tag that is not documented here. [More Info](#additional-meta-tags) |
136
- | `additionalLinkTags` | array | Allows you to add a link tag that is not documented here. [More Info](#additional-link-tags) |
137
- | `twitter.cardType` | string | The card type, which will be one of `summary`, `summary_large_image`, `app`, or `player` |
138
- | `twitter.site` | string | @username for the website used in the card footer . |
139
- | `twitter.handle` | string | @username for the content creator / author (outputs as `twitter:creator`) |
140
- | `facebook.appId` | string | Used for Facebook Insights, you must add a facebook app ID to your page to for it |
141
- | `openGraph.url` | string | The canonical URL of your object that will be used as its permanent ID in the graph. |
142
- | `openGraph.type` | string | The type of your object. Depending on the type you specify, other properties may also be required [More Info](#open-graph) |
143
- | `openGraph.title` | string | The open graph title, this can be different than your meta title. |
144
- | `openGraph.description` | string | The open graph description, this can be different than your meta description. |
145
- | `openGraph.images` | array | An array of images to be used as a preview. If multiple supplied you can choose one when sharing. [See Examples](#open-graph-examples) |
146
- | `openGraph.videos` | array | An array of videos (object) |
147
- | `openGraph.locale` | string | The locale the open graph tags are marked up in. |
148
- | `openGraph.site_name` | string | If your object is part of a larger web site, the name which should be displayed for the overall site. |
149
- | `openGraph.profile.firstName` | string | Person's first name. |
150
- | `openGraph.profile.lastName` | string | Person's last name. |
151
- | `openGraph.profile.username` | string | Person's username. |
152
- | `openGraph.profile.gender` | string | Person's gender. |
153
- | `openGraph.book.authors` | string[] | Writers of the article. [See Examples](#open-graph-examples) |
154
- | `openGraph.book.isbn` | string | The [ISBN](https://en.wikipedia.org/wiki/International_Standard_Book_Number) |
155
- | `openGraph.book.releaseDate` | datetime | The date the book was released. |
156
- | `openGraph.book.tags` | string[] | Tag words associated with this book. |
157
- | `openGraph.article.publishedTime` | datetime | When the article was first published. [See Examples](#open-graph-examples) |
158
- | `openGraph.article.modifiedTime` | datetime | When the article was last changed. |
159
- | `openGraph.article.expirationTime` | datetime | When the article is out of date after. |
160
- | `openGraph.article.authors` | string[] | Writers of the article. |
161
- | `openGraph.article.section` | string | A high-level section name. E.g. Technology |
162
- | `openGraph.article.tags` | string[] | Tag words associated with this article. |
128
+ | Property | Type | Description |
129
+ | ---------------------------------- | ----------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
130
+ | `title` | string | Sets the page meta title. |
131
+ | `noindex` | boolean (default false) | Sets whether page should be indexed or not |
132
+ | `nofollow` | boolean (default false) | Sets whether page should be followed or not |
133
+ | `additionRobotsProps` | Object | Set the more meta information for the `X-Robots-Tag` [More Info](#robotsprops) |
134
+ | `description` | string | Sets the page meta description. |
135
+ | `canonical` | string | Set the page canonical url. |
136
+ | `mobileAlternate.media` | string | Set what screen size the mobile website should be served from |
137
+ | `mobileAlternate.href` | string | Set the mobile page alternate url |
138
+ | `languageAlternates` | array | Set the language of the alternate urls. Expects array of objects with the shape: `{ hrefLang: string, href: string }` |
139
+ | `additionalMetaTags` | array | Allows you to add a meta tag that is not documented here. [More Info](#additional-meta-tags) |
140
+ | `additionalLinkTags` | array | Allows you to add a link tag that is not documented here. [More Info](#additional-link-tags) |
141
+ | `twitter.cardType` | string | The card type, which will be one of `summary`, `summary_large_image`, `app`, or `player` |
142
+ | `twitter.site` | string | @username for the website used in the card footer . |
143
+ | `twitter.handle` | string | @username for the content creator / author (outputs as `twitter:creator`) |
144
+ | `twitter.title` | string | The concise title for the related content |
145
+ | `twitter.description` | string | The description that concisely summarizes the content as appropriate for presentation within a Tweet. You should not re-use the title as the description or use this field to describe the general services provided by the website |
146
+ | `twitter.image` | string | The URL to a unique image representing the content of the page. Images for this Card support an aspect ratio of 2:1 with minimum dimensions of 300x157 or maximum of 4096x4096 pixels. Images must be less than 5MB in size. JPG, PNG, WEBP and GIF formats are supported. Only the first frame of an animated GIF will be used. SVG is not supported |
147
+ | `twitter.imageAlt` | string | The text description of the image conveying the essential nature of an image to users who are visually impaired. Maximum 420 characters. |
148
+ | `facebook.appId` | string | Used for Facebook Insights, you must add a facebook app ID to your page to for it |
149
+ | `openGraph.url` | string | The canonical URL of your object that will be used as its permanent ID in the graph. |
150
+ | `openGraph.type` | string | The type of your object. Depending on the type you specify, other properties may also be required [More Info](#open-graph) |
151
+ | `openGraph.title` | string | The open graph title, this can be different than your meta title. |
152
+ | `openGraph.description` | string | The open graph description, this can be different than your meta description. |
153
+ | `openGraph.images` | array | An array of images to be used as a preview. If multiple supplied you can choose one when sharing. [See Examples](#open-graph-examples) |
154
+ | `openGraph.videos` | array | An array of videos (object) |
155
+ | `openGraph.locale` | string | The locale the open graph tags are marked up in. |
156
+ | `openGraph.site_name` | string | If your object is part of a larger web site, the name which should be displayed for the overall site. |
157
+ | `openGraph.profile.firstName` | string | Person's first name. |
158
+ | `openGraph.profile.lastName` | string | Person's last name. |
159
+ | `openGraph.profile.username` | string | Person's username. |
160
+ | `openGraph.profile.gender` | string | Person's gender. |
161
+ | `openGraph.book.authors` | string[] | Writers of the article. [See Examples](#open-graph-examples) |
162
+ | `openGraph.book.isbn` | string | The [ISBN](https://en.wikipedia.org/wiki/International_Standard_Book_Number) |
163
+ | `openGraph.book.releaseDate` | datetime | The date the book was released. |
164
+ | `openGraph.book.tags` | string[] | Tag words associated with this book. |
165
+ | `openGraph.article.publishedTime` | datetime | When the article was first published. [See Examples](#open-graph-examples) |
166
+ | `openGraph.article.modifiedTime` | datetime | When the article was last changed. |
167
+ | `openGraph.article.expirationTime` | datetime | When the article is out of date after. |
168
+ | `openGraph.article.authors` | string[] | Writers of the article. |
169
+ | `openGraph.article.section` | string | A high-level section name. E.g. Technology |
170
+ | `openGraph.article.tags` | string[] | Tag words associated with this article. |
163
171
 
164
172
  #### Twitter
165
173
 
166
- Twitter will read the `og:title`, `og:image` and `og:description` tags for their card, this is why `svelte-meta-tags` omits `twitter:title`, `twitter:image` and `twitter:description` so not to duplicate.
174
+ ```js
175
+ twitter={{
176
+ handle: '@handle',
177
+ site: '@site',
178
+ cardType: 'summary_large_image',
179
+ title: 'Twitter',
180
+ description: 'Twitter',
181
+ image: 'https://www.example.ie/twitter-image.jpg',
182
+ imageAlt: 'Twitter image alt'
183
+ }}
184
+ ```
185
+
186
+ Check out the Twitter [documentation](https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/summary) for more information.
167
187
 
168
188
  #### Facebook
169
189
 
@@ -749,7 +769,8 @@ You can import and use the types `MetaTagsProps` and `JsonLdProps`.
749
769
 
750
770
  ```svelte
751
771
  <script lang="ts">
752
- import { MetaTags, JsonLd, MetaTagsProps, JsonLdProps } from 'svelte-meta-tags';
772
+ import { MetaTags, JsonLd } from 'svelte-meta-tags';
773
+ import type { MetaTagsProps, JsonLdProps } from 'svelte-meta-tags';
753
774
 
754
775
  const metatags: MetaTagsProps = {
755
776
  title: 'Types Page Title | Svelte Meta Tags',
@@ -774,7 +795,11 @@ You can import and use the types `MetaTagsProps` and `JsonLdProps`.
774
795
  twitter: {
775
796
  handle: '@handle',
776
797
  site: '@site',
777
- cardType: 'summary_large_image'
798
+ cardType: 'summary_large_image',
799
+ title: 'Types Page Title | Svelte Meta Tags',
800
+ description: 'Description of Types page',
801
+ image: 'https://www.example.ie/twitter-image.jpg',
802
+ imageAlt: 'Twitter image alt'
778
803
  },
779
804
  facebook: {
780
805
  appId: '1234567890'
package/index.js CHANGED
@@ -1,2 +1,7 @@
1
- export { default as MetaTags } from './MetaTags.svelte';
2
- export { default as JsonLd } from './JsonLd.svelte';
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.JsonLd = exports.MetaTags = void 0;
4
+ var MetaTags_svelte_1 = require("./MetaTags.svelte");
5
+ Object.defineProperty(exports, "MetaTags", { enumerable: true, get: function () { return MetaTags_svelte_1.default; } });
6
+ var JsonLd_svelte_1 = require("./JsonLd.svelte");
7
+ Object.defineProperty(exports, "JsonLd", { enumerable: true, get: function () { return JsonLd_svelte_1.default; } });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "svelte-meta-tags",
3
- "version": "2.3.0",
3
+ "version": "2.3.3",
4
4
  "description": "Svelte Meta Tags is a plugin that makes managing your SEO easier in Svelte projects.",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -18,32 +18,33 @@
18
18
  "url": "https://github.com/oekazuma/svelte-meta-tags"
19
19
  },
20
20
  "dependencies": {
21
- "schema-dts": "1.0.0"
21
+ "schema-dts": "1.1.0"
22
22
  },
23
23
  "devDependencies": {
24
- "@commitlint/cli": "16.1.0",
25
- "@commitlint/config-conventional": "16.0.0",
24
+ "@commitlint/cli": "16.2.1",
25
+ "@commitlint/config-conventional": "16.2.1",
26
26
  "@semantic-release/changelog": "6.0.1",
27
27
  "@semantic-release/git": "10.0.1",
28
- "@sveltejs/kit": "1.0.0-next.247",
29
- "@typescript-eslint/eslint-plugin": "5.10.1",
30
- "@typescript-eslint/parser": "5.10.1",
31
- "cypress": "9.3.1",
32
- "eslint": "8.7.0",
33
- "eslint-config-prettier": "8.3.0",
28
+ "@sveltejs/adapter-auto": "1.0.0-next.30",
29
+ "@sveltejs/kit": "1.0.0-next.291",
30
+ "@typescript-eslint/eslint-plugin": "5.13.0",
31
+ "@typescript-eslint/parser": "5.13.0",
32
+ "cypress": "9.5.1",
33
+ "eslint": "8.10.0",
34
+ "eslint-config-prettier": "8.5.0",
34
35
  "eslint-plugin-cypress": "2.12.1",
35
- "eslint-plugin-svelte3": "3.4.0",
36
+ "eslint-plugin-svelte3": "3.4.1",
36
37
  "husky": "7.0.4",
37
- "lint-staged": "12.3.2",
38
+ "lint-staged": "12.3.4",
38
39
  "prettier": "2.5.1",
39
40
  "prettier-plugin-svelte": "2.6.0",
40
41
  "semantic-release": "19.0.2",
41
- "svelte": "3.46.3",
42
- "svelte-check": "2.3.0",
43
- "svelte-preprocess": "4.10.2",
44
- "svelte2tsx": "0.4.14",
42
+ "svelte": "3.46.4",
43
+ "svelte-check": "2.4.5",
44
+ "svelte-preprocess": "4.10.4",
45
+ "svelte2tsx": "0.5.5",
45
46
  "tslib": "2.3.1",
46
- "typescript": "4.5.5"
47
+ "typescript": "~4.5.5"
47
48
  },
48
49
  "peerDependencies": {
49
50
  "svelte": "^3.39.0"