Mac 开发环境配置
程序员文章站
2024-02-19 17:58:52
...
1. 命令行alias的配置
alias gco="git checkout [email protected]"
alias gcom="git checkout master"
alias gdf="git difftool [email protected]"
alias gp="git pull"
alias gps="git push"
alias gsh="git stash"
alias gus="git status"
alias hd="hey dev"
alias kd="killl dev"
alias gshp="git stash pop"
alias gd="git difftool"
alias gr="git reset --hard"
alias gc="git commit -m [email protected]"
2. Visual Studio Code
2.1 常用基础设置
// User Setting
{
"editor.tabSize": 2,
"window.zoomLevel": 0,// Specifies the color theme used in the workbench.
"workbench.colorTheme": "Monokai",
"explorer.confirmDelete": false,
"explorer.confirmDragAndDrop": false,
"git.enableSmartCommit": true,
"git.ignoreMissingGitWarning": true,
"window.openFilesInNewWindow": "on",
"workbench.editor.enablePreview": false,
"workbench.editor.enablePreviewFromQuickOpen": false,
"eslint.alwaysShowStatus": true,
"eslint.validate": [
"javascript",
"javascriptreact",
"vue",
"html"
],
"eslint.options": {
"configFile": "/Users/tangyefei/Documents/lieluobo-webui/.eslintrc.js",
"plugins": ["html"]
},
"breadcrumbs.enabled": true
}
2.2 常用插件配置
a. ESLint的配置
在Vue的开发中语法错误可能只出现warning不会报error,但是却会导致页面不能正常渲染。使用ESLint插件进行语法检测,可以规避掉一部分因为粗心导致的低级错误,减少事故发生。
说在前面
- 生成
.eslintrc.js
会出现terminal无响应,属于node v8.1的问题升级到新版可以解决 - 安装插件如果blocked可以改成淘宝镜像进行安装,例如:
$ npm --registry https://registry.npm.taobao.org install --g eslint
配置步骤
- 安装ESLint
$ npm install -g eslint
- 使用
$ eslint --init
初始文件.eslintrc.js
- VSCode中安装ESLint扩展
- 安装插件支持html/vue文件检测,
$ npm install -g eslint-plugin-html
- 修改VSCode配置,将
eslint.options
指向到.eslintrc.js
生成的位置,并使安装的html
插件,并校验html vue
文件
setting.json
配置参考:
"eslint.options": {
"configFile": "/Users/yefeitang/Documents/projects/marketing/web/.eslintrc.js", // place your .eslintrc.js file location inited
"plugins": ["html"]
},
"eslint.validate": [
"javascript",
"javascriptreact",
"html",
"vue"
]
2.3 Snippets示例
// Snippets
{
// Place your global snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and
// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope
// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is
// used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders.
// Placeholders with the same ids are connected.
// Example:
// "Print to console": {
// "scope": "javascript,typescript",
// "prefix": "log",
// "body": [
// "console.log('$1');",
// "$2"
// ],
// "description": "Log output to console"
// }
"Quick call request": {
"scope": "javascript,typescript",
"prefix": "llbreq",
"body": [
"R.$1.$2($3).then(resp => {",
" if(resp.code == 1) {",
" }",
"});"
],
"description": "Log output to console"
},
"Quick ajax post": {
"scope": "javascript,typescript",
"prefix": "llbpost",
"body": [
"${1:$CLIPBOARD}(param) {",
" return Ajax.postJson(`/$2/$3`, param);",
"},",
],
"description": "Quick ajax post"
},
"Quick ajax get": {
"scope": "javascript,typescript",
"prefix": "llbget",
"body": [
"${1:$CLIPBOARD}(param) {",
" return Ajax.get(`/$2/$3`);",
"},",
],
"description": "Quick ajax post"
},
"Heyui Success": {
"scope": "javascript,typescript",
"prefix": "success",
"body": [
"${1:this}.Message.success('${2}');"
],
"description": "Quick ajax post"
}
}
2.4 快捷键 keybindings.json
// Place your key bindings in this file to overwrite the defaults
[
{
"key": "cmd+k cmd+[",
"command": "editor.foldRecursively",
"when": "editorTextFocus"
},
{
"key": "cmd+k cmd+[",
"command": "-editor.foldRecursively",
"when": "editorTextFocus"
},
{
"key": "cmd+k cmd+]",
"command": "editor.unfoldRecursively",
"when": "editorTextFocus"
},
{
"key": "cmd+k cmd+]",
"command": "-editor.unfoldRecursively",
"when": "editorTextFocus"
},
{
"key": "alt+cmd+u",
"command": "editor.action.transformToUppercase"
},
{
"key": "alt+cmd+l",
"command": "editor.action.transformToLowercase"
},
{
"key": "ctrl+`",
"command": "workbench.action.toggleSidebarVisibility"
},
{
"key": "cmd+b",
"command": "-workbench.action.toggleSidebarVisibility"
},
{
"key": "cmd+b",
"command": "workbench.action.terminal.toggleTerminal"
},
{
"key": "ctrl+`",
"command": "-workbench.action.terminal.toggleTerminal"
},
{
"key": "shift+cmd+]",
"command": "-workbench.action.nextEditor"
},
{
"key": "shift+cmd+]",
"command": "editor.action.selectToBracket"
},
{
"key": "ctrl+cmd+right",
"command": "workbench.action.moveEditorRightInGroup"
},
{
"key": "cmd+k shift+cmd+right",
"command": "-workbench.action.moveEditorRightInGroup"
},
{
"key": "cmd+k shift+cmd+left",
"command": "-workbench.action.moveEditorLeftInGroup"
},
{
"key": "cmd+k cmd+j",
"command": "editor.foldAll",
"when": "editorTextFocus"
},
{
"key": "cmd+k cmd+0",
"command": "-editor.foldAll",
"when": "editorTextFocus"
},
{
"key": "cmd+k cmd+l",
"command": "editor.unfoldAll",
"when": "editorTextFocus"
},
{
"key": "cmd+k cmd+j",
"command": "-editor.unfoldAll",
"when": "editorTextFocus"
}
]
上一篇: ubuntu 终端分屏
下一篇: Mac开发环境配置