|
| 1 | +# kOS Syntax for VS Code |
| 2 | +This plugin enables syntax highlighting for kOS scripts `.ks` in Visual Studio Code. |
| 3 | + |
| 4 | +It leverages whatever VS Code theme you have enabled, so it should work with any theme you choose. |
| 5 | + |
| 6 | +For a version of Visual Studio Code without Microsoft's telemetry, you can check out [VSCodium](https://vscodium.com/). |
| 7 | + |
| 8 | + |
| 9 | +***** |
| 10 | + |
| 11 | +### Installation |
| 12 | + |
| 13 | +#### Using the Visual Studio Code Marketplace: |
| 14 | + |
| 15 | +1. Open Visual Studio Code. |
| 16 | +2. Go to the **Extensions** view by clicking on the Extensions icon in the Activity Bar on the side of the window or by pressing `Ctrl+Shift+X` (or `Cmd + Shift + X` on macOS). |
| 17 | +3. Search for `kOS Syntax Highlighting | Kerbal Space Program`. |
| 18 | +4. Click **Install**. |
| 19 | + |
| 20 | +You can also find the extension on the [Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=Bradyns.kos-syntax) |
| 21 | + |
| 22 | +#### Manual Installation: |
| 23 | + |
| 24 | +1. Download the latest release from the [releases page]() |
| 25 | +2. Open Visual Studio Code. |
| 26 | +3. Go to the **Extensions** view by clicking on the Extensions icon in the Activity Bar on the side of the window or by pressing `Ctrl+Shift+X`(or `Cmd + Shift + X` on macOS). |
| 27 | +4. Click on the `...` menu in the top right corner of the Extensions view and select **Install from VSIX...**. |
| 28 | +5. Select the `.vsix` file you downloaded. |
| 29 | +6. Click **Install**. |
| 30 | + |
| 31 | +***** |
| 32 | + |
| 33 | +### Previews: |
| 34 | + |
| 35 | +Will be added soon. |
| 36 | + |
| 37 | +***** |
| 38 | + |
| 39 | +### Custom Colours |
| 40 | + |
| 41 | +If you want to customise the colours for a specific kOS syntax scope, here's how you can do it: |
| 42 | + |
| 43 | +1. **Open VS Code**. |
| 44 | +2. **Find the Scope Name**: |
| 45 | + * Open the [`kos.tmLanguage.json`](./syntaxes/kos.tmLanguage.json) file. |
| 46 | + * Press `Ctrl + F` and search for the keyword you want to colour. |
| 47 | + * Copy the scope name (e.g., `support.function.kos`) directly above the keyword. |
| 48 | +3. **Open the VS Code Settings JSON file**: |
| 49 | + * In VS Code, Press `Ctrl + Shift + P` (or `Cmd + Shift + P` on macOS) and type `Preferences: Open Settings (JSON)`. |
| 50 | +4. **Add the following configuration** to your `settings.json` file: |
| 51 | + |
| 52 | + ```json |
| 53 | + { |
| 54 | + "editor.tokenColorCustomizations": { |
| 55 | + "textMateRules": [ |
| 56 | + { |
| 57 | + "scope": "support.function.kos", // Replace with the scope you want to customise |
| 58 | + "settings": { |
| 59 | + "foreground": "#FF0000" // Replace with your desired colour |
| 60 | + } |
| 61 | + }, //<-- Remove this comma if it's the last item in the list |
| 62 | + ] |
| 63 | + } |
| 64 | + } |
| 65 | + ``` |
| 66 | + |
| 67 | + * 4.1 **Add More Than One** |
| 68 | + |
| 69 | + * You can add multiple customisations by adding more objects to the `textMateRules` array: |
| 70 | + |
| 71 | + ```json |
| 72 | + { |
| 73 | + "scope": "variable.parameter.kos", // Replace with the scope you want to customise |
| 74 | + "settings": { |
| 75 | + "foreground": "#FF0000" // Replace with your desired colour |
| 76 | + } |
| 77 | + }, //<-- Remove this comma if it's the last item in the list |
| 78 | + ``` |
| 79 | + |
| 80 | +5. **Replace the `scope` and `foreground` values**: |
| 81 | + * Use the scope name you copied from the [`kos.tmLanguage.json`](./syntaxes/kos.tmLanguage.json) file. |
| 82 | + * Replace the `foreground` value with your desired colour. |
| 83 | + * **Note:** W3Schools has a [Colour Picker](https://www.w3schools.com/colors/colors_picker.asp) you can use. |
| 84 | + |
| 85 | +6. **Save the `settings.json` file**. |
| 86 | + |
| 87 | +***** |
| 88 | + |
| 89 | +### How to Build |
| 90 | + |
| 91 | +You will need to have Node.js installed to build this extension. |
| 92 | + |
| 93 | +0. **Install Node.js**: |
| 94 | + |
| 95 | + If you have to install Node.js, you can download it from the [official website](https://nodejs.org/). |
| 96 | + |
| 97 | + - **NB:** *After installation, If you can't see the* `node` and `npm` *commands in your terminal, try restarting your computer to ensure they've been added to your PATH.* |
| 98 | + |
| 99 | +#### Building the Extension |
| 100 | + |
| 101 | +You can build the VSIX file for this extension using the `vsce` package. Here's how to do it: |
| 102 | + |
| 103 | +1. **Install `vsce` Package**: |
| 104 | + |
| 105 | + ```bash |
| 106 | + npm install -g vsce |
| 107 | + ``` |
| 108 | + |
| 109 | +2. **Navigate to the VS Code Folder**: |
| 110 | + *It should be the folder that contains the `Package.json` folder.* |
| 111 | + |
| 112 | + * **Windows:** |
| 113 | + |
| 114 | + ```bash |
| 115 | + cd path\to\VSCode |
| 116 | + ``` |
| 117 | + |
| 118 | + * **macOS/Linux:** |
| 119 | + |
| 120 | + ```bash |
| 121 | + cd path/to/VSCode |
| 122 | + ``` |
| 123 | + |
| 124 | +3. **Build the VSIX File**: |
| 125 | + |
| 126 | + ```bash |
| 127 | + vsce package |
| 128 | + ``` |
| 129 | + |
| 130 | +This should output a VSIX file in the root of the project folder, from which you can install the extension manually. |
0 commit comments