Skip to content

This projects queries the official UI5 API and creates TypeScript declarations based on that, so that you IDE can support you writing UI5 JS code

Notifications You must be signed in to change notification settings

ErikBrendel/ui5-api-ts

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

56 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

UI5 API in your IDE!

This projects queries the official UI5 API and creates TypeScript declarations based on that, so that you IDE can support you writing UI5 JS code.

Set-Up

  • clone this repository somewhere to your machine (e.g. C:\PortableIDE\ui5ApiTs)
  • make sure to have python3 installed (you can download it here (windows 64bit))
  • open up a command prompt and run pip install requests requests_cache bs4
  • go to the scripts folder of this repository
  • execute download.py (double-click the file)
  • execute ts_gen.py
  • Now you have up-to-date ui5 type declarations!

(if you have problems with executing the python files, it might be because the imports cannot be found (python imports are weird). Try opening the file in a text editor, find the line that says from scripts.<something> import <something>, remove the scripts. from it, and try again.)

Embedding it into WebStorm

  • open up Settings > Languages & Frameworks > JavaScript > Libraries
  • click on Add...
  • give it a nice name (like "My personal UI5")
  • set the visibility to global
  • click on the small "+" on the side and choose Attach Directories...
  • navigate to the ts folder of this repository
  • That's it!
  • In other projects (when switching between frontends), you might need to open up the settings again, navigate to this library and give it the enabled tick

Usage

  • See comments:
    • On any ui5 function usage (e.g. getView()) or class (e.g. sap.m.Column), press Ctrl+Q to open the documentation
    • If there are more things available with this name, click on the fitting one (e.g. getView in sap.ui.core.mvc.d.ts)
    • see the comment for that class / method and its parameters
    • use the links for opening the docs, examples, ux guidelines or the source code to see additional information about this method or class
  • Type checking...
    • is performed automatically, warnings will appear on method calls that do not align with the documentation of its parameters
    • is not always perfect - there are cases where the ui5 docs do not match the actual behavior of the function or when a downcast of your variable would be necessary to fit the method signature
  • Opening documentation for a given Class...
    • works most of the time by doings shift-shift (search everywhere), typing in the fully name of the classs (e.g. sap.m.ComboBox) and hitting enter
    • works always by typing a full name (e.g. sap.m.Table) into your code somewhere, and then hitting Ctrl+Q or Ctrl+B or shift-clicking the name

Contributing

  • Contributions are always welcome! Just drop a PR.
  • It is recommended to open this repository in pycharm (as it can edit the python files and also tell you any problems in your generated ts declarations)
  • Never adjust your generated .d.ts files by hand - they will be overridden the next time the script runs, and are meant to be seen as 'build artifacts', not 'source code'

About

This projects queries the official UI5 API and creates TypeScript declarations based on that, so that you IDE can support you writing UI5 JS code

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages