https://github.com/kawamataryo/v-change-tags-order

Changes the order of <script> and <template> tags in Vue single file components.
https://github.com/kawamataryo/v-change-tags-order

cli vue

Last synced: 7 days ago
JSON representation

Changes the order of <script> and <template> tags in Vue single file components.

• Host: GitHub
• URL: https://github.com/kawamataryo/v-change-tags-order
• Owner: kawamataryo
• License: mit
• Created: 2021-08-17T22:14:13.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2023-03-06T08:26:07.000Z (over 1 year ago)
• Last Synced: 2024-04-15T15:20:55.599Z (7 months ago)
• Topics: cli, vue
• Language: TypeScript
• Homepage: https://www.npmjs.com/package/v-change-tags-order
• Size: 968 KB
• Stars: 67
• Watchers: 3
• Forks: 4
• Open Issues: 10
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
#  v-change-tags-order

[![CI](https://github.com/kawamataryo/v-change-tags-order/actions/workflows/ci.yml/badge.svg)](https://github.com/kawamataryo/v-change-tags-order/actions/workflows/ci.yml)









Changes the order of `` and `<template>` tags in Vue single file components.

![ezgif com-gif-maker (14)](https://user-images.githubusercontent.com/11070996/129812609-b74e74aa-7d32-4d3c-a392-1a2accf971b9.gif)

## Usage

```bash

# In your Vue.js project

# If you want to put the `script` tag before the `template` tag

npx v-change-tags-order

# If you want to put the `template` tag before the `script` tag

npx v-change-tags-order --pattern 2

```

## Args

|args|default|description|

|---|---|---|

|`pattern`| 1 | In pattern 1, the `script` tag will be placed before the `template` tag.<br> In pattern 2, the `script` tag will be placed after the `template` tag. |

|`ignore`| node_modules | What you want to exclude from changes, which can be set with the glob pattern. |

## Recommend

After executing the command, it is recommended to set the rules in ESLint's [vue/component-tags-order](https://eslint.vuejs.org/rules/component-tags-order.html).

```json

{

  "vue/component-tags-order": ["error", {

    "order": [ "script", "template", "style" ]

  }]

}

```