Visual Studio Code for ProcessWire Developers

[millipedia]

1 hour ago, AndZyk said:

I can recommend the VSCode extension "Project Manager": https://marketplace.visualstudio.com/items?itemName=alefragnani.project-manager

I have every project as own workspace with all root folders (site and wire) included and can easily switch with the project manager. The wire folder is excluded for opening files via the command palette. This way Intelephense knows everything, but I don't get suggested files in the wire folder. 😉

I do use Project Manager already and it's definitely a must have extension.

44 minutes ago, bernhard said:

Not sure I totally understand what it is doing but I'm always opening projects via spotlight + terminal:

Cool. Whilst we're sharing tips though -  on a Mac you can set up a Quick Action in Automater to open a folder in VS Code:

the command I've got in that Quick Action is

open -n -b "com.microsoft.VSCode" --args "$*"

On my Linux box I'm using Dolphin on KDE and  get offered the option to 'Open with VSCode' when I right click on a folder ... I think thats just happens by default; I don't remember ever setting that up.

 

[Laikmosh]

On 10/27/2022 at 5:06 AM, millipedia said:

Because I have dozens of PW projects on the go (I really must tidy up my code folder) I didn't want to include the core files for each projects.

The best solution I managed was to have a single copy of the core files in a folder which I then add to the intelephense environment path settings:

    "intelephense.environment.includePaths": [
        "/Users/stephen/code/stubs/",
        "/home/stephen/code/stubs/"
    ],

 

It would be great to have PW stubs in the core Intelephense list but I have no idea how to even start going about that.

Well for me it has to be more automated because I have to share my environment with a team, so I just created this code and put it in the config-dev.php file

$dest = "./site/assets/wire";
// Get canonicalized absolute pathname
$path = realpath($dest);
// If it exist, check if it's a directory
if (!$path and !is_dir($path)) {
  $src = "/var/www/html/wire";
  shell_exec("cp -r $src $dest");
}

But just yesterday I uploaded a docker compose configuration that has all this configured by default, maybe it works for you:

Processwire docker image

[Jan Romero]

This is apparently a really old hat and common in many editors, but it’s the first I’ve heard of it and it just blew my mind. Did you know you can name heredoc strings “HTML” to get HTML syntax highlighting?!

I kind of try to avoid heredoc, but this seems pretty neat.

[kongondo]

Code GPT

Visual Studio Code extension that lets you generate code from plain text within the editor using the official OpenAI API or other AI providers such as Google PaLM 2.

https://marketplace.visualstudio.com/items?itemName=DanielSanMedium.dscodegpt

https://codegpt.co/

[kongondo]

Floating Windows

Long standing open request

https://github.com/microsoft/vscode/issues/10121

Workarounds:

Duplicate Workspace 

WARNING: CAREFUL WITH THIS ONE! CAN EASILY WIPE YOUR CHANGES IF YOU ARE EDITING ON BOTH WINDOWS!

Autosave onFocusChange

 

Edited September 9, 2023 by kongondo
Added warning about potential loss

[kongondo]

November 2023 (version 1.85)

Floating editor windows

Finally this 👆!

[bernhard]

If you are working with Git I highly recommend installing the "git graph" extension:

This extension truly helped me understand everything around git way better (What is this origin? What is this HEAD? What is a rebase actually doing? etc...).

It also has great right-click-menus with helpful actions:

 

Unfortunately the author of the extension seems to be not available any more and the license seems to be quite restrictive so that forking is not allowed, but it's an interesting read: https://github.com/mhutchie/vscode-git-graph/issues/715

I didn't find a good alternative. If anyone knows one please let us know 🙂 

https://marketplace.visualstudio.com/items?itemName=mhutchie.git-graph

[gebeer]

Have you tried https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory ?

This seems to be the most popular one. Latest commits last year. The graph looks similar to git graph. There is a number of actions you can take on  commits, like revert, create branch, cherry pick etc.

[bernhard]

I've recently started using https://marketplace.visualstudio.com/items?itemName=SergeLamikhov.aligntokens to align my code for better readability (especially when having lots of field constants or lots of hooks):

Before

After

What I find nice is that it does not do that stuff automatically and it lets you decide which token to use for alignment. On top we align by "=" and in _init() we align by $this 🙂