Skip to content

Commit c686bdc

Browse files
committed
docs: create upgrade guide
1 parent ea57f32 commit c686bdc

File tree

2 files changed

+49
-1
lines changed

2 files changed

+49
-1
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ Consider supporting efforts to make this project healthy and sustainable. Thank
1414
## Quickstart ⚡️
1515

1616
[**Upgrade guide**](docs/UPGRADE_V1_TO_V2.md)
17-
[**Docs v1**](https://github.com/ectoflow/vue-stripe-js/tree/v1.0.4)
17+
**[Docs v1](https://github.com/ectoflow/vue-stripe-js/tree/v1.0.4)**
1818

1919
### 1. Install
2020

docs/UPGRADE_V1_TO_V2.md

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,51 @@
22

33
Upgrading your vue-stripe-js from v1 to v2.
44

5+
Vue Stripe.js v2.0.0 is a major update that makes changes in default choices due to Stripe.js evolution. It was designed with stability in mind. Your upgrade should be smooth and simple.
6+
7+
## Breaking changes
8+
9+
ES module is the de-facto standard. Vite is expected to drop commonjs support in 2025. Don't upgrade if you use "require" instead of "import".
10+
11+
- added npm type module
12+
- removed commonjs export
13+
14+
## Features
15+
- Backward-compatible, old implementations should work seamlessly
16+
- Payment Element is the new default
17+
- Better TypeScript support
18+
- Added new examples for Payment, Card, and Express Checkout
19+
20+
## Upgrade
21+
22+
### Install new version
23+
```bash
24+
npm install vue-stripe-js@latest
25+
```
26+
27+
Test your integration. Major upgrade is finished 🎉
28+
29+
## Optional changes
30+
31+
### Provide explicit type to StripeElement
32+
33+
```diff
34+
<StripeElements>
35+
- <StripeElement />
36+
+ <StripeElement type="card" />
37+
</StripeElements>
38+
```
39+
40+
### Remove slot props
41+
Not needed thanks to provide/inject behind the hood
42+
43+
```diff
44+
<StripeElements
45+
- v-slot="{ elements, instance }"
46+
>
47+
<StripeElement
48+
+ type="card"
49+
- :elements="elements"
50+
/>
51+
</StripeElements>
52+
```

0 commit comments

Comments
 (0)