How to use sass using in vue.js 3 & vite?

1

npm install -D sass vite-plugin-components @vitejs/plugin-vue

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import Components from 'vite-plugin-components'
import vueJsx from '@vitejs/plugin-vue-jsx'

export default defineConfig({
  plugins: [
    vue(),
    Components(),
  ],
})

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

<template>
  <div class="app">
    <h1>Hello Vue</h1>
  </div>
</template>

<style lang="scss">
.app {
  h1 {
    color: red;
  }
}
</style>

1

npx vite