@vuesion/nuxt-vanilla-extract

0.0.3 • Public • Published

@vuesion/nuxt-vanilla-extract

npm version npm downloads Github Actions CI License

Add seek-oss/vanilla-extract to your nuxt application

📖 Release Notes

Setup

  1. Add @vuesion/nuxt-vanilla-extract dependency to your project
yarn add @vuesion/nuxt-vanilla-extract # or npm install @vuesion/nuxt-vanilla-extract
  1. Add @vuesion/nuxt-vanilla-extract to the modules section of nuxt.config.js
{
  modules: [
    '@vuesion/nuxt-vanilla-extract',
  ]
}
  1. Create *.css.ts file
import { style } from '@vanilla-extract/css'

export const className = style({
  color: 'red',
  fontFamily: 'sans-serif',
  fontWeight: 600,
})
  1. Import and use *.css.ts file
<template>
  <div :class="className">Foo Bar</div>
</template>

<script lang="ts">
import { defineComponent } from '@vue/composition-api';
import { className } from './VueBadge.css';

export default defineComponent({
  name: 'MyComponent',
  setup() {
    return {
      className,
    };
  },
});
</script>

Development

  1. Clone this repository
  2. Install dependencies using yarn install or npm install
  3. Start development server using npm run dev

License

MIT License

Copyright (c) Johannes Werner

Readme

Keywords

none

Package Sidebar

Install

npm i @vuesion/nuxt-vanilla-extract

Weekly Downloads

2

Version

0.0.3

License

MIT

Unpacked Size

5.42 kB

Total Files

5

Last publish

Collaborators

  • devcrossnet