Skip to content

Comprehensive extension to manage Adblock Syntax in VSCode: syntax highlighter, linter and much more. Available on the VSCode Marketplace.

License

Notifications You must be signed in to change notification settings

AdguardTeam/VscodeAdblockSyntax

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

AGLint

Adblock Syntax for VSCode

Complete adblock filter list support for VSCode

Note: This is a development tool for creating and editing adblock filter lists, not an ad blocker for VSCode.

VSCode Marketplace Open VSX License

AdGuard AdGuard・ uBlock Origin uBlock Origin・ AdBlock AdBlock・ Adblock Plus Adblock Plus

InstallDocumentationReport IssueContributing


✨ Features

  • 🎨 Syntax highlighting — Full support for AdGuard, uBlock Origin, and Adblock Plus filter syntax
  • 🔍 Real-time linting — Powered by AGLint with instant validation and error detection
  • 🛠️ Auto-fixing — Automatically fix issues with AGLint's suggestions and quick fixes
  • 🌐 Multi-platform validation — Platform-specific compatibility warnings and syntax checks
  • 🐙 GitHub integration — Syntax highlighting on GitHub via Linguist
  • ⚙️ Flexible configuration — VSCode settings and AGLint config file (.aglintrc) support
  • 🚀 Auto-discovery — Automatically finds AGLint in your workspace (local or global)

📷 Screenshot

Adblock Syntax in action

📦 Installation

Quick Install

  1. Open VSCode
  2. Press Ctrl+P / Cmd+P
  3. Type: ext install adguard.adblock
  4. Press Enter

Manual Install

VSCode Marketplace:

  1. Open VSCode Marketplace
  2. Click Install
  3. VSCode will open automatically

Open VSX (for VSCodium, etc.):

  1. Open Open VSX Registry
  2. Click Download
  3. Install the .vsix file manually

Verify Installation

  1. Open any .txt file with adblock rules
  2. Add a filter rule: example.org##.banner
  3. You should see syntax highlighting

Note: AGLint linting requires AGLint to be installed in your workspace or globally. See AGLint Configuration for setup details.


⚙️ Configuration

Setting Description Default
adblock.enableAglint Enable AGLint linting true
adblock.enableInMemoryAglintCache Cache linting results for performance false

💡 Tip: Control AGLint logging via VSCode's built-in log level: Command Palette → Developer: Set Log LevelAGLint


📝 AGLint Configuration

AGLint requires a configuration file to enable linting. The extension will automatically detect AGLint in your workspace.

Quick Setup

Run in your project root:

npx aglint --init

This creates an interactive wizard to generate a configuration file.

Configuration File

Supported file names (YAML recommended):

  • .aglintrc.yaml / .aglintrc.yml (recommended)
  • .aglintrc.json / .aglintrc
  • aglint.config.json / aglint.config.yaml

Example Configuration

# .aglintrc.yaml root: true extends: - aglint:recommended

Available Presets

  • aglint:recommended — Recommended rules for most projects
  • aglint:all — All available rules (strict)

For detailed configuration options, rule customization, and cascading configs, see the AGLint documentation.


🐙 GitHub Support

GitHub uses this extension's grammar file via Linguist for syntax highlighting.

Your filter lists will be automatically highlighted on GitHub if they start with an agent comment like [Adblock Plus 2.0] or [AdGuard].


🤝 Contributing

Contributions are welcome! Please read our Contributing Guide for details on how to get started.

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.


🔗 Resources

📚 Filter Syntax Documentation

🎯 Scriptlets & Snippets

🎨 Extended CSS

🛠️ Tools


Made with ❤️ by AdGuard

Report IssueRequest FeatureAsk Question

About

Comprehensive extension to manage Adblock Syntax in VSCode: syntax highlighter, linter and much more. Available on the VSCode Marketplace.

Topics

Resources

License

Contributing

Stars

Watchers

Forks

Contributors 9