Jump to content
kongondo

Visual Studio Code for ProcessWire Developers

Recommended Posts

13 minutes ago, kongondo said:

Side Bar

I've been wanting to move the side bar to the right but never got round to it. Today, I finally did it...and I like it! Any right side bar people here 😁?

I switched forth and back between left and right side bar and no it seems I'll stuck on right! 🙂

  • Like 1

Share this post


Link to post
Share on other sites

Sadly there is currently a problem with Intelephense plugin which leads to wrong problem reports:

Expected type 'ProcessWire\Page'. Found ''.
Expected type 'array|null'. Found 'array()'.
Expected type 'array|null'. Found 'null'.
... and so on ...

https://github.com/bmewburn/vscode-intelephense/issues?q=is%3Aissue+is%3Aopen+label%3A"resolved+in+1.0.3"

But it seems an update is on its way...

Share this post


Link to post
Share on other sites

I still haven't found my perfect syntax theme ... currently using the built in "Dark+"

Share this post


Link to post
Share on other sites
Posted (edited)

Mainly directed at @bernhard...

Could you please let me know how you got intelephense to work with .module files? I'd like to switch to it from PHP intellisense but I can't get it to work. It will only do .php files.

Thanks.

Edited by kongondo

Share this post


Link to post
Share on other sites
16 minutes ago, kongondo said:

Mainly directed at @bernhard...

Could you please let me know how you got intelephense to work with .module files? I'd like to switch to it from PHP intellisense but I can't get it to work. It will only do .php files.

Thanks.

Hi @kongondo,

I'm also using Intelephense and the only thing I added to my VSCode settings is this:

    "files.associations": {
        "*.module": "php"
    },

 

  • Like 2

Share this post


Link to post
Share on other sites
18 minutes ago, Gadgetto said:

I'm also using Intelephense and the only thing I added to my VSCode settings is this:

Thanks. I've had this all along but it just won't pick it up. Intellisense picks it up fine. I'll try again, thanks.

Share this post


Link to post
Share on other sites

Just tried and it's working here: 

96RG7I4.png

Maybe a namespace issue?

  • Like 1

Share this post


Link to post
Share on other sites
38 minutes ago, bernhard said:

Maybe a namespace issue?

Or a corrupted install? It hasn't been able to Go To Definition of functions/methods, etc.  Let me try now that I am on a 'brand new' machine. 

Share this post


Link to post
Share on other sites

I've also experienced strange behaviour from time to time. Not sure what was the reason. Most of the time I think it's me and don't investigate further 😄 

Share this post


Link to post
Share on other sites
13 hours ago, adrian said:

if you really want to run PW code

Thanks for this Adrian. I have used the extension before but to run Python code. Thanks for the example code!

  • Like 1

Share this post


Link to post
Share on other sites

Intelephense works great most of the time... Nevertheless sometimes I don't get proper results, see this example:

yLLayyY.png

Any ideas why I don't get "InputfieldForm" (and several others)?

uQS7BY8.png

Edit: Ok, I changed the filename from InputfieldForm.module to InputfieldForm.module.php and it works. Does anybody have an idea how to make Intelephense index .module files? I already have a user settings for file associations linking .module to .php; That works for code colorization but not for the intellisense 😞 

 

Share this post


Link to post
Share on other sites

Quote:
An open source version of Visual Studio Code that doesn't pass telemetry data back to Microsoft has been released. VSCodium aims to offer a more private development experience to Visual Studio developers.

https://www.i-programmer.info/news/90-tools/12704-open-source-visual-studio-code-without-trackers-launched.html

On my mac vortex.data.microsoft.com is contacted once a minute... More on this over here, for example: https://github.com/Microsoft/vscode/issues/16131

Share this post


Link to post
Share on other sites
On 4/12/2019 at 4:12 PM, bernhard said:

Does anybody have an idea how to make Intelephense index .module files? I already have a user settings for file associations linking .module to .php; That works for code colorization but not for the intellisense 😞 

Anybody? Does it also not work for you guys?

Share this post


Link to post
Share on other sites
29 minutes ago, bernhard said:

Anybody? Does it also not work for you guys?

 

On 3/20/2019 at 5:49 PM, kongondo said:

Mainly directed at @bernhard...

Could you please let me know how you got intelephense to work with .module files? I'd like to switch to it from PHP intellisense but I can't get it to work. It will only do .php files.

Thanks.

🙂

  • Thanks 1

Share this post


Link to post
Share on other sites
6 minutes ago, kongondo said:

Maybe the issue needs to be sorted from intelephense side? If it is provided file associations, it should, theoretically, work. 🙂

Maybe, but maybe not. It would be an easy fix on the PW side and maybe a not-so-easy fix for Intelephense. It should not have any drawbacks and maybe has other benefits as well (like correct syntax highlighting by default, especially if the editor does not support file extension mappings). It seems that newer modules are already using .module.php so it would just be consistent to always use .module.php 🙂 

Share this post


Link to post
Share on other sites

I'm wondering if the "override core module / multiple copies of the same module" feature would break after this, i.e. will ProcessWire understand that a .module file in /site/modules/ is a replacement for a .module.php file in /wire/modules/?

