sublimelsp / LSP-css

CSS, SCSS, LESS support for Sublime's LSP plugin
MIT License
37 stars 0 forks source link

How to enable/use it ? #1

Closed kat0d closed 5 years ago

kat0d commented 5 years ago

Hi, I have installed this server, css lang server with this command

npm install -g vscode-css-languageserver-bin

as shown here https://lsp.readthedocs.io/en/latest/#css in fact I had install

npm install vue-language-server -g
npm install -g vscode-css-languageserver-bin
npm install --global vscode-html-languageserver-bin

Windows 10 x64 LTSC and none of them don't work after restart, there was an error after I had restart Sublime Text 3 ...something like "install server and restart Sublime" and a console was shown with an error like "cant find a path" to ["npm", "install", "--verbose", "--prefix", [ \AppData\Roaming\Sublime Text 3\Packages\LSP-html(it was a path to lspPakage)]] Solving by installing manually for each package with a command

cd "C:\Users\zion\AppData\Roaming\Sublime Text 3\Packages\LSP-html"
npm install --verbose --prefix

and same command for each LSP server package

ok, so now I had no errors. But how to configure this server to work with CSS3 and LESS syntax ? currently, LSP server works only with CSS syntax. I was trying to modify the standard config

"vscode-css":
        {
            "command": ["css-languageserver", "--stdio"],
            "scopes": ["source.css"],
            "syntaxes": [
                "Packages/CSS/CSS.sublime-syntax",
                "Packages/CSS3/CSS3.sublime-syntax"
            ],
            "languageId": "css"
        },

But it's not work for CSS3 syntax lsp

kat0d commented 5 years ago

find out. in case if someone will needed


        "lsp-css":
        {
            "command":
            [
                "css-languageserver",
                "--stdio"
            ],
            "enabled": true,
            "languages":
            [
                {
                    "languageId": "css",
                    "scopes":
                    [
                        "source.css"
                    ],
                    "syntaxes":
                    [
                        "Packages/CSS/CSS.sublime-syntax"
                    ]
                },
                {
                    "languageId": "css3",
                    "scopes":
                    [
                        "source.css"
                    ],
                    "syntaxes":
                    [
                        "Packages/CSS3/CSS3.sublime-syntax"
                    ]
                },
                {
                    "languageId": "less",
                    "scopes":
                    [
                        "source.less"
                    ],
                    "syntaxes":
                    [
                        "Packages/LESS/Syntaxes/LESS.sublime-syntax"
                    ]
                },
                {
                    "languageId": "less+css3",
                    "scopes":
                    [
                        "source.less"
                    ],
                    "syntaxes":
                    [
                        "Packages/User/CustomSyntax/LESS+CSS3.sublime-syntax"
                    ]
                }
            ]
        },
predragnikolic commented 5 years ago

Oh I am sorry for the inconvenience you have.

I was refactoring. My goal was to improve the user experience... I don't have windows pc (tested only on Mac/Linux).

Can you paste the exact log that got printed in the sublime console, it should look something like this.

// I triggered an intentional error just to showcase, for me this works ok on linux/mac
LSP-html: Error while installing the server. 
 Command '['npm', 'install', '--verbose', '--prefix', '/home/predrag/.config/sublime-text-3/Packages/LSP-html']' returned non-zero exit status 1

... the thing you pasted ["npm", "install", "--verbose", "--prefix", [ \AppData\Roaming\Sublime Text 3\Packages\LSP-html(it was a path to lspPakage)]] looks odd to me. it is odd because why is [ \AppData\Roaming\Sublime Text 3\Packages\LSP-html(it was a path to lspPakage)] in an array?

Should that string be C:\Users\zion\AppData\Roaming\Sublime Text 3\Packages\LSP-html instead of \AppData\Roaming\Sublime Text 3\Packages\LSP-html.

If so, than this line is the cause: https://github.com/sublimelsp/LSP-css/blob/45cd33098c9e2ca7c9bc8eb24b6bbb2f5b2c60de/plugin.py#L9

Maybe, if I used sublime.packages_path() instead of os.path.dirname(__file__) would that solve your problem?

predragnikolic commented 5 years ago

Here is an explanation on why I did the refactor.

