Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mustafadalga/remove-attr
Vite Plugin - Remove Attributes
https://github.com/mustafadalga/remove-attr
build-tool optimization remove-attr remove-attribute remove-attributes vite vite-plugin vite-plugin-remove-attr vitejs vue vue3 vuejs web-development
Last synced: about 1 month ago
JSON representation
Vite Plugin - Remove Attributes
- Host: GitHub
- URL: https://github.com/mustafadalga/remove-attr
- Owner: mustafadalga
- License: mit
- Created: 2023-05-19T18:17:49.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-08-22T07:38:24.000Z (3 months ago)
- Last Synced: 2024-09-28T23:03:22.216Z (about 2 months ago)
- Topics: build-tool, optimization, remove-attr, remove-attribute, remove-attributes, vite, vite-plugin, vite-plugin-remove-attr, vitejs, vue, vue3, vuejs, web-development
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/remove-attr
- Size: 43 KB
- Stars: 2
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Vite Plugin - Remove Attributes
This Vite plugin is specifically designed for Vue.js projects. It allows the removal of specified attributes in
production builds, supporting a variety of options like file extensions, attributes, ignored folders, and files.[![vue version](https://img.shields.io/npm/v/remove-attr.svg)](https://www.npmjs.com/package/remove-attr)
[![vue version](https://img.shields.io/badge/vite-4.3.2-brightgreen.svg)](https://www.npmjs.com/package/remove-attr)## Table of Contents
- [Features](#features)
- [Installation](#installation)
- [Usage](#usage)
- [Prerequisites](#prerequisites)
- [Examples](#examples)
- [License](#license)## Features
1. Removes specified attributes in production builds of Vue.js projects.
2. Allows you to specify the file extensions to be considered.
3. Can ignore certain folders or files based on configuration.
4. Ensures clean production code by removing unnecessary attributes, like 'data-testid' used in testing.## Installation
You can install this plugin through npm:
```sh
npm install --save-dev remove-attr
```## Usage
### Prerequisites
To use this plugin, you need to have a Vite project set up. Import and use the plugin in your vite.config.js or
vite.config.ts file.```typescript
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import removeAttr from 'remove-attr'export default defineConfig({
plugins: [
vue(),
removeAttr({
extensions: [ 'vue' ],
attributes: [ 'data-testid' ]
})
]
})```
## Examples
#### Example 1: Removing 'data-testid' attributes from '.vue' files
This configuration will remove 'data-testid' attributes from all '.vue' files in the production build.
```typescript
export default defineConfig({
plugins: [
vue(),
removeAttr({
extensions: [ 'vue' ],
attributes: [ 'data-testid' ]
})
]
})
```
#### Example 2: Ignoring specific folders and files
This configuration will remove 'data-testid' and 'data-id' attributes from all '.vue', '.ts', and '.js' files, with the exception of those in the 'src/tests' and 'src/utilities' folders, as well as the 'Home.vue', 'src/components/Modal.vue', and 'src/layouts/LayoutAuth.vue' files.
```typescript
export default defineConfig({
plugins: [
vue(),
removeAttr({
extensions: [ 'vue', "ts", "ts" ],
attributes: [ 'data-testid', "data-id" ],
ignoreFolders: [ 'src/tests', "src/utilities" ],
ignoreFiles: [ 'Home.vue', 'src/components/Modal.vue', "src/layouts/LayoutAuth.vue" ]
})
]
})
```
## License
[![License](https://img.shields.io/badge/LICENSE-GPL--3.0-orange)](https://github.com/mustafadalga/remove-attr/blob/main/LICENSE)