Skip to main content

Configuring VS Code Web in Coder Workspaces

Updated

 

Issue(s):

I have been able to use code-server effectively; however, I've recently encountered difficulties with using VSCode's native serve-web feature. The process seems to have become more complicated than it used to be.

While following the instructions outlined in the Coder.com VS Code Web guide, I am met with a frustrating 'blank page' upon execution.

I would greatly appreciate your assistance in integrating variables into the startup script, particularly within the context of an agent.

 

Solution to serve-web

For this solution, we will proceed with the assumption that both the Workspace and Template have been successfully updated and that we can initiate the service without issues:

code serve-web --disable-telemetry --port 13337 --without-connection-token --accept-server-license-terms --log trace

 

Our initial guidance is rooted in the Coder.com documentation on VS Code Web. If you encounter a blank page and the Inspector/Network/Console tool displays a URL that lacks the Workspace name and its associated properties, it's important to note that the behavior of the VS Code application has changed recently.

This issue is particularly relevant if you are operating under a configuration that utilizes subdomain=false.

 

To address this, you may need to introduce a new parameter to your command:

--server-base-path $URL

 

To effectively construct the URL and inject it into the startup script, you can leverage the env variable and assemble the URL by utilizing your local or Terraform parameters.

 

Build the server_base_path

 

variable "VSC" {
  type = string
  description = "Slug for the VS Code Web application."
  default = "code-server" # This can vary, use the name from your resource! You can probably extract the name from the Agent instead. Locate your agent_app and resource - typically, 'code-server' will suffice.
}

locals {
  server_base_path = format("/@%s/%s/apps/%s/", data.coder_workspace.me.owner, data.coder_workspace.me.name, var.VSC)
}

 

Variable to persist in the Startup script

 

Within the coder_agent, you will need to construct or add to an env variable that will persist within the Workspace:

resource "coder_agent" "main" {
  env = {
    LSBP=local.server_base_path
  }
}

 

Utilize the variable in the code serve-web command

code serve-web --server-base-path $LSBP --disable-telemetry --port 13337 --host 0.0.0.0 --without-connection-token --accept-server-license-terms --log trace 2>&1 &

 

While it is indeed feasible to use the variables directly, employing separate stanzas can enhance clarity and transparency in your configuration.


After you initiate the startup process, please make sure to check the browser inspector. If the blank page issue persists, it may be beneficial to investigate whether you are encountering the problem discussed in this GitHub issue, which remains unresolved at this time!

 

Related to

Related articles