March 4th, 2017
1:05 pm
Posted under Ionic
Permalink
Tags Angular, Ionic
Having already configured Angular 2 with Webstorm here, this post details the steps to get Ionic working in similar fashion, to be able to run and debug an ionic application running in a browser. The use of an android emulator/ a real android (and then IOS) will be dealt with later.
- First install Ionic 2 as detailed similarly either here or here.
- Next, configure Webstorm as detailed in this post here. Note that the first step adds a phonegap/cordova plugin which allows Ionic serve to be started within Webstorm, without using a separate command window. This trick is similar to step 10 in this post which does the same thing for angular 2/npm start. Note that I had to dig around for the phonegap/cordova executable – in my case it was a command/batch file located at C:/Users/SteveW/AppData/Roaming/npm/ionic.cmd , and note that Webstorm did require the .cmd extension explicitly to work. Per the instructions, ensure you select serve as the command and at this stage browser for the platform.
- The second step in the post configures a Javascript Debug configuration. Enter the name and the target URL. Note that in order to get breakpoints to be obeyed, I had to add an entry in the Remote URLs of local files section. In my case I just added the same url as at the top, against the top level project folder which was already shown. Prior to this, I could set a breakpoint successfully (meaning I did not have any sourcemap issues like the ones I hit with vs code here), but the breakpoint was not obeyed. Once I added the remote URL everything worked.
Leave a Reply
You must be logged in to post a comment.