工具
nodejs
VSCode
Subline
git
cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
yarn
VSCode
安装汉化插件 chinese
快捷键
ctrl+c复制
ctrl+v黏贴
ctrl+f剪切
ctrl+f查找
ctrl+h替换
ctrl+s保存
ctrl+/行注释
ctrl+shift+a块注释
ctrl+shift+enter上方插入一行
ctrl+shift+F文件夹查找
ctrl+enter下方插入一行
alt+shift+f格式化代码
setting.json
新版本配置(>1.41.0)
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
// An highlighted block { "workbench.colorTheme": "One Monokai", "editor.fontSize": 14, "workbench.editor.enablePreview": true, //预览模式关闭 "editor.formatOnSave": true, // #每次保存的时候自动格式化 // 自动修复 "editor.codeActionsOnSave": { "source.fixAll.eslint": true, }, "eslint.enable": true, //是否开启vscode的eslint // 配置 ESLint 检查的文件类型 "eslint.validate": [ "javascript", "vue", "html" ], "eslint.options": { //指定vscode的eslint所处理的文件的后缀 "extensions": [ ".js", ".vue", ".ts", ".tsx" ] }, "files.associations": { "*.wpy": "vue", "*.wxml": "wxml", "*.cjson": "jsonc", "*.wxss": "css", "*.wxs": "javascript", "*.html": "html" }, "emmet.includeLanguages": { "wxml": "html" }, "minapp-vscode.disableAutoConfig": true, // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSize": 2, // #去掉代码结尾的分号 "prettier.semi": false, // #使用单引号替代双引号 "prettier.singleQuote": true, // #让函数(名)和后面的括号之间加个空格 "javascript.format.insertSpaceBeforeFunctionParenthesis": true, // #让vue中的js按编辑器自带的ts格式进行格式化 "vetur.format.defaultFormatter.js": "vscode-typescript", "git.enableSmartCommit": true, "editor.quickSuggestions": { "strings": true }, //一定要在vutur.defaultFormatterOptions参数中设置,单独修改prettier扩展的设置是无法解决这个问题的,因为perttier默认忽略了vue文件(事实上从忽略列表移除vue也不能解决这个问题) "vetur.format.defaultFormatterOptions": { "prettier": { "semi": false, // 格式化不加分号 "singleQuote": true, // 格式化以单引号为主 }, "js-beautify-html": { // force-aligned | force-expand-multiline "wrap_attributes": "force-aligned" }, "prettyhtml": { "printWidth": 100, "singleQuote": false, "wrapAttributes": false, "sortAttributes": true }, }, // 插件KoroFileHeader // 文件头部注释-快捷键crtl+alt+i(window),ctrl+cmd+t (mac) "fileheader.customMade": { "Descripttion": "", //"version": "", "Author": "voanit", "Date": "Do not edit", "LastEditors": "voanit", "LastEditTime": "Do not Edit" }, //函数注释-快捷键ctrl+alt+t (window), ctrl+alt+t(mac) "fileheader.cursorMode": { "name": "", // "test": "test font", // "msg": "", "param": "", "return": "" }, //安装live Server插件 "liveServer.settings.donotVerifyTags": true, "liveServer.settings.donotShowInfoMsg": true, "liveServer.settings.NoBrowser": true, "liveServer.settings.CustomBrowser": "chrome", //设置默认打开的浏览器 "liveServer.settings.host": "127.0.0.1", "liveServer.settings.port": 5000, //设置本地服务的端口号 "liveServer.settings.root": "/distserver", "[vue]": { "editor.defaultFormatter": "octref.vetur" }, "javascript.updateImportsOnFileMove.enabled": "never", "javascript.implicitProjectConfig.experimentalDecorators": true, "workbench.editor.showTabs": true, "terminal.integrated.rendererType": "dom", "sync.gist": "396472a5bb443e3680d5a0e2ffccefe8", "window.zoomLevel": 0, "diffEditor.ignoreTrimWhitespace": false, "launch": {}, "[jsonc]": { "editor.defaultFormatter": "remimarsal.prettier-now" }, "[typescript]": { "editor.defaultFormatter": "remimarsal.prettier-now" }, "json.schemas": [ { "fileMatch": [ "/myfile" ], "url": "schemaURL" } ] } // An highlighted block { "workbench.colorTheme": "One Monokai", "editor.fontSize": 14, "workbench.editor.enablePreview": true, //预览模式关闭 "editor.formatOnSave": true, // #每次保存的时候自动格式化 // 自动修复 "editor.codeActionsOnSave": { "source.fixAll.eslint": true, }, "eslint.enable": true, //是否开启vscode的eslint // 配置 ESLint 检查的文件类型 "eslint.validate": [ "javascript", "vue", "html" ], "eslint.options": { //指定vscode的eslint所处理的文件的后缀 "extensions": [ ".js", ".vue", ".ts", ".tsx" ] }, "files.associations": { "*.wpy": "vue", "*.wxml": "wxml", "*.cjson": "jsonc", "*.wxss": "css", "*.wxs": "javascript", "*.html": "html" }, "emmet.includeLanguages": { "wxml": "html" }, "minapp-vscode.disableAutoConfig": true, // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSize": 2, // #去掉代码结尾的分号 "prettier.semi": false, // #使用单引号替代双引号 "prettier.singleQuote": true, // #让函数(名)和后面的括号之间加个空格 "javascript.format.insertSpaceBeforeFunctionParenthesis": true, // #让vue中的js按编辑器自带的ts格式进行格式化 "vetur.format.defaultFormatter.js": "vscode-typescript", "git.enableSmartCommit": true, "editor.quickSuggestions": { "strings": true }, //一定要在vutur.defaultFormatterOptions参数中设置,单独修改prettier扩展的设置是无法解决这个问题的,因为perttier默认忽略了vue文件(事实上从忽略列表移除vue也不能解决这个问题) "vetur.format.defaultFormatterOptions": { "prettier": { "semi": false, // 格式化不加分号 "singleQuote": true, // 格式化以单引号为主 }, "js-beautify-html": { // force-aligned | force-expand-multiline "wrap_attributes": "force-aligned" }, "prettyhtml": { "printWidth": 100, "singleQuote": false, "wrapAttributes": false, "sortAttributes": true }, }, // 插件KoroFileHeader // 文件头部注释-快捷键crtl+alt+i(window),ctrl+cmd+t (mac) "fileheader.customMade": { "Descripttion": "", //"version": "", "Author": "voanit", "Date": "Do not edit", "LastEditors": "voanit", "LastEditTime": "Do not Edit" }, //函数注释-快捷键ctrl+alt+t (window), ctrl+alt+t(mac) "fileheader.cursorMode": { "name": "", // "test": "test font", // "msg": "", "param": "", "return": "" }, //安装live Server插件 "liveServer.settings.donotVerifyTags": true, "liveServer.settings.donotShowInfoMsg": true, "liveServer.settings.NoBrowser": true, "liveServer.settings.CustomBrowser": "chrome", //设置默认打开的浏览器 "liveServer.settings.host": "127.0.0.1", "liveServer.settings.port": 5000, //设置本地服务的端口号 "liveServer.settings.root": "/distserver", "[vue]": { "editor.defaultFormatter": "octref.vetur" }, "javascript.updateImportsOnFileMove.enabled": "never", "javascript.implicitProjectConfig.experimentalDecorators": true, "workbench.editor.showTabs": true, "terminal.integrated.rendererType": "dom", "sync.gist": "396472a5bb443e3680d5a0e2ffccefe8", "window.zoomLevel": 0, "diffEditor.ignoreTrimWhitespace": false, "launch": {}, "[jsonc]": { "editor.defaultFormatter": "remimarsal.prettier-now" }, "[typescript]": { "editor.defaultFormatter": "remimarsal.prettier-now" }, "json.schemas": [ { "fileMatch": [ "/myfile" ], "url": "schemaURL" } ] }
旧版本配置
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
{ "editor.tabSize": 2, "files.associations": { "*.vue": "vue" }, "eslint.autoFixOnSave": true, "eslint.options": { "extensions": [ ".js", ".vue" ] }, "eslint.validate": [ "javascript",{ "language": "vue", "autoFix": true },"html", "vue" ], "search.exclude": { "**/node_modules": true, "**/bower_components": true, "**/dist": true }, "emmet.syntaxProfiles": { "javascript": "jsx", "vue": "html", "vue-html": "html" }, "git.confirmSync": false, "window.zoomLevel": 0, "editor.renderWhitespace": "boundary", "editor.cursorBlinking": "smooth", "editor.minimap.enabled": true, "editor.minimap.renderCharacters": false, "editor.fontFamily": "'Droid Sans Mono', 'Courier New', monospace, 'Droid Sans Fallback'", "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}", "editor.codeLens": true, "editor.snippetSuggestions": "top", "eslint.alwaysShowStatus": true, "workbench.iconTheme": "vscode-icons", "git.enableSmartCommit": true, "[javascript]": { "editor.defaultFormatter": "HookyQR.beautify" }, "editor.codeActionsOnSave": { "source.fixAll.eslint": true }, "javascript.updateImportsOnFileMove.enabled": "always", }
快捷键映射
文件-首选项-快捷键映射
自定义快捷键
文件-首选项-键盘快捷方式
插件
CSS Peek html与css关联
Prettier 代码格式化
Icon Font 图标集
Auto Rename 自动修改标签
HTML Boilerplate 自动HTML模板
Color Info颜色提示
Auto Close Tag 自动闭合标签
HTML CSS Support html中css class的智能提示
去除对装饰器报错
.tsconfig.json
{ "compilerOptions": { "experimentalDecorators": true, "allowJs": true } }
移除装饰器警告
在项目目录创建tsconfig.json文件,重启即可
{ "compilerOptions": { "experimentalDecorators": true, "allowJs": true } }
Git
安装git
配置远程仓库
git config -global user.name ‘github用户名’
git config -global user.email ‘邮箱’
操作
git clone '地址'
git checkout
git add .
git commit -m '描述'
git push origin
git pull