1. Install WSL and a Linux distribution by running wsl --install in PowerShell as Administrator, then restart and set up the Linux distribution. 2. Install the "Remote - WSL" extension in VSCode to enable integration with WSL. 3. Open a project in WSL by launching the WSL terminal, navigating to the project folder, and running code ., which connects VSCode directly to the WSL environment. 4. When using code . in WSL, VSCode automatically installs a server in Linux, edits files in the Linux file system, uses the Linux terminal and tools, and avoids permission issues by preventing editing via Windows apps. 5. Access WSL files from Windows via \wsl$\Ubuntu\home..., but only edit them through VSCode or Linux tools, or work on Windows files from WSL using /mnt/c/, though with potential performance and permission limitations, while best practice is to keep projects inside the WSL file system like ~/projects. 6. Set WSL as the default terminal in VSCode by opening the Command Palette, running "Terminal: Select Default Profile", and choosing WSL Bash. 7. Debugging and development tools work seamlessly in the Linux environment, with support for Node.js, Python, Go, Git, linters, and formatters, provided the necessary tools are installed in WSL, such as Node.js via the provided installation commands. Additionally, keep WSL updated with wsl --update, use wsl --shutdown to reset if needed, configure .wslconfig for resource limits, and enable VSCode Settings Sync for consistent preferences, resulting in a smooth development experience combining Windows usability with full Linux functionality for development.

Using VSCode with WSL (Windows Subsystem for Linux) is a powerful setup for developers who want to work in a Linux environment while staying on Windows. It gives you access to Linux tools, packages, and the bash shell, while still using VSCode’s familiar interface. Here’s how to set it up and use it effectively.

1. Install WSL and a Linux Distribution

First, make sure WSL is installed and running:

• Open PowerShell as Administrator and run:

  

  wsl --install

  This command installs WSL and the default Linux distribution (usually Ubuntu).

• If you want a specific distribution, run:

  

  wsl --list --online
  wsl --install -d <DistributionName>

  For example:

  wsl --install -d Ubuntu

• After installation, restart your computer.

• Launch the installed Linux distribution from the Start menu to complete setup (create a username and password).

2. Install the VSCode Remote - WSL Extension

VSCode uses an extension to connect to WSL:

• Open VSCode.
• Go to the Extensions view (Ctrl Shift X).
• Search for "Remote - WSL" (by Microsoft).
• Install it.

This extension allows VSCode to open folders inside WSL and run commands in the Linux environment.

3. Open a Project in WSL

Once the extension is installed:

• Open WSL terminal:

  wsl

• Navigate to your project directory:

  cd ~/projects/myapp

• Type in the terminal:

  code .

  This launches VSCode and connects it directly to the WSL environment.

? You’ll notice a green label in the bottom-left corner of VSCode showing something like WSL: Ubuntu. That means you're working inside WSL.

4. What Happens When You Use code . in WSL

When you run code . inside WSL:

• VSCode detects WSL and automatically installs a small VSCode Server inside your Linux distribution (happens once).
• Your files are edited directly in the Linux file system (e.g., \\wsl$\Ubuntu\home\...), not in Windows folders.
• The integrated terminal in VSCode defaults to bash (or your WSL shell).
• Tools like npm, python, gcc, etc., use the Linux versions and dependencies.

?? Avoid editing files in the Linux filesystem using Windows apps (like File Explorer or Notepad), as this can cause permission or locking issues.

5. Access WSL Files from Windows (Optional)

You can access your WSL files from Windows via:

\\wsl$\Ubuntu\home\yourname\

But again, it's safer to edit WSL files only from within VSCode (using the Remote-WSL connection) or Linux tools.

Alternatively, if you want to work on Windows files from WSL:

• You can access Windows files at /mnt/c/, /mnt/d/, etc.
• But performance may be slower, and file permissions are limited.

? Best practice: Keep projects inside the WSL file system (e.g., ~/projects) for full Linux compatibility.

6. Use WSL as Default Terminal in VSCode

To make the WSL shell your default terminal in VSCode:

• Open VSCode Command Palette (Ctrl Shift P)
• Run: Terminal: Select Default Profile
• Choose WSL Bash (or your WSL shell)
• Now, when you open a new terminal (`Ctrl ``), it starts in WSL.

7. Debugging and Tools Work Seamlessly

With VSCode connected to WSL:

• You can run and debug Node.js, Python, or Go apps using Linux paths and dependencies.
• Git uses your Linux config and SSH keys.
• Linters, formatters, and language servers run in the Linux environment.

Just make sure tools are installed in WSL:

# Example: Install Node.js in WSL
curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash -
sudo apt-get install -y nodejs

Then VSCode will automatically detect them.

Tips for Better Experience

• Keep WSL updated: Run wsl --update occasionally.
• Shutdown WSL when needed: Use wsl --shutdown in PowerShell to reset if things hang.
• Use .wslconfig to limit memory or CPU usage if WSL slows down your system.
• Sync settings: Use VSCode Settings Sync so your extensions and preferences carry over across environments.

Basically, once set up, you get the best of both worlds: Windows for daily use and WSL VSCode for development. The integration is smooth, and most things just work out of the box.

The above is the detailed content of How to use VSCode with WSL (Windows Subsystem for Linux). For more information, please follow other related articles on the PHP Chinese website!