siva-sundar
16

Ember Template Inspector

screenshot of Ember Template Inspector
ember
scss

An ember add-on which opens the template file in the code editor while inspecting an element.

Github

Overview:

"ember-template-inspector" is an ember add-on that allows developers to open the template file in their code editor while inspecting an element. By pressing ALT(Option) + SHIFT and clicking on the element, the corresponding file will be opened. This add-on adds file locations to the HTML elements during development build and utilizes an API to the express server to open the file. It requires Ember.js v3.16 or above, Ember CLI v2.13 or above, and Node.js v10 or above to work.

Features:

  • Code Editor Integration: Open template files directly in the code editor while inspecting an element.
  • Easy File Navigation: Simply press ALT(Option) + SHIFT and click on the element you want to inspect.
  • Compatible with Multiple Editors: Works with a variety of editors including Atom, Visual Studio Code, Sublime Text, and more.

Summary:

"ember-template-inspector" is a powerful add-on that enhances the development workflow for Ember.js developers. By allowing them to open the template file in their code editor while inspecting an element, it provides a seamless way to navigate through the code and make necessary changes. With support for multiple editors and easy installation process, this add-on is a valuable tool for Ember.js development.

ember
Ember

Ember.js is a productive, battle-tested JavaScript framework for building modern web applications. It includes everything you need to build rich UIs that work on any device.

scss
SCSS

SCSS is a preprocessor scripting language that extends the capabilities of CSS by adding features such as variables, nesting, and mixins. It allows developers to write more efficient and maintainable CSS code, and helps to streamline the development process by reducing repetition and increasing reusability.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.