diff --git a/recipes/vim/plugin/vim-live-server.vim b/recipes/vim/plugin/vim-live-server.vim new file mode 100644 index 0000000..b06efae --- /dev/null +++ b/recipes/vim/plugin/vim-live-server.vim @@ -0,0 +1,50 @@ +" vim-live-server.vim + +" A live web server for Vim +" By Wolandark +" https://github.com/wolandark/vim-live-server + +function! StartBrowserSync() + let cmd = "browser-sync start --no-notify --server --cwd=" . getcwd() . " --files \"*.html, *.css, *.js\" &" + call system(cmd) + echo "BrowserSync started in the background." +endfunction + +function! StartBrowserSyncOnPort(port) + let port_num = a:port + 0 " Convert a:port to a number + let cmd = "browser-sync start --no-notify --server --cwd=" . getcwd() . " --port=" . port_num . " --files \"*.html, *.css, *.js\" &" + call system(cmd) + echo "BrowserSync started in the background on port " . port_num . "." +endfunction + +function! KillBrowserSync() + let port = systemlist("pgrep -f 'browser-sync'")[0] + if empty(port) + echo "No BrowserSync server found on port 3000." + else + let cmd = "kill " . port + call system(cmd) + echo "BrowserSync server on port 3000 terminated." + endif +endfunction + +function! KillBrowserSyncOnPort(port) + let cmd = "pgrep -f 'browser-sync.*--port=" . a:port . "' | xargs -r kill" + call system(cmd) + echo "BrowserSync server on port " . a:port . " terminated." +endfunction + +function! KillAllBrowserSyncInstances() + let cmd = "pkill -f 'browser-sync'" + call system(cmd) +endfunction + +augroup BrowserSyncKill + autocmd! + autocmd VimLeave * call KillAllBrowserSyncInstances() +augroup END + +command! StartBrowserSync call StartBrowserSync() +command! -nargs=1 StartBrowserSyncOnPort call StartBrowserSyncOnPort() +command! KillBrowserSync call KillBrowserSync() +command! -nargs=1 KillBrowserSyncOnPort call KillBrowserSyncOnPort() diff --git a/recipes/vim/readme.md b/recipes/vim/readme.md new file mode 100644 index 0000000..383631a --- /dev/null +++ b/recipes/vim/readme.md @@ -0,0 +1,89 @@ +# Vim Live Server +## Preview your web development in your browser in real time. +A dead-simple live server implementation using [browser-sync](https://www.npmjs.com/package/browser-sync). + + +## Dependency +- nodejs +- npm + +Install the `browser-sync` package globally using npm: +``` + sudo npm install -g browser-sync +``` + +# Installation +Use your favorite Vim plugin manager to install [vim-live-server](https://github.com/wolandark/vim-live-server). + +#### Using Vim [packages](https://vimhelp.org/repeat.txt.html#packages) (**needs Vim 8+**) +``` +git clone https://github.com/wolandark/vim-live-server.git ~/.vim/pack/plugins/start/vim-live-server/ +``` +Or clone this repository instead and place the plugin folder under `~/vim/pack/plugins/vim-live-server/`
+The results will be the same. + +#### Using [vim-plug](https://github.com/junegunn/vim-plug) + +Add the following line to your plugin configuration in your .vimrc file: +``` +Plug 'https://github.com/wolandark/vim-live-server.git' +``` +With vimplug you can use this alternative command that uses a post-installation hook to download the browser-sync package from npm automatically: + +``` +Plug 'https://github.com/wolandark/vim-live-server.git', { 'do': 'sudo npm install -g browser-sync' } +``` + +#### Using [Vundle](https://github.com/VundleVim/Vundle.vim) + +``` +Plugin 'https://github.com/wolandark/vim-live-server.git' +``` + +#### Using [Pathogen](https://github.com/tpope/vim-pathogen) + +Clone the vim-live-server repository into your Vim bundle directory: +``` +cd ~/.vim/bundle +git clone https://github.com/wolandark/vim-live-server.git +``` + +# Usage +Open your index.html file in vim and issue the following in ex-mode. The server will start and bind itself to `localhost:3000` + +``` +StartBrowserSync +``` + +To start serving on a specific port, use: +``` +StartBrowserSyncOnPort N +StartBrowserSyncOnPort 3009 +``` + +To kill the server on the default port 3000 use this: +``` +KillBrowserSync +``` +Use this command to kill the server on a certain port: +``` +KillBrowserSyncOnPort N +KillBrowserSyncOnPort 3006 +``` +_Note: +vim-live-server will kill all running instances of browser-sync on [VimLeave](https://vimhelp.org/autocmd.txt.html#VimLeave)._ + +# Optional keybindings +``` +nmap :StartBrowserSync +nmap :KillBrowserSync +``` + +

Thats it! Enjoy!

+ +# Demo +https://github.com/wolandark/browser-sync/assets/107309764/218cb8a0-459a-43cd-a987-1b43d1fb2b92 + +# Contact me +[![Telegram](https://img.shields.io/badge/Telegram-2CA5E0?style=for-the-badge&logo=telegram&logoColor=white)](https://t.me/wolandarkside) +[![Protonmail](https://img.shields.io/badge/ProtonMail-8B89CC?style=for-the-badge&logo=protonmail&logoColor=white)](mailto:contact-woland@proton.me)