tauri: nix tailwindcss integration fails - postcss error

Describe the bug

I think, the problem is, because the processing mechanism of postcss.

I followed the installation instructions of tailwindcss from the webpage https://tailwindcss.com/docs/guides/sveltekit

I get

[vite] Internal server error: [postcss] /<abs path to project>/src/routes/+page.svelte?svelte&type=style&lang.css:1:1: Unknown word
  Plugin: vite:css
  File: /<abs path to project>/src/routes/+page.svelte?svelte&type=style&lang.css:1:1
  1  |  <script>
     |   ^
  2  |    import Greet from "$lib/Greet.svelte";
  3  |  </script>

Reproduction

  1. Blank install of tauri with svelte & Typescript
  2. Adding tailwind described on webpage https://tailwindcss.com/docs/guides/sveltekit

Expected behavior

We are having here an absolute path from the filesystem. I suppose, postwind needs an url to attach url parameters on it to parse the css

?svelte&type=style&lang.css:1:1

Platform and versions

I think any

Stack trace

at Input.error (/home/jbc/Work/indi/indi-desktop/node_modules/postcss/lib/input.js:148:16)
      at Parser.unknownWord (/home/jbc/Work/indi/indi-desktop/node_modules/postcss/lib/parser.js:540:22)
      at Parser.other (/home/jbc/Work/indi/indi-desktop/node_modules/postcss/lib/parser.js:164:12)
      at Parser.parse (/home/jbc/Work/indi/indi-desktop/node_modules/postcss/lib/parser.js:72:16)
      at parse (/home/jbc/Work/indi/indi-desktop/node_modules/postcss/lib/parse.js:11:12)
      at new LazyResult (/home/jbc/Work/indi/indi-desktop/node_modules/postcss/lib/lazy-result.js:133:16)
      at Processor.process (/home/jbc/Work/indi/indi-desktop/node_modules/postcss/lib/processor.js:28:14)
      at compileCSS (file:///home/jbc/Work/indi/indi-desktop/node_modules/vite/dist/node/chunks/dep-2285ba4f.js:37647:14)
      at async TransformContext.transform (file:///home/jbc/Work/indi/indi-desktop/node_modules/vite/dist/node/chunks/dep-2285ba4f.js:37121:56)
      at async Object.transform (file:///home/jbc/Work/indi/indi-desktop/node_modules/vite/dist/node/chunks/dep-2285ba4f.js:42569:30)

Additional context

No response

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Comments: 20 (2 by maintainers)

Most upvoted comments

As I investigated it further, it happens only at the start of the application. A graceful reload of the page corrects the rendering.

(I thought it’s all over persistent, but it isn’t. When you reload gracefully, it is usable for development again.)

And svelte.config.js should be

import staticAdapter from "@sveltejs/adapter-static";
import preprocess from "svelte-preprocess";

/** @type {import('@sveltejs/kit').Config} */
const config = {
  kit: {
    adapter: staticAdapter(),
  },
  preprocess: [
    preprocess()
  ]
};

export default config;