Sass files in dist folder (Using Vite example)

[jq-87]

Apologies if this has already come up but I did not find an issue related to this.

Here are the steps to re-create, I am using the Vite example from this repo.

1. install sass: npm i sass
2. create .scss file in /src
3. Import .scss file in example.js
4. run: npm run start
5. Dist/ folder contains .scss file - this should be a .css file instead

[SassNinja]

Thanks for your feedback @jq-87

I'm afraid the vite support of this plugin has quite some limitation. It seems the postcss plugin is executed before the file extension is changed from "scss" to "css" resulting in what you just described.

A quick fix would be using the "output.name" option to enforce css extension. Taking the vite example you'd need to add one line:

      output: {
        path: path.join(__dirname, 'dist'),
        name: '[name]-[query].css',
      },