open-props icon indicating copy to clipboard operation
open-props copied to clipboard

Request to Change Autocomplete Visual Studio Code Extension

Open mobalti opened this issue 3 years ago • 7 comments

Request to Change Autocomplete Visual Studio Code Extension

Hi, I would like to request a change to the suggested Autocomplete Visual Studio Code extension on the open-props website. Specifically, I request that it be switched to the following extension: https://marketplace.visualstudio.com/items?itemName=vunguyentuan.vscode-css-variables. This extension is much more efficient and reliable compared to the current one , which seems to be encountering issues quite frequently.

Thank you for considering this request.

mobalti avatar Feb 05 '23 19:02 mobalti

The current suggested extension is more functional. It supports any syntax parser and postcss plugins.

sshrshnv avatar Feb 06 '23 20:02 sshrshnv

The issue with the current extension is that it frequently breaks. On the other hand, the extension that I recommended also supports a syntax parser and PostCSS and can scan all the files in your project out of the box, unlike the current extension.

mobalti avatar Feb 07 '23 07:02 mobalti

One thing I found with the current extension is that it doesn't work with svelte files. If anyone reading this had the same problem - just set it to an older version and it should work. It has support for svelte it just seems to be broken on the current version. Took me a little bit of time to figure this out so I thought I might drop it in here.

jakubsmolaga avatar Feb 14 '23 23:02 jakubsmolaga

The current extension also doesn't seem to work when using open-props together with postcss-jit-props.

EDIT: The extension suggested here also doesn't work with the JIT. It's probably due to open-props not being imported directly in my source css, as instructed in the docs.

hirasso avatar May 04 '23 09:05 hirasso

Have you added the file path for "open-props.min.css" to your .vscode/settings.json file? If not, you can add the code snippet below to fix the issue:

{
  "cssVariables.lookupFiles": [
    "**/*.css",
    "**/*.scss",
    "**/*.sass",
    "**/*.less",
    "node_modules/open-props/open-props.min.css"
  ]
}

Alternatively, you can visit the extension's repository at https://github.com/vunguyentuan/vscode-css-variables to find more information on how to add the file path. The FAQ even provides instructions on how to add the file path for "open-props.min.css".

If you use the extension mentioned in the documentation, you can find more information in the AutoComplete section there.

mobalti avatar May 04 '23 12:05 mobalti

Now it started working somehow. I don't know what I changed to make it work 🤷‍♂️

hirasso avatar May 04 '23 21:05 hirasso

Great to hear that the issue is resolved! Just a quick reminder, you might have to reload VS Code and restart the server after installing Open Props to get the extension working properly 👍.

mobalti avatar May 05 '23 08:05 mobalti