CODEWITHSUNDEEP
govisual-studio-codewebassembly
Mike Ellis
Mike Ellis

Reputation: 1280

How to get VSCode to use different Go env vars for different directories in the same repo?

I have a Go project that builds a WebAssembly (WASM) app and a backend server for it. Both pieces build and run without errors. VSCode, however, produces an annoying linter error in the WASM app.

could not import syscall/js (no required module provides package "syscall/js")

The problem, as I currently understand it, is that VSCode doesn't infer from the build tags that it should invoke gopls with env GOOS=js GOARCH=wasm and that one solution is to set these tags as workspace Go environment vars.

The app design, however, relies on providing a common internal package to both the wasm and the server code so that each side sees some struct definitions that simplify the interface between them. To that end, the repo is organized (simplified view) as follows:

cmd
├── internal
│   └── common
│       ├── common.go
│       └── common_test.go
├── server
│   └── main.go
└── wasm
    └── main.go

How can I configure VSCode to use env GOOS=js GOARCH=wasm when linting the wasm directory and not for other directories?

Upvotes: 2

Views: 2585

Answers (1)

Mike Ellis
Mike Ellis

Reputation: 1280

Using VSCode's Multi-Root Workspace capability provides a solution I can live with. I ended up flattening my directory hierarchy (eliminated cmd/) to better accommodate VSCode's concepts. The new layout (with a bit more detail than what I showed in my question) is below.

.
├── .gitignore
├── .vscode
├── README.md
├── assets
│   └── index.html
├── go.mod
├── go.sum
├── internal
│   └── common
│       ├── common.go
│       └── common_test.go
├── magefile.go
├── server
│   └── smain.go
├── wasm
│   ├── .vscode
│   │   └── settings.json
│   └── wmain.go
└── workspace.code-workspace

I created the Workspaces in VSCode using "Add Folder to Workspace" as described in the doc linked above. Not quite knowing if it work, I added each individual folder and then added the parent folder. After saving the workspace, VSCode created the workspace.code-workspace file whose contents are shown below.

{
    "folders": [
        {
            "path": "server"
        },
        {
            "path": "internal"
        },
        {
            "path": "wasm"
        },
        {
            "path": "assets"
        },
        {
            "path": "."
        }
    ],
    "settings": {}
}%

With a code-workspace folder in place, one can add a .vscode/settings.json file individual folders. This provided the capability to specify the necessary environment variables to the Go tool chain to prevent import error on syscall/js.

{
    "go.toolsEnvVars": {
        "GOOS": "js",
        "GOARCH": "wasm"
    }
}%

One minor item to note is that the empty .vscode directory at the top level of the hierarchy appears to be necessary. Deleting it brought back the error.

The only annoyances with this solution are:

  1. A prompt asking to enable the workspace file when opening from a command line.
  2. The duplication of the folder listings in the VSCode Explorer sidebar.

Upvotes: 6

Related Questions