Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@unocss/inspector

Package Overview
Dependencies
Maintainers
2
Versions
347
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@unocss/inspector

The inspector UI for UnoCSS

  • 0.65.1
  • latest
  • Source
  • npm
  • Socket score

Version published
Maintainers
2
Created

What is @unocss/inspector?

@unocss/inspector is a tool designed to help developers inspect and debug their UnoCSS styles directly within their development environment. It provides a visual interface to see which styles are applied to elements, making it easier to understand and troubleshoot CSS issues.

What are @unocss/inspector's main functionalities?

Style Inspection

This feature allows developers to inspect the styles applied to elements in their application. By attaching the inspector, you can hover over elements to see the UnoCSS classes and styles applied to them.

import { createInspector } from '@unocss/inspector';

const inspector = createInspector();
inspector.attach();

Live Editing

Live editing allows developers to make changes to their UnoCSS styles directly from the inspector interface. This can speed up the development process by providing immediate feedback on style changes.

import { createInspector } from '@unocss/inspector';

const inspector = createInspector();
inspector.attach();

// Enable live editing
inspector.enableLiveEditing();

Style Source Mapping

Source mapping helps developers trace back the styles to their original source files. This is particularly useful for debugging and understanding where specific styles are coming from.

import { createInspector } from '@unocss/inspector';

const inspector = createInspector();
inspector.attach();

// Enable source mapping
inspector.enableSourceMapping();

Other packages similar to @unocss/inspector

Keywords

FAQs

Package last updated on 04 Dec 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc