Theme

1
2
# Dark+
> Color Theme

lint on save

settings.json

1
2
3
4
5
6
7
{
  "editor.formatOnSave": false, // prevent conflict
  "editor.codeActionsOnSave" : {
    "source.fixAll.eslint": true,
    "source.organizeImports": true
  }
}

Vue

Plugins

• Volar
• i18n Ally

volar

Take Over Mode

Why?

创建更少的 Language Server，减少 CPU、内存消耗

Steps:

• Extensions: Show Built-in Extensions
• Disable (Workspace) TypeScript and JavaScript Language Features

ESLint

1
npm install --save-dev eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin

1
2
3
4
5
6
7
8
9
10
11
12
13
14
module.exports = {
  root: true, // ESLint look for config files up to root
  parser: "vue-eslint-parser",
  parserOptions: {
    parser: "@typescript-eslint/parser",
  },
  plugins: [
    "@typescript-eslint"
  ],
  extend: [
    "plugin:@typescript-eslint/recommended",
    "plugin:vue/vue3-recommended"
  ]
}

1
npm install --savedev prettier eslint-plugin-prettier eslint-config-prettier

1
2
3
4
5
{
  extends: [
    'plugin:prettier/recommanded'
  ]
}

check config

1
eslint --print-config file.js

TSLint

Deprecate

https://typescript-eslint.io/docs/linting/tslint

Tailwind

Plugins

• PostCSS Language Support
• Tailwind CSS IntelliSense
  • Autocomplete
  • Linting
  • Hover Preview

Shortcuts

• editor.action.smartSelect.expand
• editor.action.smartSelect.shrink