Soumya Jindal, Meghna Singh, Shreyal Gupta, Shristi Singh
VSCODE
WHY USE
Stands for Visual Studio Code. Visual Studio Code is a lightweight yet powerful free-ware source-code editor made by Microsoft.
Offering a vast collection of community-supported extensions, you can use VSCode to boost your workflow and productivity. The app is available across Windows, macOS, and Linux, making it the perfect program to write code on, regardless of the operating system. One of the major key aspects of VS Code is its customizability and robust theming capabilities.
When it comes to their code editor, everyone has their own unique and perhaps peculiar preferences. There are literally thousands of themes available, and with good reason: what one person finds attractive and productive can be a barrier to another.
Creating our own theme has long been a goal of many people. Once you realize that coding like this isn’t necessarily healthy, but it’s actually the time when you are the most productive.
You have to install yo generator-code.
|
npm install -g yo generator-code
This makes the generator available on your machine from anywhere in the world. Then, to start your theme, use the following command:
| yo code
| New Color theme option must be selected
When selecting this, it asks if this is a new theme or if we want to import from an existing one. We want to create a new one.
|
Type - No, start fresh
Next, you’ll have to answer a few other questions, including:
| What’s the extension’s name?
| What is the the identifier? (Just go with the name, that’s probably typical.)
| What is the the description? (Just put something silly in initially. Don’t worry, you can update this in your package.json in the future.)
| What’s the publisher’s name? (See earlier instructions.)
| What name should be shown to the user? (We had used the same as the extension name.)
|
Is this theme dark, light, or high contrast?
To publish your theme we will need to do some boring work but is less cumbersome to be able to share your theme.
Click on “Show all scopes”, right at the bottom and look for Marketplace and check:.
|
Manage
| Click to generate the access token
| Copy the token and save somewhere you think is save. Inside the marketplace
There should be a “Create publisher” page.
| Fill up all the fields.
| Go back to your package.json
The package.json files is not completed when yo code generates it for you, the marketplace requires other scopes like, icons, keywords, publish id and so on.
Write this command on your terminal
|
npm install -g vsce
After is installed you will have to log in:
|
vsce login your-publish-id
It will for the login code, now is when you need to paste the token that we generated before.
To package your theme run
|
vsce package
It will create a vsix file.
Note: This file you also use to publish on openVSX
Publish your theme by running:
|
vsce publish
