How Vim artifacts are built

How Vim artifacts are built

[Font: Big Small]

Vim is an ancient artifact, this article will continue to summarize the use of vim to understand some of the instructions and considerations, and continue to share a front-end workers have to install a number of plug-ins, and about the introduction of vim, the choice of topics, and why use Vim-plug to manage plug-ins and other content, Interested students down can be self-understanding and contrast.

Installation

sudo apt-get install vim  //Ubuntu

Other platforms that can own Google.

Beginner's Guide

Vimtutor  //VIM Tutorial

Above is the simplest and most comprehensive vim basic tutorial in history, so far no one has surpassed it.

Here are the authors based on the above generalization:

Move cursor

HJKL2W move forward two words 3e forward to the end of the 3rd word 0 move to the beginning of the line at the end of the current row GG file The last line of the first line of the G file row number +g Specify the line <ctrl>+o the position before the jump back <ctrl>+i return to the position before the jump

Exit

<esc> Enter Normal mode: q! Do not save exit: Wq after saving

Delete

X Delete current character DW Delete to current word end de Delete to current word end, including current character d$ Delete to current line end DD Delete whole row 2DD Delete two rows

Modify

I insert text A at the end of the current line add R to replace the current character o open a new line and enter insert mode

Revoke

U undo <ctrl>+r Cancel Undo

Copy paste Cut

V Enter visual mode y copy p paste yy copy current line DD cut when forward

State

<ctrl>+g display the current line and file information

Find

