qrcode.vue 3.5.1 → 3.7.0

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.
package/CHANGELOG.md DELETED
@@ -1,111 +0,0 @@
1
- ## [3.5.0] - 2024-09-26
2
-
3
- ### Feature
4
-
5
- - Support logo image for Qrcode.
6
- - Exports separate `QrcodeCanvas` and `QrcodeSvg` components
7
-
8
- Direct references to `QrcodeVue` in common.js and cdn now require the `default` field:
9
-
10
- ```js
11
- const QrcodeVue = require('qrcode.vue').default
12
- const { default: QrcodeVue, QrcodeCanvas, QrcodeSvg } = require('qrcode.vue')
13
- ```
14
-
15
- ```html
16
- <!--With HTML-->
17
- <div id="root">
18
- <p class="flex space-x">
19
- <qrcode-vue :value="test" render-as="svg"></qrcode-vue>
20
- <qrcode-canvas :value="test"></qrcode-canvas>
21
- <qrcode-svg :value="test" :image-settings="imageSettings"></qrcode-svg>
22
- </p>
23
- <p><input v-model="test" /></p>
24
- </div>
25
- <script src="https://cdn.jsdelivr.net/npm/vue@3.5/dist/vue.global.prod.js"></script>
26
- <script src="https://cdn.jsdelivr.net/npm/qrcode.vue@3.5/dist/qrcode.vue.browser.min.js"></script>
27
-
28
- <script>
29
- Vue.createApp({
30
- data() { return {
31
- test: 'Hello World',
32
- imageSettings: {
33
- src: 'https://avatars.githubusercontent.com/u/15811268',
34
- width: 30,
35
- height: 30,
36
- excavate: true,
37
- },
38
- }},
39
- components: {
40
- QrcodeVue: QrcodeVue.default,
41
- QrcodeCanvas: QrcodeVue.QrcodeCanvas,
42
- QrcodeSvg: QrcodeVue.QrcodeSvg,
43
- },
44
- }).mount('#root')
45
- </script>
46
- ```
47
-
48
- ## [3.4.1] - 2023-08-05
49
-
50
- ### BUGFIX
51
-
52
- - Fixed TypeScript type export error.
53
-
54
- ## [3.4.0] - 2023-04-15
55
-
56
- ### Performance
57
-
58
- - remove `qr.js` dependency, use `nayuki/QR-Code-generator` instead.
59
-
60
- ## [3.3.1] - 2021-09-11
61
-
62
- ### BUGFIX
63
-
64
- - Fix document description error, adjust `renderAs` to `render-as`.
65
-
66
- ## [3.2.0] - 2020-12-20
67
-
68
- ### Feature
69
-
70
- - support typescript.
71
-
72
- ## [3.1.0] - 2020-12-20
73
-
74
- ### Feature
75
-
76
- - Add support margin for QRcode.
77
-
78
- ## [3.0.0] - 2020-12-20
79
-
80
- ### Feature
81
-
82
- - Support Vue 3
83
-
84
- ## [1.7.0] - 2019-11-10
85
-
86
- ### Feature
87
-
88
- - Support generate Qrcode as svg.
89
-
90
- ## [1.6.3] - 2019-09-16
91
-
92
- ### Update
93
-
94
- - Perfect documentation.
95
- - Add eslint check.
96
-
97
- ## [1.6.2] - 2019-05-21
98
-
99
- ### Remove:
100
-
101
- - `backingStorePixelRatio` is deprecated. more infomation [CanvasRenderingContext2D](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D).
102
-
103
- ## [1.6.0] - 2018-04-14
104
-
105
- ### Changed
106
-
107
- - Use Vue render function, not use jsx.
108
-
109
- ### Bugfixs
110
-
111
- - convert utf-16 to utf-8.
package/README-ja.md DELETED
@@ -1,184 +0,0 @@
1
- # qrcode.vue
2
-
3
- ⚠️ 現在、Vue 3.xを使用している場合は、`qrcode.vue`を`3.x`にアップグレードしてください。
4
-
5
- 🔒 Vue 2.xを使用している場合は、バージョン`1.x`を使用し続けてください。
6
-
7
- [QRコード](https://en.wikipedia.org/wiki/QR_code)を生成するためのVue.jsコンポーネントです。Vue 2とVue 3の両方をサポートしています。
8
-
9
- [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/scopewu/qrcode.vue/blob/master/LICENSE)
10
-
11
- [English](./README.md)
12
-
13
- ## インストール
14
-
15
- `qrcode.vue`コンポーネントをVue.jsアプリに使用できます。
16
-
17
- ```bash
18
- npm install --save qrcode.vue # yarn add qrcode.vue
19
- ```
20
-
21
- ```
22
- dist/
23
- |--- qrcode.vue.cjs.js // CommonJS
24
- |--- qrcode.vue.esm.js // ESモジュール
25
- |--- qrcode.vue.browser.js // ブラウザまたはrequire.jsまたはCommonJS用のUMD
26
- |--- qrcode.vue.browser.min.js // 最小サイズのUMD
27
- ```
28
-
29
- ## 使用方法
30
-
31
- 例:
32
-
33
- ```javascript
34
- import { createApp } from 'vue'
35
- import QrcodeVue from 'qrcode.vue'
36
-
37
- createApp({
38
- data: {
39
- value: 'https://example.com',
40
- },
41
- template: '<qrcode-vue :value="value"></qrcode-vue>',
42
- components: {
43
- QrcodeVue,
44
- },
45
- }).mount('#root')
46
- ```
47
-
48
- または、`*.vue`拡張子の単一ファイルコンポーネントで使用します:
49
-
50
- ```html
51
- <template>
52
- <qrcode-vue :value="value" :size="size" level="H" />
53
- </template>
54
- <script>
55
- import QrcodeVue from 'qrcode.vue'
56
-
57
- export default {
58
- data() {
59
- return {
60
- value: 'https://example.com',
61
- size: 300,
62
- }
63
- },
64
- components: {
65
- QrcodeVue,
66
- },
67
- }
68
- </script>
69
- ```
70
-
71
- Vue 3で`TypeScript`を使用する場合:
72
-
73
- ```html
74
- <template>
75
- <qrcode-vue
76
- :value="value"
77
- :level="level"
78
- :render-as="renderAs"
79
- :background="background"
80
- :foreground='foreground'
81
- :image-settings='imageSettings'
82
- />
83
- </template>
84
- <script setup lang="ts">
85
- import { ref } from 'vue'
86
- import QrcodeVue from 'qrcode.vue'
87
- import type { Level, RenderAs, ImageSettings } from 'qrcode.vue'
88
-
89
- const value = ref('qrcode')
90
- const level = ref<Level>('M')
91
- const renderAs = ref<RenderAs>('svg')
92
- const background = ref('#ffffff')
93
- const foreground = ref('#000000')
94
- const margin = ref(0)
95
- const imageSettings = ref<ImageSettings>({
96
- src: 'https://github.com/scopewu.png',
97
- width: 30,
98
- height: 30,
99
- // x: 10,
100
- // y: 10,
101
- excavate: true,
102
- })
103
- </script>
104
- ```
105
-
106
- ## コンポーネントプロパティ
107
-
108
- ### `value`
109
-
110
- - タイプ:`string`
111
- - デフォルト:`''`
112
-
113
- QRコードの内容。
114
-
115
- ### `size`
116
-
117
- - タイプ:`number`
118
- - デフォルト:`100`
119
-
120
- QRコード要素のサイズ。
121
-
122
- ### `render-as`
123
-
124
- - タイプ:`RenderAs('canvas' | 'svg')`
125
- - デフォルト:`canvas`
126
-
127
- `canvas`または`svg`としてQRコードを生成します。`svg`プロパティはSSRで動作します。
128
-
129
- ### `margin`
130
-
131
- - タイプ:`number`
132
- - デフォルト:`0`
133
-
134
- 静かなゾーンの幅を定義します。
135
-
136
- ### `level`
137
-
138
- - タイプ:`Level('L' | 'M' | 'Q' | 'H')`
139
- - デフォルト:`H`
140
-
141
- QRコードの誤り訂正レベル('L'、'M'、'Q'、'H'のいずれか)。詳細については、[wikipedia: QR_code](https://en.wikipedia.org/wiki/QR_code#Error_correction)を参照してください。
142
-
143
- ### `background`
144
-
145
- - タイプ:`string`
146
- - デフォルト:`#ffffff`
147
-
148
- QRコードの背景色。
149
-
150
- ### `foreground`
151
-
152
- - タイプ:`string`
153
- - デフォルト:`#000000`
154
-
155
- QRコードの前景色。
156
-
157
- ### `image-settings`
158
-
159
- - タイプ: `ImageSettings`
160
- - デフォルト: `{}`
161
-
162
- ```ts
163
- export type ImageSettings = {
164
- src: string, // The URL of image.
165
- x?: number, // The horizontal offset. When not specified, will center the image.
166
- y?: number, // The vertical offset. When not specified, will center the image.
167
- height: number, // The height of image
168
- width: number, // The height of image
169
- excavate?: boolean, // Whether or not to "excavate" the modules around the image.
170
- }
171
- ```
172
-
173
- The settings to support qrcode image logo.
174
-
175
- ### `class`
176
-
177
- - タイプ:`string`
178
- - デフォルト:`''`
179
-
180
- QRコード要素のクラス名。
181
-
182
- ## ライセンス
183
-
184
- copyright &copy; 2021 @scopewu, license by [MIT](https://github.com/scopewu/qrcode.vue/blob/main/LICENSE)
File without changes