# unplugin-vue-script-name

> Support for Vue script setup

Latest version **0.1.5** (published 2022-02-20) · MIT license · 0 weekly downloads

## Install

```sh
npm install unplugin-vue-script-name
pnpm add unplugin-vue-script-name
yarn add unplugin-vue-script-name
bun add unplugin-vue-script-name
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.5 |
| Published | 2022-02-20 |
| First published | 2022-02-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 487.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | soullyoko |
| Keywords | vue, script, setup, name |

## Links

- npm: https://www.npmjs.com/package/unplugin-vue-script-name
- Repository: https://github.com/SoulLyoko/unplugin-vue-script-name
- Homepage: https://github.com/SoulLyoko/unplugin-vue-script-name#readme
- Issues: https://github.com/SoulLyoko/unplugin-vue-script-name/issues
- npm.io page: https://npm.io/package/unplugin-vue-script-name

## Dependencies (1)

- [unplugin](https://npm.io/package/unplugin.md) ^0.2.7

## Alternatives

- [base64url](https://npm.io/package/base64url.md) — 6.1M weekly downloads
- [get-installed-path](https://npm.io/package/get-installed-path.md) — 502.9K weekly downloads
- [@uppy/url](https://npm.io/package/@uppy/url.md) — 185.8K weekly downloads
- [@d3fc/d3fc-shape](https://npm.io/package/@d3fc/d3fc-shape.md) — 16.2K weekly downloads
- [localizer](https://npm.io/package/localizer.md) — 226 weekly downloads

## Recent versions

- 0.1.5 (latest) — 2022-02-20
- 0.1.4 — 2022-02-10
- 0.1.3 — 2022-02-10
- 0.1.2 — 2022-02-09
- 0.1.1 — 2022-02-09

## README

# unplugin-vue-script-name

[![NPM version](https://img.shields.io/npm/v/unplugin-vue-script-name?color=a1b858&label=)](https://www.npmjs.com/package/unplugin-vue-script-name)

Support `<script name>` for Vue script setup.

## Install

```bash
npm i -D unplugin-vue-script-name
```

<details>
<summary>Vite</summary><br>

```ts
// vite.config.ts
import scriptName from "unplugin-vue-script-name/vite";

export default defineConfig({
  plugins: [
    scriptName({
      /* options */
    })
  ]
});
```

Example: [`playground/`](./playground/)

<br></details>

<details>
<summary>Rollup</summary><br>

```ts
// rollup.config.js
import scriptName from "unplugin-vue-script-name/rollup";

export default {
  plugins: [
    scriptName({
      /* options */
    })
  ]
};
```

<br></details>

<details>
<summary>Webpack</summary><br>

```ts
// webpack.config.js
module.exports = {
  /* ... */
  plugins: [
    require("unplugin-vue-script-name/webpack").default({
      /* options */
    })
  ]
};
```

<br></details>

<details>
<summary>Nuxt</summary><br>

```ts
// nuxt.config.js
export default {
  buildModules: [
    [
      "unplugin-vue-script-name/nuxt",
      {
        /* options */
      }
    ]
  ]
};
```

> This module works for both Nuxt 2 and [Nuxt Vite](https://github.com/nuxt/vite)

<br></details>

<details>
<summary>Vue CLI</summary><br>

```ts
// vue.config.js
module.exports = {
  configureWebpack: {
    plugins: [
      require("unplugin-vue-script-name/webpack").default({
        /* options */
      })
    ]
  }
};
```

<br></details>

## How It Works

```html
<!-- MyComponent.vue -->
<script setup lang="ts" name="MyComponent">
  defineProps({
    title: { type: String }
  });
</script>

<template>
  <h1>{{title}}</h1>
</template>
```

```html
<!-- Will be transformed to -->
<script>
  export default { name: "MyComponent" };
</script>

<script setup lang="ts">
  defineProps({
    title: { type: String }
  });
</script>

<template>
  <h1>{{title}}</h1>
</template>
```

---
_Source: https://npm.io/package/unplugin-vue-script-name · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._