This might not be an issue (can't check right now), but in case it is, then this should only be considered as a part of a bigger update, as it's a breaking change.

  • Like 1

Share this post


Link to post
Share on other sites

Hey all. I was looking this morning at the extensions list for VSCode that I decided to try coming from old NP++ and I stumbled across the OctoberCMS Template Language. I thought to have a quick look for something on PW and since I did not find anything in the editor, googled it and voila... I am very happy that you've already shared some useful extensions to try out. I am having a problem understanding where/how to add @kongondo snippets. So I installed Intelephense and dragged my complete PW project to the explorer but I guess I still have to somehow add the code from processwire_api_visual_studio_code_snippets.json to my editor in order to make it work?

P.S. Never mind, I found it. Seems like I did not realize it is a snippet so I can add it to User snippets. For now I've added it to PHP and got no errors, so I would just need to get used to being spoiled now 😉

Share this post


Link to post
Share on other sites

Since I did not see it mentioned, I think this extension might be useful for coders (at least it is for me) where I can easily prettify my code by saving it or using the shortcuts. As per some videos, it works fine with php, java/script etc. and is called Prettier - Code formatter

As far as VSCode would by default analyze the file opened and use those settings for tab spaces etc. if you want to change the settings of an existing file,  you would need to disable the default behavior and add your preferred options here.

Spoiler

// The number of spaces a tab is equal to. This setting is overridden
// based on the file contents when `editor.detectIndentation` is true.
"editor.tabSize": 4,

// Insert spaces when pressing Tab. This setting is overriden
// based on the file contents when `editor.detectIndentation` is true.
"editor.insertSpaces": true,

// When opening a file, `editor.tabSize` and `editor.insertSpaces`
// will be detected based on the file contents. Set to false to keep
// the values you've explicitly set, above.
"editor.detectIndentation": false

Now, if I decide to change the tab indentation from default 4 spaces to anything else, besides aligning the code nicely, prettier would re-adjust the tab spacing as well 😉

  • Like 1

Share this post


Link to post
Share on other sites

Couple of extensions I've been using for a few weeks that haven't been mentioned here yet. (as far as I can tell)



Bracket Pair Colorizer : Nested Brackets can be a nightmare to debug and is a pet hate of mine. This extension will save you, unless  you're colourblind in the default colours . But I'm sure you can tweak the colours if it comes to that.

ext install CoenraadS.bracket-pair-colorizer

Path Intellisense : If I have to explain what this does, we're definitely not on the same path.

ext install christian-kohler.path-intellisense

Material Icon Theme: I know Material Design was mentioned before. This is an alternative one. Not sure what the difference is between the 2 but I'm using the Winter is Coming theme, and there seems to be an overlap between this and the Material Design theme.

ext install PKief.material-icon-theme

Winter is Coming theme: Any GoT fans out there?

ext install johnpapa.winteriscoming

 

  • Like 1

Share this post


Link to post
Share on other sites

Update on the intelephense issue of core modules: https://github.com/processwire/processwire-issues/issues/860

The mentioned quickfix is to copy all .module files in a temp/hidden directory, eg /site/assets/.intelephense and add the .php file ending. It works:om0ZN6A.png

In my installation I have 139 .module files - quite a lot that is not indexed by Intelephense!

aI6knHx.png

Moving those files to a new folder when anything has changed would be quite easy. Intelephense would always be up to date with the current install (there could be custom modules in /site/modules as you can see in the screenshot).

A custom module for this would be too much, I guess. I think that would fit great into @adrian 's TracyDebugger. What do you (and others) think?

In the meantime I've filed an issue in their repo, you might give me support there: https://github.com/bmewburn/vscode-intelephense/issues/454

  • Like 1

Share this post


Link to post
Share on other sites

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By FrancisChung
      PHPStorm for PW Devs
      This thread is a place for ProcessWire developers who use PHPStorm to share their experience, tips, frustrations, solutions, code snippets and generally discuss all things PHPStorm.
      From Wikipedia:
       
      Thanks @kongondo for the Visual Studio Code post earlier.
    • By szabesz
      CodeRunner 2 is on sale at MacUpdate: https://www.macupdate.com/app/mac/38362/coderunner
      Mostly I use it for writing shell scripts, mocking up algorithms in PHP, JavaScript/jQuery. But is also supports other programming languages as well.
      https://coderunnerapp.com/
      "An advanced, highly flexible, and easy-to-use programming editor for your Mac. CodeRunner supports a large number of languages, and delivers big IDE features while remaining lightweight and clutter-free."
    • By pwFoo
      I moved from netbeans to atom. Tested lighttable, brackets and visual studio code, but at the moment I take a look into web based IDEs. Most are based on ACE editor (alternative could be codemirror) like chrome apps caret or super neutron drive (both with chrome dependency at the moment). 
      Recently I looked into cloud9, codetasty, ... and codiad.
      Codiad is open source. php / js based and works fine. Autocomplete feature and suggestions should be improved, but it's ok. Because it's open source you can download it from github repo or test it as a docker container (wernight/codiad image for example). 
      Codytasty is a cloud hosted solution with a really awesome autocomplete / suggestions for php, js and html! But it isn't open source (there is a free to use hosted version with limited workspaces and features).
      At the moment I testing codiad@docker, but use still atom for coding and searching for the best IDE out there *g*
       
      What do you think about IDEs and the new trend to web based IDEs?
    • By benbyf
      HELLO! Anyone happen to be using Atom the open source IDE from github? I've been using it for about a year now and other than the occassional crash it's been great.
      I was wondering if anyone out there has proccesswire specific snippets, syntax hightlighting or autocomplete package they've created to add their PW work? If not would anyone be interested if I made one, and what would be most useful?
×
×
  • Create New...