ember-template-inspector

An ember add-on which opens the template file in the code editor while inspecting an element. To open the file, Press ALT(Option) + SHIFT and Click on the element.

Demo Video

How this works ?

File locations are added to the html elements during development build and on clicking the element, an api is initiated to the express server which opens the file. This package adds the dev server url to the index.html.

• Ember.js v3.16 or above
• Ember CLI v2.13 or above
• Node.js v10 or above

Supported editors

Value	Editor	Linux	Windows	OSX
appcode	AppCode			✓
atom	Atom	✓	✓	✓
atom-beta	Atom Beta			✓
brackets	Brackets	✓	✓	✓
clion	Clion		✓	✓
code	Visual Studio Code	✓	✓	✓
code-insiders	Visual Studio Code Insiders	✓	✓	✓
emacs	Emacs	✓
idea	IDEA	✓	✓	✓
notepad++	Notepad++		✓
pycharm	PyCharm	✓	✓	✓
phpstorm	PhpStorm	✓	✓	✓
rubymine	RubyMine	✓	✓	✓
sublime	Sublime Text	✓	✓	✓
vim	Vim	✓
visualstudio	Visual Studio			✓
webstorm	WebStorm	✓	✓	✓

Usage

Create a file 'template-inspectorrc.json' in root project folder with the following config to use ember-template-inspector

template-inspectorrc.json (Please add this to your .gitignore file as this is a developer preference)

{
  editor: any preferred editor mentioned above, this addon will automatically open a running editor if this is not specified,
  enabled: true | false (true by default)
}

Installation

ember install ember-template-inspector

Development

• git clone <repository-url> this repository
• cd ember-template-inspector
• yarn

Works with

• Ember.js v3.12 or above
• Ember CLI v2.13 or above
• Node.js v10 or above

Contributing

See the Contributing guide for details.

License

This project is licensed under the MIT License.