Before this the user needed to:

  1. Open package control, install LSP-css.
  2. From command palette run a command called Setup LSP-css server which would prompt the user to install the css server globaly.
  3. The user needs to restart sublime to see the changes. And if the user is on a mac, he need to install Sublime Fix Mac path, and configure that because of some $PATH problems with sublime on mac.

And lets just mention that before this refactor the user would need to manually update the server.

But why? Why all of that.

In an ideal world. I would just like to install the LSP-css pacakge and nothing more.

The refactor should enable updating of the server. Each time the plugin is installed or updated the server will be installed or updated as well. This is managed with package.json file. If we want we can specify the exact server version if we really want to. Or leave it to always install the latest version of the server.

When the plugin is installed/updated that triggers npm install which installs the server. The plugin creates a full path to the server executable. (this removes the need for Sublime Fix Mac Path, because the servers are no longer globally installed, they are now bundled with this plugin). https://github.com/sublimelsp/LSP-css/blob/45cd33098c9e2ca7c9bc8eb24b6bbb2f5b2c60de/plugin.py#L10

And that is the reason why the global installation you did didn't fixed your problems.

Hi, I have installed this server, css lang server with this command

And this :D

there was an error after I had restart Sublime Text 3 ...something like "install server and restart Sublime"

I showed on purpose a prompt just to notify the user that they need to restart sublime to see the chages. I would probably remove that prompt.

So after this refactor the user just needs to:

  1. Install LSP-css
  2. restart sublime (although I would really like if this step did not exist)

So if you can help me fix this issues for windows, I would really appreciate it :)

kat0d commented 5 years ago

Hi, well. I had to remove LSP-vue to install it again :) After installing I had this. And for me, completely unclear what to do next image

[WinError 2] Не удается найти указанный файл
[cmd: ['npm', 'install', '--verbose', '--prefix', 'C:\\Users\\zion\\AppData\\Roaming\\Sublime Text 3\\Packages\\LSP-vue']]
[dir: C:\Users\zion\AppData\Roaming\Sublime Text 3\Packages\LSP-css]
[path: C:\Python27\;C:\Python27\Scripts;C:\Program Files (x86)\Common Files\Oracle\Java\javapath;C:\Soft\Python3\Scripts\;C:\Soft\Python3\;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Windows\System32\OpenSSH\;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Soft\nodejs\;C:\ProgramData\chocolatey\bin;P:\Git\cmd;P:\php;C:\ProgramData\ComposerSetup\bin;;P:\Bitvise SSH Client;P:\Putty\;C:\Users\zion\AppData\Local\Microsoft\WindowsApps;C:\Users\zion\AppData\Roaming\npm;C:\Users\zion\AppData\Roaming\Composer\vendor\bin;C:\Users\zion\AppData\Local\GitHubDesktop\bin;C:\Soft\VSCode\bin;C:\Soft\ST3;C:\Users\zion\AppData\Local\atom\bin]
[Finished]

it's fine with this path dir: C:\Users\zion\AppData\Roaming\Sublime Text 3\Packages\LSP-css it's correct directory path, don't need to change it. this prompt is confusing :) image So how do I enable lsp-vue in my case ? I had open file.html set syntax to "Vue Component" open command pallet "LSP: Setup Language Server" and get image so that's why I had open a folder with LSP-vue in my case: C:\Users\zion\AppData\Roaming\Sublime Text 3\Packages\LSP-vue and just do npm install --verbose --prefix that's it. Restart Sublime and now LSP-vue works. image I hope this help you. You're doing a really great job :)

P.S. And one more...maybe I just could not wait until the server is installed through Sublime...not sure, or maybe there was an error. But for the first time, when I installed those packages, it took at least 15 minutes while I realized what to do)) ...or try to make command with quotes for a path, because when I try to make a command with npm install --verbose --prefix C:\Users\zion\AppData\Roaming\Sublime Text 3\Packages\LSP-css I get an error because of a space in a path, so i need to make it like npm install --verbose --prefix "C:\Users\zion\AppData\Roaming\Sublime Text 3\Packages\LSP-css" think this is a reason. cheers:)

predragnikolic commented 5 years ago

I think I will have a windows pc this weekend, but I can do nothing until than.. :)

predragnikolic commented 5 years ago

I pushed a fix 22046de82c7bf0e12a61fff597f6463f6903dccd for this. In the following hours the fix will be available on package control. BTW, I added support for CSS3 syntax.