vue-o2c - Vue Options API to Composition API

Demo / Online Playground

WORK IN PROGRESS -- the following is not done:

- bunch of stuff still not implemented (working through case by case)
- publish package correctly for CLI command to work (need to check)
- data() preamble -- if there is preamble maybe just create refs then use the function to set them
- handle setup() in options api
- allow options to configure (eg. no typescript)
- $el needs to try to rewrite part of template
- would like to maintain indentation

After running, check for FIXME comments

Composition API does not allow easy access of app.config.globalProperties like options API does.
vue-o2c takes care of some basic cases (eg. this.$router assuming vue-router) but for others, you will
see comments like the following and you must adjust the code depending on how you provide these systems.

``typescript
const $primevue = inject("primevue") / FIXME vue-o2c /
`

Usage

$3

This is not working due to a publishing issue I need to fix...

`bash
$ npx vue-o2c /path/to/sfc.vue
...

...
`

$3

`bash
$ pnpm add -D vue-o2c
`

Please keep in mind, API is very experimental and likely will change!

`typescript
import { transformPath, transform, type State } from "vue-o2c"

const s1: State = transformPath("/path/to/sfc.vue")
const s2: State = transform("")
// s1.transformed and s2.transformed will both contained transformed code
`

Example

Given the following file:

`vue cat tests/fixtures/example/input.vue



`

`bash
$ git clone git@github.com:tjk/vue-o2c.git
$ cd vue-o2c
$ pnpm i
$ pnpm exec tsx index.ts ./example.vue
`

Will output the following:

`vue pnpm exec tsx src/cli.ts ./tests/fixtures/example/input.vue


``