Skip to content
This repository was archived by the owner on Dec 25, 2024. It is now read-only.

Commit 7a01448

Browse files
committed
docs: update
1 parent dd46b82 commit 7a01448

File tree

3 files changed

+78
-3
lines changed

3 files changed

+78
-3
lines changed

README.md

Lines changed: 64 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,75 @@
22

33
[![NPM version](https://img.shields.io/npm/v/vue2-script-setup-transform?color=a1b858&label=)](https://www.npmjs.com/package/vue2-script-setup-transform)
44

5-
Bring `<script setup>` to Vue 2
5+
Bring `<script setup>` to Vue 2.
6+
7+
## Install
8+
9+
```bash
10+
npm i -D vue2-script-setup-transform
11+
npm i @vue/composition-api
12+
```
13+
14+
Install `@vue/composition-api` in your App's entry:
15+
16+
```ts
17+
import Vue from 'vue'
18+
import VueComposisionAPI from '@vue/composition-api'
19+
20+
Vue.use(VueComposisionAPI)
21+
```
22+
23+
###### Vite
24+
25+
```ts
26+
// vite.config.ts
27+
import { defineConfig } from 'vite'
28+
import { createVuePlugin as Vue2 } from 'vite-plugin-vue2'
29+
import ScriptSetup from 'vue2-script-setup-transform/vite-plugin'
30+
31+
export default defineConfig({
32+
plugins: [
33+
Vue2(),
34+
ScriptSetup(),
35+
],
36+
})
37+
```
38+
39+
###### Webpack
40+
41+
```ts
42+
// webpack.config.js
43+
import ScriptSetup from 'vue2-script-setup-transform/webpack-plugin'
44+
45+
module.exports = {
46+
/* ... */
47+
plugins: [
48+
ScriptSetup()
49+
]
50+
}
51+
```
52+
53+
###### JavaScript API
54+
55+
```ts
56+
import { transform } from 'vue2-script-setup-transform'
57+
58+
const Vue2SFC = transform(`
59+
<template>
60+
<!-- ... -->
61+
</template>
62+
63+
<script setup>
64+
// ...
65+
</script>
66+
`)
67+
```
668

769
## Status
870

971
- [x] POC
1072
- [x] Components registration
11-
- [ ] Compile time macros
73+
- [x] Compile time macros `defineProps` `defineEmits` `withDefaults`
1274
- [x] Merge with normal scripts
1375
- [x] Vite plugin
1476
- [x] Webpack plugin

package.json

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,7 @@
5050
"@antfu/ni": "^0.7.0",
5151
"@types/jest": "^26.0.24",
5252
"@types/node": "^16.4.12",
53+
"@vue/composition-api": "^1.1.1",
5354
"bumpp": "^6.0.6",
5455
"eslint": "^7.32.0",
5556
"eslint-plugin-jest": "^24.4.0",
@@ -60,6 +61,9 @@
6061
"typescript": "^4.3.5",
6162
"vite": "^2.5.0"
6263
},
64+
"peerDependencies": {
65+
"@vue/composition-api": "^1.0.0"
66+
},
6367
"dependencies": {
6468
"@babel/core": "^7.15.0",
6569
"@babel/generator": "^7.15.0",

pnpm-lock.yaml

Lines changed: 10 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)