Web front-end development play win10 Linux subsystem

Time:2019-10-23

preface

Linux subsystem (WSL) functionality is already built into the latest version of Windows 10. After a week of development with win10 WSL, I feel that macOS has completely replaced the position in web front-end development. Linux environment terminal tools ease of use, environmental stability and win10 mass software ecology combined, and then look at the PC choice of the broad, simply not too wonderful. It is time to abandon OSX and choose win10 as the main productivity tool platform for web front-end developers.

In general, to use the WSL environment as a web front-end development environment, we need the following steps: turn on WSL functions, install the Linux distribution, switch Linux sources, configure the ZSH terminal environment, install NodeJs, configure the VSCode terminal environment, and so on.

reference

Dev on Windows with WSL

Windows 10 Linux subsystem oh-my-zsh with Cmder configuration -2018

Turn on win10 Linux

Step 1: click win+xApplications and functions, open programs and functions

Web front-end development play win10 Linux subsystem

Web front-end development play win10 Linux subsystem

Web front-end development play win10 Linux subsystem

Step 2: check to enable Linux

Web front-end development play win10 Linux subsystem

Install a Linux distribution

  1. Click win to open the win10 app store

    Web front-end development play win10 Linux subsystem

  2. Search for Linux keywords

    Web front-end development play win10 Linux subsystem

  3. Install ubuntu18

    Web front-end development play win10 Linux subsystem

  4. Open the ubuntu18 app icon

    Web front-end development play win10 Linux subsystem

  5. The first time you install the terminal, you will be prompted to access the website and operate powershell to enable the function in administrator mode (you can’t take the screenshot after the operation, you can operate by yourself).
  6. Waiting for the installation

    Web front-end development play win10 Linux subsystem

  7. Configure account password

    Web front-end development play win10 Linux subsystem

After completing the above steps, you can open Windows 10 ubuntu by clicking on the ubuntu icon in the win10 tiles menu or by typing bash into Windows +r

Web front-end development play win10 Linux subsystem

Web front-end development play win10 Linux subsystem

Ubuntu switch to Ali source

\cp -f /etc/apt/sources.list /etc/apt/sources.list_bak_`date +"%Y_%m_%d_%H_%M_%S"`;
echo 'deb http://mirrors.aliyun.com/ubuntu/ bionic main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ bionic-security main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ bionic-updates main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ bionic-proposed main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ bionic-backports main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ bionic main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ bionic-security main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ bionic-updates main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ bionic-proposed main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ bionic-backports main restricted universe multiverse' >/etc/apt/sources.list;

apt-get update

apt-get upgrade

Install the ZSH

sudo apt-get install zsh

Oh – my – ZSH installation

sh -c "$(wget https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh -O -)"

Modify the ZSH theme

vim ~/.zshrc

ZSH_THEME="agnoster"

Setting up bash defaults to ZSH

vim ~/.bashrc

if test -t 1; then
    exec zsh
fi

When we open ubuntu again, we default to ZSH command line status, just like the terminal experience on the MAC!

Web front-end development play win10 Linux subsystem

Terminal font completion

sudo apt-get install fonts-powerline

Installation Node. Js

sudo su
apt update
apt install nodejs
node -v
apt install npm
npm i -g n
n lts

Now that the node. js environment is installed, how will it be used for development?

Configuration VSCode

Point the terminal environment of VSCode development tool directly to ubuntu and you can truly experience the development experience of MAC computer on win10.

Open VSCode, shortcut keyctrl+,Open json configuration mode to add the following configuration:

{
    "terminal.integrated.shell.windows": "C:\Windows\sysnative\bash.exe",
    "terminal.external.windowsExec": "C:\Windows\sysnative\bash.exe" 
}

Web front-end development play win10 Linux subsystem

digression

Expect Microsoft to release the terminal tool of Windows terminal at the end of this year.

By the way, the Chromium Edge browser is great (finally getting rid of the over the wall sync favorites) and uninstalling chrome!

Chromium Edge baidu cloud resources links: https://pan.baidu.com/s/187uA…
Extraction code: 4w9j