VS Code Extension - Starter Kit

This is a starter kit for creating a new extension for Visual Studio Code. It includes a basic structure and configuration to start developing a new extension.

Table of Contents

• VS Code Extension - Starter Kit
  • Table of Contents
  • Features
  • Prerequisites
  • Getting Started
  • Customization
  • Running the documentation
  • Building the extension
  • Publishing the extension
  • Follow Me
  • VSXpert Template
  • Contributing
  • Code of Conduct
  • Changelog
  • Authors
  • License

Features

• Basic configuration for the development environment
  • .editorconfig - Editor configuration
  • .eslintignore - ESLint ignore file
  • .eslintrc.json - ESLint configuration file
  • .linstagedrc - Lint-staged configuration file
  • .nvmrc - Node version manager configuration file
  • .prettierrc - Prettier configuration file
  • commitlint.config.js - Commit lint configuration file
  • package.json - Package configuration to manage dependencies
  • tsconfig.json - TypeScript configuration to compile the source code
• Basic structure for a new extension
  • app - Source code to develop the extension
    • configs - Configuration files and constants
    • controllers - Controllers to listen to commands
    • helpers - Helper functions with common tasks
    • models - Models to represent data
    • providers - Providers to provide data
    • services - Services to provide functionality
  • test - Test files to test the extension
• JSON Schema validations for workspace settings
  • settings.schema.json - JSON schema for the workspace settings
• Helper functions to get started with the extension
  • command.helper.ts - Helper functions to create a new command
  • data.helper.ts - Helper functions to create a new data provider
  • dialog.helper.ts - Helper functions to create a new dialog
  • filesystem.helper.ts - Helper functions to create a new file system provider
  • inflection.helper.ts - Helper functions to create a new inflection provider
  • number.helper.ts - Helper functions to create a new number provider
  • security.helper.ts - Helper functions to create a new security provider
  • text.helper.ts - Helper functions to create a new text provider
• Basic commands to get started with the extension
  • extension.ts - Main file to run the extension
  • example.controller.ts - Example controller with basic commands
• Basic views to get started with the extension
  • providers - Providers for the extension views
    • feedback.provider.ts - Provides feedback to the user
    • listFiles.provider.ts - Provides a list of files from the workspace
    • color.provider.ts - Provides a color picker to the user
• Basic OpenAI integration to get started with the extension
  • openai - OpenAI integration and chat provider
    • openai.service.ts - OpenAI service to interact with the API
    • chat.provider.ts - Provides chat functionality to the user

Prerequisites

You need to have node and npm installed on your system to run the examples. It is recommended to use the node version used for VS Code development itself which is documented here

Getting Started

To get started with the extension, follow these steps:

1. Clone the repository

   git clone
   cd extension-starter-kit
   npm install
   code .

2. Press F5 to open a new instance of Visual Studio Code with the extension running in debug mode

3. Open the command palette and run the My Extension: Hello World command

4. The extension will display a message in the output window

For more information, see the official documentation

Customization

To customize the extension, follow these steps:

1. Update multiple instances of the following items in bulk:

   • extensionIdentifier - Replace with your extension identifier, e.g. fileManager
   • extension-starter-kit - Replace with your extension name, e.g. vscode-file-manager
   • My Extension - Replace with your extension display name, e.g. VS Code File Manager
   • githubUsername - Replace with your GitHub githubUsername, e.g. ManuelGil
   • extensionPublisher - Replace with your extension publisher, e.g. imgildev

2. Change the LICENSE file with your extension information

3. Remove the unnecessary files and folders

4. Add the necessary files and folders

5. Update the src/app/configs/constants.config.ts and src/app/configs/extension.config.ts file with your extension information

6. Update the src/app/controllers/feedback.controller.ts file with your extension information

7. Update the src/extension.ts file with your extension information

8. Update the settings.schema.json file with your extension information

9. Update the package.json file with your extension information

10. Update the README.md file with your extension information

For more information, see the official documentation

Running the documentation

To run the documentation, execute the following command in the terminal:

npm run compodoc

This will generate the documentation in the compodoc folder.

For more information, see the official documentation

Building the extension

To build the extension, execute the following command in the terminal:

vsce package

This will create a .vsix file in the root of the project.

For more information, see the official documentation

Publishing the extension

To publish the extension, execute the following command in the terminal:

vsce publish

This will open a new instance of Visual Studio Code with the extension running in debug mode.

For more information, see the official documentation

Follow Me

If you enjoy using Auto Barrel, consider following me for updates on this and future projects:

VSXpert Template

This extension was created using VSXpert, a template that helps you create Visual Studio Code extensions with ease. VSXpert provides a simple and easy-to-use structure to get you started quickly.

Contributing

Auto Barrel is open-source software, and we welcome contributions from the community. If you'd like to contribute, please fork the GitHub repository and submit a pull request with your changes.

Before contributing, please read our Contribution Guidelines for instructions on coding standards, testing, and more.

Code of Conduct

We are committed to providing a friendly, safe, and welcoming environment for all, regardless of gender, sexual orientation, disability, ethnicity, religion, or similar personal characteristic. Please review our Code of Conduct before participating in our community.

Changelog

For a complete list of changes, see the CHANGELOG.md

Authors

• Manuel Gil - Owner - ManuelGil

See also the list of contributors who participated in this project.

License

This extension is licensed under the MIT License. See the MIT License for details.