https://github.com/kubosho/vscode-ecsstractor

Extracting selectors from HTML / JSX / TSX and generate CSS file.
https://github.com/kubosho/vscode-ecsstractor

css html jsx tsx vscode vscode-extension

Last synced: 10 months ago
JSON representation

Extracting selectors from HTML / JSX / TSX and generate CSS file.

• Host: GitHub
• URL: https://github.com/kubosho/vscode-ecsstractor
• Owner: kubosho
• License: mit
• Created: 2017-09-23T10:36:32.000Z (almost 9 years ago)
• Default Branch: master
• Last Pushed: 2023-03-06T02:21:33.000Z (over 3 years ago)
• Last Synced: 2024-05-01T21:24:38.554Z (about 2 years ago)
• Topics: css, html, jsx, tsx, vscode, vscode-extension
• Language: TypeScript
• Homepage: https://marketplace.visualstudio.com/items?itemName=kubosho.ecsstractor
• Size: 2.63 MB
• Stars: 44
• Watchers: 3
• Forks: 3
• Open Issues: 14
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# eCSStractor for VS Code

[![CircleCI](https://circleci.com/gh/kubosho/vscode-ecsstractor.svg?style=svg)](https://circleci.com/gh/kubosho/vscode-ecsstractor)

![eCSStractor demo](src/assets/demo.gif?raw=true)

Extracting selectors from HTML / JSX / TSX and generate CSS file.

[hudochenkov/ecsstractor](https://github.com/hudochenkov/ecsstractor) of VS Code version.

## Usage

Open any HTML file and do the following:

1. Open the command palette

    - Press `Cmd + Shift + P` on macOS or `Ctrl + Shift + P` on Windows / Linux

    - Go to `View` → `Command Palette`

1. Typing the `Run: eCSStractor` and select

Then will see new tab with CSS selectors extracted from HTML file.

## Example

Source:

```html



  
Test 1

  
Test 2

  
Test 3

  
Test 4

  
Test 5



```


Run eCSStractor:

```css

#test-list {

}

.list {

}

.list-item {

}

```

## Installation

In VS Code window:

1. Open the extensions

    - Press `Cmd + Shift + P` on macOS or `Ctrl + Shift + P` on Windows / Linux

    - Go to `View` → `Extensions`

1. Typing the `ecsstractor` in input form and select `Install` on `eCSStractor`