开发

chrome 插件

  • Adblock Plus Adblock Plus 是拥有超过 5 亿次下载的全球最受欢迎的广告拦截软件之一。
  • JSONView Validate and view JSON documents
  • Octotree Code tree for GitHub
  • React Developer Tools Adds React debugging tools to the Chrome Developer Tools.
  • Redux DevTools Redux DevTools for debugging application’s state changes.
  • session manager Simple yet powerful tab set management. Quickly and easily save, update, remove, and restore sets of tabs!
  • Smart TOC Add a table of contents for web article or documentation
  • smartUp 手势 一个更好的手势类扩展。功能包括:鼠标手势,简易拖曳,超级拖曳,摇杆手势和滚轮手势。
  • The QR code extension 允许当前页面生成 QR 码,并使用网络摄像头扫描 QR 码。
  • vuejs devtools Chrome and Firefox DevTools extension for debugging Vue.js applications.
  • youdao 划词翻译 支持 Chrome 浏览器的划词翻译
  • 简阅 SimpRead 让你瞬间进入沉浸式阅读的 Chrome 扩展,类似 Safari 的阅读模式。

chrome app

  • Marmoset Marmoset is a Chrome App which lets you create gorgeous code snapshots within seconds.
  • Postman Postman makes API development faster, easier, and better.
  • Tamper Chrome Intercept and modify Chrome requests
  • Web Server for Chrome A Web Server for Chrome, serves web pages from a local folder over the network, using HTTP. Runs offline.

vscode 插件

  • Better Comments
  • Debugger for Chrome
  • Import Cost
  • open in browser
  • vetur
  • VS Live Share
  • Cobalt2 Theme Official
  • Code Runner
  • GitLens — Git supercharged
  • Custom CSS and JS Loader

Terminal

环境

npm 常用包

  • anywhere 随地启动一个local http server
  • npm-check 检查项目中的 npm 包是否有新的版本,并可以选择更新
  • nrm npm 源管理,方便切换
  • ntl npm task list, 快速查看package.json可执行的script命令
  • yarn 快速依赖管理
  • hexo-cli hexo 博客 cli
  • pm2 node 进程管理
  • wepy-cli 小程序开发框架

日常软件

  • WeChat
  • QQ
  • Microsoft Office
  • Wondershare Video Converter Ultimate 万能视频格式转换器,可以将包括 MP4、MOV 、3GP、AVI、WMV、RM、MPEG-1、MPEG-2、FLV、ASF、M4A、WMA、WAV、MP3、AAC 和 AC3 在内的多媒体格式转换为便携式视频/音频播放器(Zune、iPod、Apple TV、iPhone、PSP)支持的格式,且不会失去原有的品质。
  • Alfed 效率工具,如查字典、打开书签、搜索文件、打开文件等
  • MacDown
  • LICEcap gif 录制工具
  • Evernote
  • 网易云音乐
  • keynote 一个演示幻灯片应用软件

usersetting.json

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
{
"workbench.iconTheme": "material-icon-theme",
"workbench.colorTheme": "Cobalt2",
"gitlens.advanced.messages": {
"suppressCommitHasNoPreviousCommitWarning": false,
"suppressCommitNotFoundWarning": false,
"suppressFileNotUnderSourceControlWarning": false,
"suppressGitVersionWarning": false,
"suppressLineUncommittedWarning": false,
"suppressNoRepositoryWarning": false,
"suppressResultsExplorerNotice": true,
"suppressShowKeyBindingsNotice": true
},
"explorer.confirmDelete": false,
"terminal.integrated.cursorBlinking": true,
"extensions.ignoreRecommendations": false,
"terminal.integrated.fontFamily": "Inconsolata for Powerline",
"editor.fontFamily": "Monaco",
"editor.fontSize": 16,
"editor.lineHeight": 25,
"editor.letterSpacing": 0.5,
"files.trimTrailingWhitespace": true,
"editor.fontWeight": "400",
"editor.cursorStyle": "line",
"editor.cursorWidth": 5,
"editor.cursorBlinking": "blink",
"vscode_custom_css.imports": ["file:///User/xiaojie/.vscodestyles.css"],
"editor.renderWhitespace": "none",
"window.zoomLevel": -2,
"gitlens.historyExplorer.enabled": true,
"workbench.startupEditor": "newUntitledFile",
"workbench.activityBar.visible": true,
"eslint.alwaysShowStatus": true,
"javascript.updateImportsOnFileMove.enabled": "always",
"editor.tabSize": 2,
"editor.detectIndentation": false,
"files.autoSave": "off",
"breadcrumbs.enabled": true,
"editor.minimap.enabled": true,
"editor.renderControlCharacters": true,
"gitlens.gitExplorer.files.layout": "list",
"better-comments.highlightPlainText": true,
"files.associations": {
"*.wpy": "vue"
}
}

.vscodestyles.css

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
.monaco-shell {
font-family: 'Operator Mono', 'Inconsolata', monospace;
}

/* This makes the dirty tab circle yellow */
.vs-dark
.monaco-workbench
> .part.editor
> .content
> .one-editor-silo
> .container
> .title
.tabs-container
> .tab.dirty
.close-editor-action {
background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' height='16' width='16'%3E%3Ccircle fill='%23ffc600' cx='8' cy='8' r='4'/%3E%3C/svg%3E")
50% no-repeat;
}

.monaco-workbench > .editor > .content > .one-editor-silo {
border-top: 1px solid #15232d !important;
}

.one-editor-silo + .one-editor-silo {
border-left: 1px solid #15232d !important;
}

/*
This puts a thin yellow border around the found items like Sublime did it
*/
.monaco-editor .findMatch,
.monaco-editor .selectionHighlight {
border: 1px solid #ffc600;
border-radius: 2px;
background: transparent;
}

/* This accounts for larger font cutting off - bump up 3px */
.monaco-workbench
> .activitybar
> .content
.monaco-action-bar
.badge
.badge-content {
top: 17px !important;
}