CODEWITHSUNDEEP
visual-studiocordovaionic-frameworkvisual-studio-cordovataco
Ilya Chernomordik
Ilya Chernomordik

Reputation: 30265

How to view Cordova app in the browser with Visual Studio?

I want to run my cordova app in the browser (not ripple emulator, but directly in the browser). One way of doing it I found on SO and it's simply set up IIS to the www folder. That works pretty fine, but I was wondering if it's possible to add a platform for the browser directly, so that it runs on F5. I am not very experienced at it, but I saw that e.g. in raw Ionic tools you can do "ionic serve" and it starts the web server and opens the browser. I suppose it runs node behind the scenes. It there an easy way to do that in Visual Studio either via node or IIs?

Upvotes: 4

Views: 2341

Answers (5)

daniil_
daniil_

Reputation: 990

You can create an IIS node, for example http://localhost/cordovaApp, I use this approach in one of my project and it's really conveniently.

Upvotes: 0

Vincent Tang
Vincent Tang

Reputation: 280

If you are using phonegap to test your app, you may type "phonegap serve" in command line NOTE: your cd has to be your application file path. Then you may see the ip address:port number which can be used in browser,android and ios platform.

Example: enter image description here

Upvotes: 0

DeanB_Develop
DeanB_Develop

Reputation: 2137

To open your cordova app in a browser while using Visual Studio 2015, I suggest using Gulp + BrowserSync:

Download browser.sync from NPM. The best way to download is to add it to package.json and automatically download it.

{
  "name": "content_md_app",
  "version": "1.0.0",
  "devDependencies": {
    "gulp": "3.9.0",
    "browser-sync": "2.10.0",
  },
  "dependencies": {
  }
}

Add a gulp task to make launching easier. Create a gulpfile.js in the project root and add task. Example gulp task:

gulp.task('browser.sync', function () {
    browserSync.init({
        server: {
            baseDir:"./www/"
        }
    });
    // Note. you can add browserSync.reload to the tasks runner explorer array to make
    // all browsers reload after a build is complete.

});

Use Task Runner Explorer to launch the gulp task manually or automatically. enter image description here

Upvotes: 1

Maruthi Gongadi
Maruthi Gongadi

Reputation: 67

right click on the index.html file and then select Open With..-> add-> then select the browser from available programs and then click on OK

Upvotes: 1

Markus Wagner
Markus Wagner

Reputation: 748

I do not think that it is possible to add a "browser" environment in Visual Studio or even native Cordova. If you really need such a functionality, you could use IBM MobileFirst (which I would not recommend, as long as you are not using their server, too).

I personally have no need of F5 functionality in Visual Studio. Just save, go to the browser and press F5 there. For debugging, I am using Chrome with the developer tools.

BTW: I do not set up IIS to the www folder, but to the project folder. I am doing this, because I am using TypeScript as script language. The TypeScript files are beside the www folder. With my setup, Chrome is able to find the TypeScript source corresponding to the JavaScript code.

Upvotes: 1

Related Questions