How to open a file in vscode from browser? - visual-studio-code

I want my webapp to be able to open a given file in VS code. For example, when I click a button on my webapp, a file say, C:\Users\...\myProject\index.html is opened, if myProject is already opened it should navigate to index.html
I know its a peculiar use case but I want to know if its possible in vscode.
Its also completely fine if it requires using browser or vscode extension.

vscode://file/{full path to project}/
Thanks to fbg13 for providing this link

It is possible if you are using Firefox:
Open the about:config page.
Set the view_source.editor.external to true.
Set the view_source.editor.path to the VSCode's executable absolute path.

It is possible if you add this link:
vscode://file/{fullpath}:{numrow}
Example for Symfony 5.3 and higher
For example in Symfony to use the link that appears in the debug bar of the controller used you can do it as described in the examples. You have to edit your project config.
Only for VS Code:
config\packages\framework.yaml
framework:
ide: 'vscode://file/%%f:%%l'
For any editor through env:
config\packages\framework.yaml
framework:
ide: '%env(resolve:CODE_EDITOR)%'
And don't forget to add value for CODE_EDITOR into .env or .env.local.
Local
This is an example for local projects.
.env or .env.local:
CODE_EDITOR=vscode
# or
CODE_EDITOR=vscode://file/%%f:%%l
Docker
If you use Docker or trying to open a file from remote server, you may use this example.
.env or .env.local:
# Template
CODE_EDITOR=vscode://file/%%f:%%l&/PATH/TO/YOUR/SERVER/APP>/PATH/TO/YOUR/LOCAL/APP
# Real paths
CODE_EDITOR=vscode://file/%%f:%%l&/app/>/home/user/projects/symfony_project/
For more details see these pages:
Symfony Framework Configuration Reference - ide
Opening VS Code with URLs

You can install vscode-handler to open files like this
vscode://open?url=file://%file&line=%line

Related

vscode extension development: svelte content not loading in webview after building the vscode extension

I am building a vscode extension by using svelte for webview. I am following https://youtu.be/a5DX5pQ9p5M. But the deployment of extension is not mentioned in the tutorial .
So i am following https://code.visualstudio.com/api/working-with-extensions/publishing-extension.
So after packaging the extension with vsce package and installing the extension the extension doesn't load svelte content but when running in developer mode everything works fine.
I tried creating the package extension multiple Times but still didn't work.
Check if all necessarily files are included via:
vsce ls
(You can also open packaged extensions, they are just ZIP-archives with a different extension.)
If they are not (e.g. src is excluded by default), you probably can create a .vscodeignore file and manually specify what to exclude.
Running extension problems can be inspected via Help > Toggle Developer Tools, usually you will find some errors in the console.
I do not know if debugging forces the extension to load, but if so, make sure you have set the correct activationEvents.

How to create a template out of my customized launch.json in vscode?

For my project, I have customized my launch.json file.
How can I save my own customized launch configuration as a template? Just like C++ (GDB/LLDB) template
So that I can re-use it easily every time I open a new folder(project).
I don't want to add it under global launch configuration. Adding it there would start showing up my launch configurations even for other kind of projects where this launch configuration is inappropriate.
I wanted to have the same behavior that is achieved for C++ (GDB/LLDB) template. How is that achieved?
Edit - I have raised an enhancement request VSCode GitHub-
https://github.com/microsoft/vscode/issues/109234
They are part of the debugger configuration in the language extension.
Way too much trouble to create an extension for this.
Just create a snippet for a .json file and use it while editing the .vscode/launch.json

Chrome devtools save changed file path

I use browsersync and run site on local machine on http://localhost:3000/ — when i change css file (example path: ./static/css/menu.css/from devtools - it saved to root project folder in ./localhost%253a3000/static/css/menu.css
how can i change this path?
Thanks!
You got override locals featured enabled. You need to disabled it, and enable workspaces feature instead. I'm not giving all details because this features are different from chrome version to another. You can use the links to get workspaces working.

How to run files as a project in VS Code?

I'm trying to learn Vue.js as well so I create a simple folder called VueTest.
I have two files in the folder:
app.js
index.html
I found the info on how to configure the task runner to open up the current file and I have that setup to open in Chrome, which it does. However, because it's not running as a project, my index.html doesn't see the app.js file and so my Vue project is not working correctly. I just runs the HTML code an all I see is my mustache code (ex: {{Title}}).
How do I run files as a project?
If get it correct - you want to launch js app without opening teminals outside 'VS Code' then you have to see this
Have fun
I found my mistake, it's actually easy and I should have figured this out before posting.
To run Index.html on it's own, all I had to do was make a script reference in the page pointing to the app.js file. I didn't have to do that in JsFiddle.
you can't run files as a project in VS Code. it is just a text editor.

Netbeans and PHPUnit Skeletion Generator: No such file or directory

I use netbeans 7.2.1 and newest phpunit. When I want to generate a unit test in netbeans by right-clicking on the php class then Tools-> Create phpUnit test the Skeleton generator throws an error: No such file or directory.
require_once(/sharedResources/connection.inc.php): failed to open stream: No such file or directory
The issue is that the path displayed in require_once is wrong. It is generatedliek this:
$sharedResources = getenv("DOCUMENT_ROOT") . "/sharedResources";
and should resolve to the absolute file path. This works fine when application is running in apache. However it seems that getenv("DOCUMENT_ROOT") is just wrong when running from netbeans. My question is how I can set it correctly? My application is under
getenv("DOCUMENT_ROOT") . "/MyApp";
and the file I'm creating a test for is in
"MyApp/services"
Under Project properties there is an option web root but it is greyed out and it is impossible to set it to a folder one level higher than your application.
How can I solve this?
EDIT:
Further clarification:
I initially had a relative filepath to sharedResources which did not work also. the I changed to this one and of coruse ti makes sense it is not working as DOCUMENT_ROOT is set by apache and hence not set when running in netbeans. So a temprary fix is to add
$docRoot = getenv("DOCUMENT_ROOT");
if(empty($docRoot)){
putenv("DOCUMENT_ROOT=C:/xampp/htdocs");
}
to the head of every class. of course that is not a very practical or good solution. I would need to tell netbeans to set this environment variable or to use correct relative path.
Well here is my solution. It's not ideal but simple and works. The issue is that DOCUMENT_ROOT is obviously empty when script is not called by Apache but by netbeans. Hence it must somehow be set. To do that I edited the php file phpunit-skelgen(it does not have a file ending but it's a php file).
Below the license text as first php line I added
putenv("DOCUMENT_ROOT=C:/xampp/htdocs");
That did the trick.