SASS up your Code: SCSS in Nuxt or HTML

Using SCSS with Nuxt

To use SCSS with Nuxt, you need to add the sass package to your project. You can do this by running the following command: pnpm add -D sass (works completely fine with a tauri app)

After adding the package, you can use Sass in your Nuxt project by changing the <style> tags to <style lang="scss"> tags in all .vue files.

Using SCSS with HTML in VS Code

To use SCSS with HTML in VS Code, you need to install the glenn2223.live-sass extension. After installing the extension, open any .scss file and click on the watch sass button at the bottom right of the screen.

To import the generated CSS into your HTML file, use the same method as you would for normal CSS. However, make sure to use the .css file extension instead of .scss, as live-sass will convert .scss files to .css files.

If you have any questions/problems/ideas, feel free to add me on discord: waradu.