Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/rajasegar/sveltemod
A CLI to run codemods for Svelte
https://github.com/rajasegar/sveltemod
cli codemod jscodeshift svelte
Last synced: 12 days ago
JSON representation
A CLI to run codemods for Svelte
- Host: GitHub
- URL: https://github.com/rajasegar/sveltemod
- Owner: rajasegar
- License: mit
- Created: 2023-12-09T10:34:34.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2023-12-12T14:41:17.000Z (11 months ago)
- Last Synced: 2024-10-05T18:41:05.590Z (about 1 month ago)
- Topics: cli, codemod, jscodeshift, svelte
- Language: JavaScript
- Homepage:
- Size: 50.8 KB
- Stars: 2
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# sveltemod
[](https://npmjs.org/package/sveltemod 'View this project on npm')
A CLI to run codemods for Svelte
This project use [jscodeshift](https://github.com/facebook/jscodeshift) underneath which allows this tool to leverage the standard codemod tooling for JavaScript in Svelte projects.
## Install
```
npm install -g sveltemod
```
## Usage
```
sveltemod
```
Example:
```
sveltemod transforms/v5-derived.js src/App.svelte
```
You can also use jscodeshift to run the codemods like:
```
jscodeshift --transform=./transforms/v5-derived.js --extensions=svelte ./src/App.svelte
```
## Available codemods:
### v5/derived.js
#### Before
```js
$: area = width * height;
```
#### After
```js
const area = $derived(width * height);
```
### v5/effect.js
#### Before
```js
$: console.log(area);
```
#### After
```js
$effect(() => {
console.log(area);
});
```
### v5/props.js
#### Before
```js
export let width;
export let height;
```
#### After
```js
let { width, height } = $props();
```
### v5/state.js
#### Before
```js
let count = 0;
```
#### After
```js
let count = $state(0);
```
## Differences from svelte-migrate
- It uses jscodeshift underneath which is kind of standard tooling for codemods
- It completely uses AST based transforms instead of regex replacement which [svelte-migrate](https://github.com/sveltejs/kit/tree/master/packages/migrate) mostly uses
- You can run any Jscodeshift based transform available out there not just something comes with svelte-migrate
- Currently svelte-migrate doesn't have codemods for v5 or runes, I try to address that
- It is extendable with other transforms for html, css, sass and so on
## References:
- https://github.com/sveltejs/kit/discussions/5774