vue-hook-optimizer 0.0.5 → 0.0.6

Sign up to get free protection for your applications and to get access to all the features.
package/README.md CHANGED
@@ -1,54 +1,57 @@
1
- [中文文档](./README_cn.md)
2
-
3
- This is a tool to analyze your `vue` code.
4
-
5
- ## Install And Run Playground
6
-
7
- ```bash
8
- # clone the repo then install the dependencies
9
- pnpm install
10
- # run the playground
11
- pnpm run play
12
- ```
13
-
14
- Open the browser and visit `http://localhost:3000/`.
15
-
16
- ![playground](./images/playground1.png)
17
-
18
- ## How To Use
19
-
20
- 1. paste your `vue` code into the editor
21
-
22
- Up to now, it only supports the code with `<script setup>` syntax block.If your code use `options api`, it's not working at the moment.
23
-
24
- 2. click `Analyze` button
25
-
26
- The tool will analyze the `setup block` and `template block`, and show the relations between the variables and the methods. This is a simple demo.
27
-
28
- ![demo](./images/demo1.png)
29
-
30
- ## Motive
31
-
32
- Sometime we have to refactor the code, maybe there are thousands of lines of code in one file. And it is too complex and hard to understand.
33
-
34
- So I want to build a tool to help us analyze the code, and find the relations between the variables and the methods. We can find out some variables are isolated, and some methods are over-association, and then we can refactor them.
35
-
36
- ## Development Plan
37
-
38
- - [ ] add node type and more info
39
- - [ ] provide some suggestions for optimization
40
- - [ ] maybe support `options api`
41
-
42
- ## Contribution
43
-
44
- Any contributions are welcome.
45
-
46
- ## Sponsor Me
47
-
48
- If you like this tool, please consider to sponsor me. I will keep working on this tool and add more features.
49
-
50
- ![sponsor](./images/sponsor.png)
51
-
52
- ## License
53
-
54
- MIT
1
+ [![NPM version](https://img.shields.io/npm/v/vue-hook-optimizer?color=a1b858&label=)](https://www.npmjs.com/package/vue-hook-optimizer)
2
+
3
+ [中文文档](./README_cn.md)
4
+
5
+ This is a tool to analyze your `vue` code.
6
+
7
+ ## Install And Run Playground
8
+
9
+ ```bash
10
+ # clone the repo then install the dependencies
11
+ pnpm install
12
+ # run the playground
13
+ pnpm run play
14
+ ```
15
+
16
+ Open the browser and visit `http://localhost:3000/`.
17
+
18
+ ![playground](./images/playground1.png)
19
+
20
+ ## How To Use
21
+
22
+ 1. paste your `vue` code into the editor
23
+
24
+ Up to now, it only supports the code with `<script setup>` syntax block.If your code use `options api`, it's not working at the moment.
25
+
26
+ 2. click `Analyze` button
27
+
28
+ The tool will analyze the `setup block` and `template block`, and show the relations between the variables and the methods. This is a simple demo.
29
+
30
+ ![demo](./images/demo1.png)
31
+
32
+ ## Motive
33
+
34
+ Sometime we have to refactor the code, maybe there are thousands of lines of code in one file. And it is too complex and hard to understand.
35
+
36
+ So I want to build a tool to help us analyze the code, and find the relations between the variables and the methods. We can find out some variables are isolated, and some methods are over-association, and then we can refactor them.
37
+
38
+ ## Development Plan
39
+
40
+ - [ ] add node type and more info
41
+ - [ ] provide some suggestions for optimization
42
+ - [ ] maybe support `options api`
43
+ - [ ] vscode extension
44
+
45
+ ## Contribution
46
+
47
+ Any contributions are welcome.
48
+
49
+ ## Sponsor Me
50
+
51
+ If you like this tool, please consider to sponsor me. I will keep working on this tool and add more features.
52
+
53
+ ![sponsor](./images/sponsor.png)
54
+
55
+ ## License
56
+
57
+ MIT