/Forward lookup (N: Continue to find, N: Continue looking in the opposite direction)? Reverse lookup% lookup paired {, [, (: Set IC ignores case: Set Noic suppress case: set HLS match highlighting: Set is display partial match

Replace

: S/old/new replaces the first matching string of the line: S/old/new/g replaces the entire line of the matching string:%s/old/new/g replaces the whole file's matching string

Folded

ZC Folding ZC Collapse all nested zo expand collapse zo expand all collapsed nested

Execute external command

:!shell Execute external command

. VIMRC

.vimrcis a Vim configuration file that needs our own creation:

CD Home               //Enter home directory touch. VIMRC          /config file # unix# vim-plug# Vimcurl-flo ~/.vim/autoload/plug.vim--create-dirs
   
    https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim# Neovimcurl-flo ~/.local/share/nvim/site/ Autoload/plug.vim--create-dirs     Https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim
   

Other platforms, you can view Vim-plug.

Basic Configuration

Cancel Backup

Set Nobackupset Noswapfile

File encoding

Set Encoding=utf-8

Show line Numbers

Set number

Cancel line break

Set nowrap

Show cursor Current position

Set ruler

Set indent

Set Cindentset Tabstop=2set shiftwidth=2

Highlight when forward

Set Cursorline

Find

Set Icset Hlsset is

The lower left corner shows the current vim mode

Set Showmode

Code Folding

# Turn off the collapse code set nofoldenable when you start vim

Theme

Syntax Enableset background=darkcolorscheme solarized

• Altercation/vim-colors-solarized
• Anthony25/gnome-terminal-colors-solarized

Plug-in configuration

Tree Catalog

 Plug ' scrooloose/nerdtree ' Plug ' jistr/vim-nerdtree-tabs ' Plug ' xuyuanp/nerdtree-git-plugin ' autocmd vimenter * Nerdtreemap <C-n>: nerdtreetoggle<cr>let nerdtreeshowhidden=1let g:nerdtreeshowignoredstatus = 1let g: Nerdtree_tabs_open_on_console_startup=1let G:nerdtreeindicatormapcustom = {\ "Modified": "?", \ "staged": "?"    , \ "untracked": "?", \ "Renamed": "?", \ "unmerged": "═", \ "Deleted": "?", \ "Dirty": "?",    \ "clean": "??", \ ' ignored ': '? ', \ "Unknown": "?" \}# o Open close file or directory # e open the selected directory as a file management # T opens in the tab in the tab, but the cursor is still left in the directory where the nerdtree# R refreshes the cursor # R refreshes the current root path # X close all directories # p lowercase, jump to Cursor location The upper-level path # P uppercase, jumps to the current root path # J to the first node # K to the last node # I show hidden file # m Show file Action menu # C set the root path to the directory where the cursor is located # u set the parent directory as the root Path # CTRL + W + W cursor automatically cut in the left right window      Change # Ctrl + W + R to move the layout position of the current window #: TABC Close the current tab#: Tabo Close all other tab#: TABP before a tab#: Tabn after a tab# GT before a tab# GT After a tab 

• Scrooloose/nerdtree
• Vim-nerdtree-tabs
• Nerdtree-git-plugin

Code, quotation marks, path completion

Plug ' valloric/youcompleteme ' Plug ' raimondi/delimitmate ' Plug ' Shougo/deoplete.nvim ', {' Do ': ': Updateremoteplugins '}

• Valloric/youcompleteme
• Raimondi/delimitmate
• Shougo/deoplete.nvim

Syntax highlighting, checking

Plug ' Sheerun/vim-polyglot ' Plug ' w0rp/ale ' let g:ale_linters = {\    ' javascript ': [' eslint '],\    ' css ': [' Stylelint '],\}let g:ale_fixers = {\    ' javascript ': [' eslint '],\    ' css ': [' stylelint '],\}let g:ale_fix_on_save = 1let g:ale_sign_column_always = 1let g:ale_sign_error = ' let g:ale_sign_warning = '? ' Nmap <silent> <C-k> <Plug> (ale_previous_wrap) nmap <silent> <C-j> <Plug> (ale_next _wrap)

• W0rp/ale
• Sheerun/vim-polyglot

File, code Search

Plug ' Rking/ag.vim ' Plug ' Kien/ctrlp.vim '

• Kien/ctrlp.vim
• Ggreer/the_silver_searcher
• Rking/ag.vim

Enhanced status bar

Plug ' vim-airline/vim-airline ' Plug ' vim-airline/vim-airline-themes ' let g:airline_theme= ' Papercolor '

• Vim-airline/vim-airline
• Vim-airline/vim-airline-themes

Code comments

Plug ' scrooloose/nerdcommenter ' # <LEADER>CC//Note # <LEADER>CM use only a set of symbol comments # <leader>ca Add comments at the end of the line # < leader>c$/* Comment */# <leader>cs/* block comment */# <leader>cy comment and copy # <leader>c<space> comment/Uncomment # <leade R>CA Toggle//And/* */# <LEADER>CU uncomment let g:nerdspacedelims = 1let g:nerddefaultalign = ' Left ' let G:nerdcustomdelimi  ters = {            \ ' javascript ': {' Left ': '/', ' leftalt ': '/** ', ' rightalt ': ' * * '}, ' less            ': {' left ': '/** ', ' right ': ' */'}        \}

• Scrooloose/nerdcommenter

Git

Plug ' airblade/vim-gitgutter ' Plug ' tpope/vim-fugitive '

• Airblade/vim-gitgutter
• Tpope/vim-fugitive

Markdown

Plug ' Suan/vim-instant-markdown ' let G:instant_markdown_slow = 1let G:instant_markdown_autostart = 0#: I Nstantmarkdownpreview

• Suan/vim-instant-markdown

Emmet

Plug ' Mattn/emmet-vim ' let g:user_emmet_leader_key= ' <Tab> ' let g:user_emmet_settings = {         \ ' javascript.jsx ': {            \ ' extends ': ' jsx ',         \},      \}

• Mattn/emmet-vim

HTML 5

Plug ' Othree/html5.vim '

• Othree/html5.vim

CSS 3

Plug ' hail2u/vim-css3-syntax ' Plug ' ap/vim-css-color ' augroup vimcss3syntax  autocmd!  Autocmd FileType css setlocal iskeyword+=-augroup END

• Hail2u/vim-css3-syntax
• Ap/vim-css-color

Javascipt

2. Plug‘pangloss/vim-javascript‘
4. let g:javascript_plugin_jsdoc =1
6. let g:javascript_plugin_ngdoc =1
8. let g:javascript_plugin_flow =1
10. set foldmethod=syntax
12. let g:javascript_conceal_function ="ƒ"
14. let g:javascript_conceal_null ="ø"
16. let g:javascript_conceal_this ="@"
18. let g:javascript_conceal_return ="?"
20. let g:javascript_conceal_undefined ="¿"
22. let g:javascript_conceal_NaN ="?"
24. let g:javascript_conceal_prototype ="¶"
26. let g:javascript_conceal_static ="•"
28. let g:javascript_conceal_super ="Ω"
30. let g:javascript_conceal_arrow_function ="⇒"
32. let g:javascript_conceal_noarg_arrow_function =" "
34. let g:javascript_conceal_underscore_arrow_function =" "
36. set conceallevel=1

• Pangloss/vim-javascript

(Note: Special characters are present in the above script, and in some cases they are not displayed correctly, please use the above linked content directly.) ）

React

1. Plug‘mxw/vim-jsx‘
2. let g:jsx_ext_required =0

• Mxw/vim-jsx

Prettier

2. Plug‘prettier/vim-prettier‘,{
4. \ ‘do‘:‘yarn install‘,
6. \ ‘for‘:[‘javascript‘,‘typescript‘,‘css‘,‘less‘,‘scss‘,‘json‘,‘graphql‘]}
8. let g:prettier#config#bracket_spacing =‘true‘
10. let g:prettier#config#jsx_bracket_same_line =‘false‘
12. let g:prettier#autoformat =0
14. autocmd BufWritePre*.js,*.jsx,*.mjs,*.ts,*.tsx,*.css,*.less,*.scss,*.json,*.graphql PrettierAsync
16. #:Prettier

• Prettier/vim-prettier

Summarize

Finally, refer to the reference configuration. VIMRC, if there is a better idea about vim, please talk in the comments.

Introduction to VIM Basics http://www.linuxidc.com/Linux/2017-02/140903.htm

Introduction to VIM Basic Tutorial http://www.linuxidc.com/Linux/2017-02/140279.htm

Make Vim a good C + + IDE http://www.linuxidc.com/Linux/2016-06/132262.htm

Ubuntu 14.04 upgrade Vim7.4 to 8.0 http://www.linuxidc.com/Linux/2016-11/136816.htm

VIM Installation Youcompleteme Auto-complete plug-in http://www.linuxidc.com/Linux/2016-11/137665.htm

The Linux Vim Editor uses a simple explanation http://www.linuxidc.com/Linux/2016-12/138930.htm

Vim Text editor http://www.linuxidc.com/Linux/2017-03/142275.htm

Vim installation and configuration Advanced version http://www.linuxidc.com/Linux/2017-03/141724.htm

Vim Editor Using tutorial http://www.linuxidc.com/Linux/2017-07/145885.htm

Ubuntu 16.04 Vim youcompleteme Auto-Complete installation configuration and use Http://www.linuxidc.com/Linux/2017-02/141088.htm

Linux Text Editor vim basic tutorial http://www.linuxidc.com/Linux/2017-09/146930.htm

This article permanently updates the link address : http://www.linuxidc.com/Linux/2017-10/147990.htm

How Vim artifacts are built