question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

VS Code Extension CSS Diagnostic Setting not respected

See original GitHub issue

Describe the bug Using custom css syntax VS Code Extension throws error svelte(css-syntax-error), with extension setting set to: "svelte.plugin.css.diagnostics.enable": false

{
	"resource": "/c:/.../tests/assets/input/windi/case-03.svelte",
	"owner": "_generated_diagnostic_collection_name_#0",
	"code": "css-syntax-error",
	"severity": 8,
	"message": "Semicolon or block is expected\n\nIf you expect this syntax to work, here are some suggestions: \nIf you use less/SCSS with `svelte-preprocess`, did you add `lang=\"scss\"`/`lang=\"less\"` to you `style` tag? If you use SCSS, it may be necessary to add the path to your NODE runtime to the setting `svelte.language-server.runtime`, or use `sass` instead of `node-sass`. \nDid you setup a `svelte.config.js`? \nSee https://github.com/sveltejs/language-tools/tree/master/docs#using-with-preprocessors for more info.",
	"source": "svelte",
	"startLineNumber": 11,
	"startColumn": 28,
	"endLineNumber": 11,
	"endColumn": 28
}

To Reproduce note: it is not scss or sass syntax. It is custom syntax

<style>
  .custom {
    background: green;
  }
  :global(.me) {
    background: yellow;
  }
  a {
    @apply text-black hover:text-emerald-400;
  }
  :global(div) {
    @apply bg-light-800 dark:bg-dark-600;
  }
</style>

Expected behavior "svelte.plugin.css.diagnostics.enable": false should disable error & warnings for wrong css syntax

Screenshots image

System (please complete the following information):

  • OS: Windows
  • IDE: VSCode
  • Plugin/Package: Svelte for VSCode 105.0.0

Additional context not sure, but I might guess of regression here. Since it worked in the past.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
alexanderniebuhrcommented, May 31, 2021

no. as said earlier. It seems that the order get’s confused on my preprocessors… Thanks for the hint

0reactions
dummdidummcommented, May 31, 2021

There are many things going on at once in this preprocess config. I guess that windi is responsible for doing the style transformation. Does the error occur if you apply only this preprocessor? Like

import { windi } from 'svelte-windicss-preprocess'

export default {
  preprocess: windi({
      silent: false,
      configPath: "windi.config.js",
      devTools: {
        enabled: false
      }
    })
}
Read more comments on GitHub >

github_iconTop Results From Across the Web

User and Workspace Settings - Visual Studio Code
To open the Settings editor, use the following VS Code menu command: On Windows/Linux - File > Preferences > Settings. On macOS -...
Read more >
Telemetry - Visual Studio Code
Crash Reports - Crash reports collect diagnostic information when VS Code crashes and sends it to Microsoft to help understand why the crash...
Read more >
Managing Extensions in Visual Studio Code
VS Code makes it easy to manage your extensions. You can install, disable, update, and uninstall extensions through the Extensions view, the Command...
Read more >
VS Code API | Visual Studio Code Extension API
VS Code API. VS Code API is a set of JavaScript APIs that you can invoke in your Visual Studio Code extension. This...
Read more >
Go with Visual Studio Code
Go in Visual Studio Code. Using the Go extension for Visual Studio Code, you get features like IntelliSense, code navigation, symbol search, testing, ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found