Item logo image for Click To Component

Click To Component

zjffun.com
Item media 3 (screenshot) for Click To Component
Item media 1 (screenshot) for Click To Component
Item media 2 (screenshot) for Click To Component
Item media 3 (screenshot) for Click To Component
Item media 1 (screenshot) for Click To Component
Item media 1 (screenshot) for Click To Component
Item media 2 (screenshot) for Click To Component
Item media 3 (screenshot) for Click To Component

Overview

Click a component in your browser to instantly open the source in VS Code, WebStorm, Cursor, TRAE, etc.

Online demo & document: https://ctc.zjffun.com/ 1. Option+Click(Alt+Click) a component in your browser to instantly open the source in VS Code. 2. Option+RightClick(Alt+RightClick) opens a context menu with the parent components. 3. Support custom configuration to open WebStorm, Cursor, GitHub, etc. 4. Support `data-__source-code-location` - Vue using [vue-click-to-component](https://www.npmjs.com/package/vue-click-to-component) generate. - React using [babel-plugin-transform-react-jsx-data-source-code-location](https://www.npmjs.com/package/babel-plugin-transform-react-jsx-data-source-code-location) generate. 5. Support React `__source` (generated by [@babel/plugin-transform-react-jsx-source](https://babeljs.io/docs/babel-plugin-transform-react-jsx-source)). You can config `Site access` to `On Click` or `On specific sites` for this extension to control click-to-component script inject.

Details

  • Version
    0.0.0.7
  • Updated
    December 27, 2025
  • Size
    828KiB
  • Languages
    2 languages
  • Developer
    Website
    Email
    zjffun@gmail.com
  • Non-trader
    This developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.

Privacy

The developer has disclosed that it will not collect or use your data.

This developer declares that your data is

  • Not being sold to third parties, outside of the approved use cases
  • Not being used or transferred for purposes that are unrelated to the item's core functionality
  • Not being used or transferred to determine creditworthiness or for lending purposes

Support

Related

Apifox Browser Extension

3.7

API 文档、API 调试、API Mock、API 自动化测试

React Click To Component

3.7

React Click To Component, a Chrome extension to open a React component in the editor by clicking on it.

React Scan Toggle

5.0

Toggle React Scan functionality to analyze React component renders

LocatorJS

4.3

LocatorJS Chrome Extension - option-click to code (ReactJS)

Click to component

0.0

The Inspector launch with Ctrl+Shift+X (Command+Shift+X on Mac). You can detect and open the React component source code easily.

Vercel

4.7

Use the Vercel Toolbar on production deployments

React Inspector

3.5

The Inspector launch with Ctrl+Shift+X (Command+Shift+X on Mac). You can detect and open the React component source code easily.

React Spy

4.7

Find code from UI, or, find UI from code!

FeHelper(前端助手)

4.7

FE助手:JSON自动格式化、手动格式化,支持排序、解码、下载等,更多功能可在配置页按需安装!

click-to-react-component

3.4

Option+Click React components in your browser to instantly open the source in VS Code

HTML to JSX

0.0

HTML to JSX Converter Description Easily convert HTML to JSX(ReactJS) with our powerful and intuitive Chrome extension! Whether…

React-DomPicker

5.0

Click any UI element to instantly jump to its React source code in VS Code. Perfect for React + Tailwind + ShadCN projects.

Apifox Browser Extension

3.7

API 文档、API 调试、API Mock、API 自动化测试

React Click To Component

3.7

React Click To Component, a Chrome extension to open a React component in the editor by clicking on it.

React Scan Toggle

5.0

Toggle React Scan functionality to analyze React component renders

LocatorJS

4.3

LocatorJS Chrome Extension - option-click to code (ReactJS)

Click to component

0.0

The Inspector launch with Ctrl+Shift+X (Command+Shift+X on Mac). You can detect and open the React component source code easily.

Vercel

4.7

Use the Vercel Toolbar on production deployments

React Inspector

3.5

The Inspector launch with Ctrl+Shift+X (Command+Shift+X on Mac). You can detect and open the React component source code easily.

React Spy

4.7

Find code from UI, or, find UI from code!

Google apps