https://github.com/fernandolguevara/svelte-multicssclass

https://github.com/fernandolguevara/svelte-multicssclass

Last synced: about 1 year ago
JSON representation

• Host: GitHub
• URL: https://github.com/fernandolguevara/svelte-multicssclass
• Owner: fernandolguevara
• License: mit
• Created: 2022-08-17T12:44:04.000Z (almost 4 years ago)
• Default Branch: main
• Last Pushed: 2023-04-28T14:22:23.000Z (about 3 years ago)
• Last Synced: 2025-04-15T00:17:47.642Z (about 1 year ago)
• Language: TypeScript
• Size: 24.4 KB
• Stars: 21
• Watchers: 1
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# svelte-multicssclass

[![npm version](https://badge.fury.io/js/svelte-multicssclass.svg)](https://badge.fury.io/js/svelte-multicssclass)

[![https://nodei.co/npm/svelte-multicssclass.png?downloads=true&downloadRank=true&stars=true](https://nodei.co/npm/svelte-multicssclass.png?downloads=true&downloadRank=true&stars=true)](https://www.npmjs.com/package/svelte-multicssclass)

 

Before:

```html

  text

```

After:

```html

  text

```

### Usage

```

  - choose a separator char ;  ,  | or configure your own multicssclass({ sep: '@' })

  - write your classes using the sep 

      

      Custom sep

      

  - two separators for toggle 

      

      Custom sep 

      

```

```sh

npm i -D svelte-multicssclass

```

```ts

// vite.config.js

import { sveltekit } from '@sveltejs/kit/vite';

import { multicssclass } from 'svelte-multicssclass';

/** @type {import('vite').UserConfig} */

const config = {

  plugins: [multicssclass(), sveltekit()],

};

export default config;

```

after:

```html

text

text

text

text

text

text

```

or with a given separator

```ts

// vite.config.js

import { sveltekit } from '@sveltejs/kit/vite';

import { multicssclass } from 'svelte-multicssclass';

/** @type {import('vite').UserConfig} */

const config = {

  plugins: [multicssclass({ sep: '@' }), sveltekit()],

};

export default config;

```

```html

text

text

```