Sprinklr Supercharged for VSCode
This extension is built for the sprinklr-ui-hub repo.
It contains snippets and actions that save precious seconds every time you code.
🚀 Features Glossary
Video Walkthrough
Detailed Features
🔍 Scan Project (First Step)
- Run via:
Cmd+Shift+P → Scan Project.
- Scans the project and creates indices of all imports/exports.
- These indices power many of the plugin’s features.
⚡ Blazing-Fast Path Resolution
- After running Scan Project, you can
Cmd+Click on an import path.
- Resolution happens instantly using our index — much faster than VSCode’s default TypeScript resolution in large projects.
📋 Copy Import Path & Import Statement of Current File
Three ways to copy imports instantly:
Select Variable + Cmd+E → Copies full import statement.
import { RecordManager } from "@sprinklrjs/modules/recordManager";
Just Cmd+E (no selection) → Copies empty import scaffold.
import {} from "@sprinklrjs/modules/recordManager";
Top-right Copy Path Button → Copies bare import path.
@sprinklrjs/modules/recordManager
📡 Find Import Hierarchy
Explore the chain of imports from a parent file to a child (multi-level, step by step).
- Copy parent file path.
- Open the child file.
- Run:
Cmd+Shift+P → Find Import Hierarchy.
- Paste parent path.
Output (left pane):
Child.ts
→ File A
→ File B
→ Parent.ts
📑 Show Recursive References
Lists all files where the current file is imported, displayed in a collapsible tree.
Cmd+Shift+P → Show Recursive References- References will be shown in the sidebar
- Expanding a node reveals the parent, and so on.
- Lets you explore references at one level or recursively through the entire import graph.
🗂 Scan Namespaces
- Run via:
Cmd+Shift+P → Scan Project.
- Scans namespaces from the entry file through all static and dynamic imports.
📂 Convert to Folder
- Run via:
Cmd+Shift+P → Convert to Folder.
- Automatically restructure components or hooks into folders with an
index.ts:
Component.tsx → ./component/Component.tsx
./component/index.ts
// index.ts
export { Component } from "./Component";
🎨 Run Prettier
Shorthand for:
yarn prettier-fix
TODOs
- Add support for automatic addition of workspace folders for file referencing via package.json
- Auto run Scan Project action at interval to ensure file reference index is up to date
Additional Details
Requirements
Known Issues
Release Notes
0.0.1
- Initial release of extension - Added snippets
0.0.2
- Added more snippet and Copy Import Path Button
0.0.3
- Added Support for more packages/apps for Copy Import Path
0.0.6
- Added Support for Insert Record manager and find chunks action with snippets updated
- Added runPrettier and runTsc features
0.0.7
- Added Cmd+e action to copy named export string
- fixed copy import path not working for social-suite-app
0.0.8
- Added Record Manager v3 generator
- deperecated findChunks
0.0.9
0.0.10
- Fixed bugs in Record Manager v3
0.0.11
- Fixed bugs in Record Manager v3, updated snippets
0.0.12
- Fixed bugs in Record Manager v3
0.0.13
- Fixed bugs in Record Manager v3
- Updated snippet pack
0.0.14
0.0.15
- Fixed Import path for self-serve-app, space-app
0.0.16
- Fixed runTsc for self-serve-app
0.0.17
- Refactored Copy Import path and runTsc
0.0.18
- Deprecated
Hello and insertRecordManager command
- updated snippets
- other minor changes
0.0.19
1.0.0
- Added File Reference, Trace Import Sequence, Namespace scanner
- Added Import click resolver
1.0.1
- Bugfixes
- Removal of snippets and legacy code
1.0.2
- Update extension name and readme
1.0.3
- Added more file to scan project
1.0.4
- Updated action names, added microfrontend folders in path resolution
Contribute
- Clone
master branch
- Add your features/bugfixes in a separate branch
- Build extension and test
yarn watch to start webpack build, yarn watch-workers if you are updating worker thread code. Use VSCode debug to test changes- PR will be reviewed and merged
Enjoy!
| |
