node. JS development environment configuration under MAC

Source: Internet
Author: User
Tags ack brew cask

We know that Mac is a natural system to improve our development efficiency, reasonable use of the artifact under the Mac, help improve our development efficiency. Individual is a vim control, share today, I am under the Mac is how to carry out node. JS development environment built. Let's show you the final piece!

Iterm2

First, it is recommended to Iterm2 this command-line artifact. It is a terminal replacement tool that supports Macos 10.5+ version. It has many advantages: such as open source free, shortcut key rich, horizontal vertical split screen, remote use of VI compatibility is good. If you add a little, it is also more friendly UI, if you like to tinker, you can configure the theme, so that the Iterm2 interface more friendly, for their daily development is also a visual enjoyment.

Common Keys Introduction:
    • 分窗口操作:shift+command+d(横向)command+d(竖向)
    • Find and paste: command+f, outbound Lookup function, tab check found text, Option+enter paste
    • Automatic completion: command+; The Auto-complete window is paged out according to context, and the upper and lower keys Select
    • Paste history: Shift+command+h5, playback function: Option+command+b
    • Split-screen switching: Command +] and COMMAND + [switch between split screens
    • Fullscreen: Command+enter and Command+shift+enter
    • Tab: COMMAND + t new tab, COMMAND + W close tab page

Installation:
    • You can download the zip package directly from the ITERM2 website (http://iterm2.com/) and drag the app into the app below.
    • The more elegant way is to use Homebrew-cask. It's a command-line artifact. Oh, with Cask, no need to manually download the package DMG, open, drag into the application folder, everything can be handed to the program to do.
      • Install Cast:

      • Install Brew-cask

      • Usage:

        Info XX View XX application information $ brew cask uninstall XX unload xx
      • Installing Iterm2
        Install Iterm2

    • Configuration of the Iterm2

Iterm2 installed, the next step is to iterm2 a theme on the configuration, making its UI more satisfying our visual enjoyment. Personal comparison recommended solarized, first from GitHub (https://github.com/altercation/solarized/tree/master/iterm2-colors-solarized) solarized download down. Then open Iterm2, click ITerm-Preferences. Then click Profiles tab and you'll see colors. After clicking on colors, you will see the following:

Click Load Presets. button, and select Import. This, and then import the solarized package iterm2-colors-solarized/solarized dark.itemcolors file that you clone down from GitHub. After the import is complete, you may find that the theme of Iterm2 has not changed. At this time, there are two points to note:

      • 你需要在 ~/.bash_profile文件下进行配置,增加一行代码即可。 

        Export clicolor=1

      • To make your configuration work, you'll also need to click Iterm-Preferences. Then click Profiles tab, then click Keys, and you'll see the

    • Well, if you go through the steps above, you should see the final configuration of Iterm2 so far.          



Installing OH-MY-ZSH

Most Linux programmers tend to favor bash because it is usually the default for a distribution. Bash is really a good shell, but still useful for a lot of unsatisfactory places, such as automatic completion of the function is not strong enough to locate a long path is not convenient, command history management is not perfect. Zsh claims to be the ultimate Shell, but has been neglected since it was too complex to configure. Fortunately, a programmer has developed a ZSH project that allows you to get started quickly, called Oh-my-zsh. ZSH has several powerful advantages: support for smarter directory completion, and powerful plug-in mechanisms. Believe that you can give a lot of tips for your daily development efficiency.

    • Automatic installation

      SH " $ (wget Https://raw.github.com/robbyrussell/oh-my-zsh/master/tools/install.sh-O-) "

    • Manual Installation
      $ git clone git://github.com/robbyrussell/oh-my-zsh.git ~/.oh-my-zshcp ~/. Oh-my-zsh/templates/zshrc.zsh-template ~/.ZSHRC

Installing Macvim

If you prefer GUI programs, Macvim will make you feel better. Macvim is essentially the same as in Macvim, which can be used in Vim,vim. But Macvim and OS X work Better Together, and Macvim supports a variety of common shortcut keys. On the other hand, if you use Vim, you can only open one tab more. and limited by Terminal, the visible range and the number of colors highlighted are worse than Macvim.

    • Macvim Installation
      Install macvim--with-override-system-vim$ Brew Linkapps

node. JS Development Common VIM plugin configuration

The ability to use a variety of vim plugins can help improve the productivity of node. JS, as well as the power of Vim's divine editor. Just stick to my vim profile.

~/.vimrc

Set nocompatible"Be improvedFileType off"required!Set RTP+=~/.vim/bundle/vundlecall VUNDLE#RC ()"Let Vundle manage Vundle"required!Bundle'Gmarik/vundle'Bundle'altercation/vim-colors-solarized'Bundle'Jlanzarotta/bufexplorer'Bundle'Scrooloose/nerdtree'Bundle'Godlygeek/tabular'Bundle'Mileszs/ack.vim'Bundle'easymotion/vim-easymotion'filetype plugin indent on"required!Set BS=2Set TS=4Set SW=4Set number"shows row and column number at bottom right cornerSet Ruler"For solarized plugin (color scheme)"https://github.com/altercation/vim-colors-solarizedSyntax Enableset background=Darkcolorscheme solarized"nerdtree configMap <C-n>:nerdtreetoggle<cr>

Here's how to configure these common vim plugins.

    • The first step is to select a plug-in management tool pathogen (or vundle, if you do not use one of these two, then you are not a strict sense to have vim users. Personal comparison like Vundle, here take Vundle as an example to explain.
      • 安装Vundle,之后你就可以很方便的通过Vundle对插件进行管理了,so easy~

        $ git clone https://github.com/gmarik/vundle.git ~/.vim/bundle/vundle
      • Installing plugins

        • Save to exit the current vim
        • Re-open Vim, enter command: Bundleinstall, then start installing your plugin
      • Remove Plug-ins

        • Edit the. vimrc file to remove the plug-in line you want to remove
        • Save to exit the current vim
        • Re-open Vim, enter command: Bundleclean
  • Nerd_tree: is a tree file system navigation, it is easy to switch between files and directories, after the installation of Nerd_tree, VIM interface as the traditional IDE. It provides a rich keyboard operation to browse and open files.        
    • Basic Configuration
       map <C-n>:nerdtreetoggle<cr>  "  Press CTRL + N to toggle the window  let Nerdtreechdirmode=2   "  let Nerdtreequitonopen=1    Close the tree when you open the file  let Nerdtreeshowbookmarks=1    display bookmarks  let Nerdtreeminimalui=1   " Span style= "color: #800000;" > do not display the Help panel  let Nerdtreedirarrows=1   "   directory arrows 1 show Arrows 0 traditional +-| number  

       

    • Common shortcut keys
                      W + h: Cursor Focus left tree directory                 w + L: Cursor focus right file display window                 w: Cursor from Move in the left-right                window toggle w + r: Moves the layout position of the current window                           o: Open a file, directory, or bookmark in an existing window and jump to the window                           T: Opens the selected file in the new Tab bookmark, and jump to new Tab                            Split A new window opens the selected file and jumps to the window                           Q: Close the Nerdtree window
    • After the configuration is complete, the following:

    • Tabular: Allows you to align text in Vim by equal sign, colon, table, and so on.
    • Solarized: After installing the solarized, your JavaScript code visuals will be in a leverage.
    • Ack: A better alternative to the grep command.
    • Easymotion:vim Mobile operation is very powerful, hjkl left and right, WB by word movement, FF search and so on, convenient, fast. But there are also weaknesses, the exact jump across multiple lines is quite disappointments. Fortunately, there is a god-performed plugin: Easymotion.
    • Vim-nodejs-complete: Used for node. js keyword completion.
    • JS-HINT:JS syntax error-checking plugin

Install NVM


NVM is a version management tool for node. js, and with it, you can easily manage the version of node. js.

  • Automatic installation
    wget -qo-https://
  • Manual Installation
    $ git clone https:///github.com/creationix/nvm.git ~/.nvm && cd ~/.nvm && git checkout ' git de scribe--abbrev=0--tags '$. ~/.NVM/NVM. SH
  • How to use
    Install 4.1. 1 Download, compile, install V4. 1  0.10. 1 switch to 0. Ten  ls lists all of the local node. JS versions

The development environment of Ok,node.js has been built, and then it can be happily developed.

Reference Links:

1. There is also a recommended article about Vim plugin on GitHub: https://github.com/nodejs/node-v0.x-archive/wiki/Vim-Plugins

2. Using solarized:http://blog.pangyanhan.com/posts/2013-12-13-vim-install-solarized-on-mac-os-x.html on Mac OS X

3. NVM node. JS Version management tool: HTTPS://GITHUB.COM/CREATIONIX/NVM

4. easymotion Vim plug-in configuration: https://github.com/easymotion/vim-easymotion

5. How to install macvim:http://stackoverflow.com/questions/2056137/how-to-run-mvim-macvim-from-terminal from the command line

node. JS development environment configuration under MAC

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.