SASS up your Code: SCSS in Nuxt or HTML
Waradu
Posted on September 7, 2023
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
.
Posted on September 7, 2023
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.