|
| 1 | +# Code - OSS Development Container |
| 2 | + |
| 3 | +This repository includes configuration for a development container for working with Code - OSS in an isolated local container or using [GitHub Codespaces](https://github.com/features/codespaces). |
| 4 | + |
| 5 | +> **Tip:** The default VNC password is `vscode`. The VNC server runs on port `5901` with a web client at `6080`. For better performance, we recommend using a [VNC Viewer](https://www.realvnc.com/en/connect/download/viewer/). Applications like the macOS Screen Sharing app will not perform as well. |
| 6 | +
|
| 7 | +## Quick start - local |
| 8 | + |
| 9 | +1. Install Docker Desktop or Docker for Linux on your local machine. (See [docs](https://aka.ms/vscode-remote/containers/getting-started) for additional details.) |
| 10 | + |
| 11 | +2. **Important**: Docker needs at least **4 Cores and 6 GB of RAM (8 GB recommended)** to run full build. If you on macOS, or using the old Hyper-V engine for Windows, update these values for Docker Desktop by right-clicking on the Docker status bar item, going to **Preferences/Settings > Resources > Advanced**. |
| 12 | + |
| 13 | + > **Note:** The [Resource Monitor](https://marketplace.visualstudio.com/items?itemName=mutantdino.resourcemonitor) extension is included in the container so you can keep an eye on CPU/Memory in the status bar. |
| 14 | +
|
| 15 | +3. Install [Visual Studio Code Stable](https://code.visualstudio.com/) or [Insiders](https://code.visualstudio.com/insiders/) and the [Remote - Containers](https://aka.ms/vscode-remote/download/containers) extension. |
| 16 | + |
| 17 | +  |
| 18 | + |
| 19 | + > Note that the Remote - Containers extension requires the Visual Studio Code distribution of Code - OSS. See the [FAQ](https://aka.ms/vscode-remote/faq/license) for details. |
| 20 | +
|
| 21 | +4. Press <kbd>Ctrl/Cmd</kbd> + <kbd>Shift</kbd> + <kbd>P</kbd> and select **Remote-Containers: Clone Repository in Container Volume...**. |
| 22 | + |
| 23 | + > **Tip:** While you can use your local source tree instead, operations like `yarn install` can be slow on macOS or using the Hyper-V engine on Windows. We recommend the "clone repository in container" approach instead since it uses "named volume" rather than the local filesystem. |
| 24 | +
|
| 25 | +5. Type `https://github.com/microsoft/vscode` (or a branch or PR URL) in the input box and press <kbd>Enter</kbd>. |
| 26 | + |
| 27 | +6. After the container is running, open a web browser and go to [http://localhost:6080](http://localhost:6080) or use a [VNC Viewer](https://www.realvnc.com/en/connect/download/viewer/) to connect to `localhost:5901` and enter `vscode` as the password. |
| 28 | + |
| 29 | +Anything you start in VS Code or the integrated terminal will appear here. |
| 30 | + |
| 31 | +Next: **[Try it out!](#try-it)** |
| 32 | + |
| 33 | +## Quick start - GitHub Codespaces |
| 34 | + |
| 35 | +> **IMPORTANT:** The current free user beta for GitHub Codespaces uses a "Basic" sized codespace which does not have enough RAM to run a full build of VS Code and will be considerably slower during codespace start and running VS Code. You'll soon be able to use a "Standard" sized codespace (4-core, 8GB) that will be better suited for this purpose (along with even larger sizes should you need it). |
| 36 | +
|
| 37 | +1. From the [microsoft/vscode GitHub repository](https://github.com/microsoft/vscode), click on the **Code** dropdown, select **Open with Codespaces**, and the **New codespace** |
| 38 | + |
| 39 | + > Note that you will not see these options if you are not in the beta yet. |
| 40 | +
|
| 41 | +2. After the codespace is up and running in your browser, press <kbd>Ctrl/Cmd</kbd> + <kbd>Shift</kbd> + <kbd>P</kbd> and select **View: Show Remote Explorer**. |
| 42 | + |
| 43 | +3. You should see port `6080` under **Forwarded Ports**. Select the line and click on the globe icon to open it in a browser tab. |
| 44 | + |
| 45 | + > If you do not see port `6080`, press <kbd>Ctrl/Cmd</kbd> + <kbd>Shift</kbd> + <kbd>P</kbd>, select **Forward a Port** and enter port `6080`. |
| 46 | +
|
| 47 | +4. In the new tab, you should see noVNC. Click **Connect** and enter `vscode` as the password. |
| 48 | + |
| 49 | +Anything you start in VS Code or the integrated terminal will appear here. |
| 50 | + |
| 51 | +Next: **[Try it out!](#try-it)** |
| 52 | + |
| 53 | +### Using VS Code with GitHub Codespaces |
| 54 | + |
| 55 | +You will likely see better performance when accessing the codespace you created from VS Code since you can use a[VNC Viewer](https://www.realvnc.com/en/connect/download/viewer/). Here's how to do it. |
| 56 | + |
| 57 | +1. [Create a codespace](#quick-start---github-codespaces) if you have not already. |
| 58 | + |
| 59 | +2. Set up [VS Code for use with GitHub Codespaces](https://docs.github.com/github/developing-online-with-codespaces/using-codespaces-in-visual-studio-code) |
| 60 | + |
| 61 | +3. After the VS Code is up and running, press <kbd>Ctrl/Cmd</kbd> + <kbd>Shift</kbd> + <kbd>P</kbd>, choose **Codespaces: Connect to Codespace**, and select the codespace you created. |
| 62 | + |
| 63 | +4. After you've connected to the codespace, use a [VNC Viewer](https://www.realvnc.com/en/connect/download/viewer/) to connect to `localhost:5901` and enter `vscode` as the password. |
| 64 | + |
| 65 | +5. Anything you start in VS Code or the integrated terminal will appear here. |
| 66 | + |
| 67 | +Next: **[Try it out!](#try-it)** |
| 68 | + |
| 69 | +## Try it! |
| 70 | + |
| 71 | +This container uses the [Fluxbox](http://fluxbox.org/) window manager to keep things lean. **Right-click on the desktop** to see menu options. It works with GNOME and GTK applications, so other tools can be installed if needed. |
| 72 | + |
| 73 | +Note you can also set the resolution from the command line by typing `set-resolution`. |
| 74 | + |
| 75 | +To start working with Code - OSS, follow these steps: |
| 76 | + |
| 77 | +1. In your local VS Code, open a terminal (<kbd>Ctrl/Cmd</kbd> + <kbd>Shift</kbd> + <kbd>\`</kbd>) and type the following commands: |
| 78 | + |
| 79 | + ```bash |
| 80 | + yarn install |
| 81 | + bash scripts/code.sh |
| 82 | + ``` |
| 83 | + |
| 84 | + Note that a previous run of `yarn install` will already be cached, so this step should simply pick up any recent differences. |
| 85 | + |
| 86 | +2. After the build is complete, open a web browser or a [VNC Viewer](https://www.realvnc.com/en/connect/download/viewer/) to the desktop environnement as described in the quick start and enter `vscode` as the password. |
| 87 | + |
| 88 | +3. You should now see Code - OSS! |
| 89 | + |
| 90 | +Next, let's try debugging. |
| 91 | +
|
| 92 | +1. Shut down Code - OSS by clicking the box in the upper right corner of the Code - OSS window through your browser or VNC viewer. |
| 93 | +
|
| 94 | +2. Go to your local VS Code client, and use Run / Debug view to launch the **VS Code** configuration. (Typically the default, so you can likely just press <kbd>F5</kbd>). |
| 95 | +
|
| 96 | + > **Note:** If launching times out, you can increase the value of `timeout` in the "VS Code", "Attach Main Process", "Attach Extension Host", and "Attach to Shared Process" configurations in [launch.json](../.vscode/launch.json). However, running `scripts/code.sh` first will set up Electron which will usually solve timeout issues. |
| 97 | +
|
| 98 | +3. After a bit, Code - OSS will appear with the debugger attached! |
| 99 | +
|
| 100 | +Enjoy! |
0 commit comments