跳槽是每个人的职业生涯中都要经历的过程，不论你是搜索到的这篇文章还是无意中浏览到的这篇文章，希望你没有白白浪费停留在这里的时间，能给你接下来或者以后的笔试面试带来一些帮助。
也许是互联网未来10年中最好的一年。WINTER IS COMING。但是如果你不真正的自己去尝试尝试，你永远不知道市面上的行情如何。这次找工作下来，我自身感觉市场并没有那么可怕，也拿到了几个大厂的offer。在此进行一个总结，给自己，也希望能帮助到需要的同学。
面试准备
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
面试准备根据每个人掌握的知识不同，准备的时间也不一样。现在对于前端岗位，以前也许不是很重视算法这块，但是现在很多公司也都会考。建议大家平时有空的时候多刷刷leetcode。算法的准备时间比较长，是一个长期的过程。需要在掌握了大部分前端基础知识的情况下，再有针对性的去复习算法。面试的时候算法能做出来肯定加分，但做不出来也不会一票否决，面试官也会给你提供一些思路。
git clone https://github.com/tomtom/tlib_vim.git
git clone https://github.com/MarcWeber/vim-addon-mw-utils.git
git clone https://github.com/garbas/vim-snipmate.git
Optional:
git clone https://github.com/honza/vim-snippets.git
- vim-surround 辅助格式控制(用于括号、引号等) github
cd ~/.vim/bundle/
git clone git://github.com/tpope/vim-surround.git
- jsbeauty-vim 自动美化代码，可配合 vim-autoformat 使用 github
cd ~/.vim/bundle/
git clone https://github.com/maksimr/vim-jsbeautify.git
cd vim-jsbeautify && git submodule update --init --recursive
- vim-markdown 把高亮功能推广到 markdown github
cd ~/.vim/bundle/
git clone https://github.com/plasticboy/vim-markdown.git
- vim-instant-markdown 预览 markdown githjub
npm -g install instant-markdown-d
- vim-markdown-toc 为 markdown 生成标题 github
cd ~/.vim/bundle/
git clone https://github.com/mzlogin/vim-markdown-toc.git
- youcompleteme 代码提示和补全 github
这个放在最后因为它比较复杂。属于可选的插件，根据自己需求安装。
首先，在 vim normal 模式输入 :version 查看其版本，要求版本大于7.4.143, 否则更新它。
其次，在 vim normal 模式输入 :echo has('python') || has('python3'), 如果输出为0，请更新 vim 以支持 python。
之后，在终端输入：
cd ~/.vim/bundle/
git clone https://github.com/Valloric/YouCompleteMe.git
cd ~/.vim/bundle/YouCompleteMe/
git submodule update --init --recursive
cd ~/.vim/bundle/YouCompleteMe/third_party/ycmd/third_party/tern_runtime
npm install --production
如果你需要支持 typescript，安装：
npm install -g typescript
- vim-less les支持 github
cd ~/.vim/bundle/
git clone https://github.com/groenewege/vim-less
到这里还没有完，作为前端人，这个还不能正常工作，它需要一些依赖，下面我们来安装这些依赖：
- 安装 tern github 查看
回到 bundle 目录 安装
cd ~/.vim/bundle
git clone https://github.com/ternjs/tern_for_vim.git
cd ~/.vim/bundle/tern_for_vim
npm install
之后需要在您的项目根目录建立一个 .tern-project 文件，没有内容，空白即可。该文件内部结构如下:
{ “libs”: [ “browser”, “jquery” ], “loadEagerly”: [ “importantfile.js” ], “plugins”: {
“requirejs”: {
“baseURL”: “./”,
“paths”: {}
}
}
}
此部分详细配置在此 http://ternjs.net/doc/manual.html
- apt-vim 自动管理插件 github
这里再安装一个插件自动管理插件，也比较麻烦，根据自己需求安装：
- 自动安装
curl -sL https://raw.githubusercontent.com/egalpin/apt-vim/master/install.sh | sh
2.手动安装
需要Python2.7.x或Python3.0+
cd ~/.vim/bundle/
git clone https://github.com/egalpin/apt-vim.git
cd apt-vim
sudo ./apt-vim init
编辑 ~/.bashrc 或 ~/.bash_profile , 添加下面一句话
export PATH=$PATH:~/.vimpkg/bin
编辑 ~/.vimrc 添加：
execute pathogen#infect()
call pathogen#helptags()
继续在终端执行：
source ~/.bashrc
apt-vim install
如果这里提示了：Completed successfully. 那就大功告成了。
到此为止，作为一个前端人的 vim 就基本搭建好了，如果还有什么好用的插件欢迎分享交流，如果你觉得这些插件还足够，可以去知乎、stackoverflow、或 github 上再挖掘一些。一些更高级插件会随着博主的积累，不断更新这篇内容的，欢迎关注。
下面附了我 .vimrc 和 .editorconfig 文件的内容：
"vimrc
"vim original config
set ignorecase " ignore upper- or lowercase in search model
set smartcase " if there is uppercase in search string ignore ‘ignorecase’ setting. it only works with ‘ignorecase’ setting
set autowrite " auto write changes into file after :next、:rewind、:last、:first、:previous、:stop、:suspend、:tag、:!、:make、<C-]> or <C-^> runs, as well as jumps to another file with :buffer、、、‘{A-Z0-9}’ or {A-Z0-9}
set nocompatible "Donot compate with vi, to avoid some bugs
filetype on "check the file type
set autoindent " use auto-indentation
set smartindent " use smart indentation
set tabstop=2 " set the width of tab key
set softtabstop=2 " set the width of soft key
set shiftwidth=2 " auto-indent with 2 spaces
set backspace=2 " enable to use backspace
set showmatch " show the matched braces
set linebreak " wrap without breakword
set whichwrap=b,s,<,>,[,] "jump to previous/next line when cursor at the head/end of line when input ‘b’/‘w’ in normal model
set relativenumber " show relative line number
set previewwindow " show preview window
set history=1000 " set command history to 1000
set laststatus=2 " show the last activited window’s status line always
set ruler " show line number and column number in status line
"command line setting
set showcmd " show inputted command in command line
set showmode " show current model in command line
set showmatch "show match brace
set guioptions=T "remove the toolbar in GUI
filetype on "check the file type
"finding setting
set incsearch " show matched words when input string
set hlsearch
"pathongen
execute pathogen#infect()
syntax on
filetype plugin indent on
"airline
let g:airline_theme=‘molokai’ "use a theme called ‘molokai’
let g:airline#extensions#tabline#enabled=1 "show the tab line on the top
let g:airline_powerline_fonts=1 "use powerline fonts
"emmet
let g:user_emmet_mode=‘n’ "only enable normal mode functions.
let g:user_emmet_mode=‘inv’ "enable all functions, which is equal to
let g:user_emmet_mode=‘a’ "enable all function in all mode.
let g:user_emmet_install_global=0
autocmd FileType html,css EmmetInstall "enable for just html/css
let g:user_emmet_leader_key=‘’ "change the default key() to , the trailing ‘,’ still needs to be entered as well
"editConfig
let g:EditorConfig_exclude_patterns = [‘fugitive://.*’] "ensure that this plugin works well with Tim Pope’s fugitive
let g:EditorConfig_exclude_patterns = [‘scp://.*’] "avoid loading EditorConfig for any remote files over ssh
let g:EditorConfig_exec_path = ‘~/.vim/.editorconfig’
let g:editorconfig_Beautifier = ‘~/.vim/.editorconfig’
"vim-javascript
let g:javascript_plugin_jsdoc=1 "Enables syntax highlighting for JSDocs.
let g:javascript_plugin_ngdoc=1 "Enables some additional syntax highlighting for NGDocs. Requires JSDoc plugin to be enabled as well.
"jsDoc
let g:jsdoc_enable_es6=1 "Enable to use ECMAScript6’s Shorthand function, Arrow function.
let g:javascript_plugin_flow=1 "Enables syntax highlighting for Flow.
"syntastic
set statusline+=%#warningmsg#
set statusline+=%{SyntasticStatuslineFlag()}
set statusline+=%*
let g:syntastic_always_populate_loc_list = 1
let g:syntastic_auto_loc_list = 1
let g:syntastic_check_on_open = 1
let g:syntastic_check_on_wq = 0
let g:syntastic_enable_highlighting=1
"apt-vim
execute pathogen#infect()
call pathogen#helptags()
"jsbeautify
autocmd FileType javascript noremap :call JsBeautify()
autocmd FileType json noremap :call JsonBeautify()
autocmd FileType jsx noremap :call JsxBeautify()
autocmd FileType html noremap :call HtmlBeautify()
autocmd FileType css noremap :call CSSBeautify()
"vimCSS3syntsx
augroup VimCSS3Syntax
autocmd!
autocmd FileType css setlocal iskeyword+=-
augroup END
"vimCSScolor
let g:cssColorVimDoNotMessMyUpdatetime = 1
"YCM
let g:ycm_semantic_triggers = { ‘scss,css’: [ ‘re!^\s{2,4}’, ‘re!:\s+’ ], ‘html’: [‘<’, ‘"’, ‘</’, ’ '] }
"less2css
let g:less_autocompile = 1 " 这是开关 设置1保存less自动生成css 设置0关闭
function! s:auto_less_compile() " {{{
if g:less_autocompile != 0
try
最后
其实前端开发的知识点就那么多，面试问来问去还是那么点东西。所以面试没有其他的诀窍，只看你对这些知识点准备的充分程度。so，出去面试时先看看自己复习到了哪个阶段就好。
这里再分享一个复习的路线：（以下体系的复习资料是我从各路大佬收集整理好的）
《前端开发四大模块核心知识笔记》
最后，说个题外话，我在一线互联网企业工作十余年里，指导过不少同行后辈。帮助很多人得到了学习和成长。
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
我意识到有很多经验和知识值得分享给大家，也可以通过我们的能力和经验解答大家在IT学习中的很多困惑，所以在工作繁忙的情况下还是坚持各种整理和分享。
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
