YetiCode - Dotnet Blazor VSCode PlugIn

Dotnet Blazor VSCode PlugIn from Yeti Forge Technologies

Features

1. Show unused CSS
2. Show duplicate CSS classes
3. Show unused using and inject statements
4. Show unused methods

• Automatic Scanning: Searches for files .html, .jsx, .tsx, js, ts, php that could use the currently opened CSS file.
• Problem Marking: Identifies unused CSS classes and marks them as problems in VS Code.
• Supports Various File Types: Works with .css, .scss, .less, and .sass files.

How It Works

1. Scanning for Relevant Files: The extension looks for files that are in the same folder as currently opened CSS file.
2. Fallback to Parent Directories: If no files are found, it searches parent directories up the tree.
3. Analyzing Usage: Parses these files to determine which CSS classes are unused.
4. Marking Unused CSS: Highlights unused CSS in the editor and lists them in the Problems panel.

Installation

1. Open Visual Studio Code.
2. Go to the Extensions view by clicking on the Extensions icon in the Activity Bar.
3. Search for Yeti-Code.
4. Click Install to add the extension.
5. Reload VS Code to activate the extension.

Usage

• Open your CSS file in VS Code.
• The extension automatically scans for unused CSS selectors in the currently opened file.
• Unused selectors are highlighted in your CSS file.
• Review and remove unused CSS to optimize your project.

Development

npm install
npm run compile

# To open Tundra project, assuming relative path
code --extensionDevelopmentPath=. ../Tundra

Package

To generate a .vsix file (the "VSIX" format used by the Visual Studio Marketplace), you’ll use the vsce (Visual Studio Code Extensions) CLI.

Since the package.json uses esbuild, the building process must be handled correctly to ensure your production code is bundled and minimized.

1. Clean and Build the Project First, ensure you have a fresh production build. Your package.json already has a package script defined that runs esbuild --production.

# Clean out any old build artifacts (optional but recommended)
rm -rf dist

# Run the production build script defined in your package.json
npm run package

2. Verify the Contents

Before you create the final file, you should verify exactly which files will be included. This prevents you from accidentally uploading node_modules, secret keys, or large source files.

# List all files that will be included in the .vsix
vsce ls

What to check: You should see dist/extension.js, images/icon.png, README.md, LICENSE.txt, and package.json. You should not see a long list of files from node_modules or src.

3. Package into .VSIX

Now, run the command to package the extension into a single file ready for the Marketplace:

# Create the .vsix file
vsce package

Contributing

Contributions are welcome! Please submit issues and pull requests on the GitHub repository.

License

See LICENSE.txt for license information.