sveltejs / vite-plugin-svelte

Svelte plugin for http://vitejs.dev/
MIT License
864 stars 105 forks source link

Rollup watch not respecting preprocess dependencies #641

Closed null-dev closed 1 year ago

null-dev commented 1 year ago

I initialized a new Svelte project with npm init vite.

Then I configured a toy preprocessor in my svelte.config.js:

import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'
import * as fs from 'fs';

export default {
  preprocess: [
      vitePreprocess(),
      // This is my toy preprocessor
      {
          style: ({ content, filename }) => {
              const cssFile = filename + ".css"
              if(fs.existsSync(cssFile)) {
                  return {
                      code: content + fs.readFileSync(cssFile, { encoding: "UTF-8" }),
                      dependencies: [cssFile]
                  }
              } else {
                  return { code: content }
              }
          }
      }
  ],
}

The preprocessor concatenates a CSS file onto the styles of each component. E.g. For a component named App.svelte, the preprocessor will add the contents of App.svelte.css into App.svelte's <style></style> tag.

Now I run: npm run build -- --watch. I expect a rebuild to be triggered if I edit App.svelte.css however no rebuild is triggered.

Attached is a minimal reproduction project: svelte-bug.zip

dominikg commented 1 year ago

https://github.com/sveltejs/vite-plugin-svelte/blob/aba990bc8fd0dcaa8107ebf28e0504cdb0b376c9/packages/vite-plugin-svelte/src/index.ts#L238

needs a case for build (call this.addWatchFile). We handle it differently during dev because these non-js dependencies would cause problems on vites modulegraph otherwise.