CODEWITHSUNDEEP
visual-studio-codedenodeno-fmt
Nino Filiu
Nino Filiu

Reputation: 18483

How to format on save with the Deno VSCode extension?

I am using the vscode-deno extension and eventhough I turned on deno.enable, deno.lint and deno.unstable in my vscode settings, it does not format my code on save, which I suppose is the expected behavior.

I instead used the RunOnSave extension to hack my way into running a deno fmt on file save, but I was wondering if there was a way to do that with the Deno extension alone?

My .vscode/settings.json:

{
  "deno.enable": true,
  "deno.lint": true,
  "deno.unstable": true,
  "emeraldwalk.runonsave": {
    "commands": [
      {
        "match": "\\.ts$",
        "cmd": "deno fmt ${file}"
      }
    ]
  }
}

Upvotes: 11

Views: 4807

Answers (2)

Eray Erdin
Eray Erdin

Reputation: 3149

Just another addition which might scratch your head a little bit. It took me a couple of hours.

My settings.json:

{
  "licenser.license": "MPLv2",
  "editor.defaultFormatter": "denoland.vscode-deno",
  "editor.formatOnSave": true,
  "editor.formatOnSaveMode": "file",
  "editor.codeActionsOnSave": {
    "source.fixAll": "always",
    "source.organizeImports": "always",
  },
  "[typescript]": {
      "editor.defaultFormatter": "denoland.vscode-deno"
  },
  "[javascript]": {
      "editor.defaultFormatter": "denoland.vscode-deno"
  },
  "deno.enable": true,
  "deno.config": "./deno.jsonc",
}

My deno.jsonc:

{
  "compilerOptions": {
    "allowJs": false,
    "lib": ["deno.window"],
    "strict": true
  },
  "lint": {
    "include": ["src/"],
    "exclude": ["src/testdata/", "data/fixtures/**/*.ts"],
    "rules": {
      "tags": ["recommended"],
      "include": ["ban-untagged-todo"],
      "exclude": ["no-unused-vars"]
    }
  },
  "fmt": {
    "useTabs": false,
    "lineWidth": 80,
    "indentWidth": 2,
    "semiColons": true,
    "singleQuote": true,
    "proseWrap": "preserve",
    "include": ["src/", "main.ts"],
    "exclude": ["src/testdata/", "data/fixtures/**/*.ts"]
  },
  "lock": false,
  "nodeModulesDir": false,
  "test": {
    "include": ["src/"],
    "exclude": ["src/testdata/", "data/fixtures/**/*.ts"]
  },
  "tasks": {
    "start": "deno run main.ts"
  },
  "imports": {}
}

In your settings.json, the formatter works only when I add [typescript] part.

And also, check your fmt.include. I forgot to add main.ts into it.

Upvotes: 1

Nino Filiu
Nino Filiu

Reputation: 18483

Found it, I have to turn on formatting on save and specifying the Deno extension as the default formatter

{
  "deno.enable": true,
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "denoland.vscode-deno"
}

Upvotes: 27

Related Questions