I'm working on an ASP.NET MVC application with an AngularJS front-end and it's working great when running from visual studio/iis express, but not so great when I try to publish it so it's accessible to other users (e.g. navigating to http://server/application in a browser). I have IIS configured on server so that http://server/application points to an "application" folder that is structured as:
application
app
areas
foundation
main
layout
layout.html
bin
Content
fonts
Scripts
Templates
Views
Shared
_Layout.cshtml
Index.cshtml
Logs
Global.asax
web.config
The initial page, Index.cshtml (under Views/Shared/), gets loaded but includes this:
<div ng-include="'app/main/layout/layout.html'"></div>
which returns a 500.24 - Internal Server Error.
If I change the ng-include to:
<div ng-include="'application/app/main/layout/layout.html'"></div>
then the published application works but running it from visual studio/iis express returns a 404.0 - Not Found response when trying to load that layout.html file, I'm assuming because there's no parent "application" folder when it's running using iisexpress.
I did manage to get the published application working at one point by copying the contents of the published application folder to server's C:\inetpub\wwwroot folder but that doesn't seem like a proper solution, so what's the best way to inform Angular to look in the correct location for this ng-include?
What I ended up doing is adding an application path variable in my web.config file and prefixing all my ng-include or other urls with the application path, so they looked like
<div ng-include="'application/app/main/layout/layout.html'"></div>
and then updating my project Web properties to the following:
so that whether I publish it or run it through Visual Studio, it's running under the 'application' folder and looking for the html files in the appropriate location.
Related
I am writing a WPF app that will be like a wireframe tool that generates and edits .razor pages for a Blazor Serverside Website.
The issue I run into is that whenever my WPF desktop app writes directly to a component page file (.razor), or creates a new page it requires the Blazor App to be stopped and restarted to view the newly created content.
Is there a way to change a source .razor file where I don't have to restart the Blazor App to see the changes?
There is a way to do it at development time.
Use 'dotnet watch' on the Blazor server-side project while you are editing it with your wireframe tool. Make sure to read over the .NET Hot Reload support article and the related Support Code Changes document so that you know what to expect.
Personally, I have found 'dotnet watch' to be somewhat finicky for certain projects and certain dev workflows, but it can feel like magic when its working.
If you are looking for a way to dynamically modify a deployed application, then 'dotnet watch' wouldn't be appropriate. I am unaware of a safe way to dynamically recompile and integrate .razor files in a deployed (production) web application.
There does appear to be a way to turn on dynamic recompilation of .cshtml Razor files. I'm not sure if that will affect .razor Blazor files or not, but you could give it a try.
The title should be self-explanitory, but just in case. I am trying to build an angular application which will be hosted on azure. Currently I am having some issues with using kestrel, so I would like to build the application in visual studio but without using any .net code (so no startup.cs or program.cs).
If the answer is plainly no, then I guess I will need to find another IDE that will do what I require.
Yep. Just create a website project instead of a web application project.
https://msdn.microsoft.com/en-us/library/dd547590.aspx
Scenarios in which Web site projects are the preferred choice include the following:
You do not want to have to explicitly compile the project in order to deploy it.
Yes it is very much possible with visual studio to develop a SPA in angular without using .net framework. Below are the steps you can follow to getting started with a SPA in angular using visual studio.
Goto: File > New > Project
From the below screen selecet ASP.NET Web Application
Provide Name, Location, Solution click OK will get the below popup
From the above Popup select Empty and Press OK to create your project.
Now add an html file say index.html to the project. Write the below code in index.html
<head>
<title></title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
</head>
<body>
<div ng-app>
Message:<input type="text" ng-model="message" />
<hr>
<div>Entered Message:{{message}}</div>
</div>
</body>
</html>
And you are good to go. Right click on index.html and select View In Browser you will see the output in your browser something like this.
Now You can can create a directory structure accordingly. Below are few link that can help you with the directory structure.
Directory Structure Angular
Angular Folder Structure
Angular App Structure Guideliines
Or you can follow the steps as stated on official Angular website for getting started with an angular project in Visual Studio
VISUAL STUDIO 2015 QUICKSTART ANGULAR
Hope this Helps :)
Yes you can develop a SPA application without .net code in visual studio. Visual studio code is another IDE for cross platform development.
Check out the example at pluralsight
My Assumption here: You are ok to work on your website offline without actually firing it off thru the Azure hosted location.
I will try to address how to have a website opened up in Visual Studio which has nothing to do with project based on .NET Framework.
Steps to follow:
a. Create a physical folder on your drive and keep your SPA related files in it or let's say keep a simple "HelloWorld.html" file which just display some plain text.
b. Go to VS > File > Open > Website (Four or more options will be present)
- choose the simplest "File System" and point to the folder created in step a.
VS will open the folder as website and add a solution file to it but no other .NET Code is associated to it. This way you can use the IDE as I think you intend to use.
If you using node toolings to build you project you may want to try Node.js Tools for Visual Studio
It does have support for gulp/grunt tasks as well as it has integration with azure. The support is provided via custom project types.
I m trying to learn Angular.js framework, getting examples on internet "CustomerManager angularjs by DanWahlin" demo seemed comprehensive and downloaded the code from Github "https://github.com/DanWahlin/CustomerManager" .
But when I try to open the index.html, it doesn't show anything. am I doing some mistake??
other examples that I downloaded like TODO using angular work fine.
Also if anyone can share some real time examples as to how the code is generally organized in PROD then it will be very helpful.
Thanks.
It is because the files are not supposed to be opened in a browser directly from the file-system.
(Many src, href etc attributes break.)
You have to follow the instructions on the Readme.md file. E.g. on Windows:
The following is required to support the backend services:
Visual Studio 2012 Web Express (free version) or higher - http://www.microsoft.com/visualstudio/eng/products/visual-studio-express-products#product-express-summary
ASP.NET MVC and Web API are used for the back-end services along with Entity Framework for database access (included if you have VS 2012 express installed)
To get started, double-click the CustomerManager.sln file located at the root of the CustomerManager repository. Once the solution loads press F5 to run the project.
I have a Silverlight app made in Visual Studio 2010 and I want to put it on a website but I don't have the slightest clue how.
I've looked at all the msdn documentation and they all mention a .xap file that is the file you use on the website but there is no .xap and I can't find out how to compile my code into a .xap file.
Also, when I run the App and look at the source in the browser, it has my code compiled into the .xap file, but there is no .xap file!
So my question is simply how do you go about getting a Silverlight app on a website because I've been trying for hours and I can't figure it out.
A sample html or aspx page is included when you create the solution. This is the page that the browser navigates to when you hit F5. You can take that page as a basic example of how to embed a Silverlight app in a page. You should find it in the project folder.
Silverlight projects are commonly built into a XAP file when you hit "Build" in VS. This file lives in the bin/Release or bin/Debug folder and basically contains your whole application.
Steps to create a silverlight application Hosted in a web site,
Select Silverlight Application Template while adding new project in VS2010
When you click Ok, ensure that Host the Silverlight application in a new web site is Checked.(It will create a new ASP.Net web application to host the Silverlight)
If you haven't checked the Host the Silverlight application in a new web site option, you can add a new ASP.Net Web application project and then go to its properties and select Silverlight Applications option in left pane. Then Click Add, select your Silverlight Application to be hosted and click ok. You are done now.
But If haven't selected the Silverlight Application Template, then you might have created a Silverlight Class Library. It wont generate any xap file. It just gives a dll. So you need to recreate a project as mentioned above.
I believe that in Silverlight whenever you create a project, right at the beginning, it will ask you if you want to create a web app automatically. If you chose yes, something like YOUR_PROJECT_NAME.web will be created, go into that folder, you will find a folder called ClientBin.
The .xap file will be inside that folder.
HTH
I am using the Publish functionality to deploy my Silverlight webapplication. I am not hosting it in an aspx page, just a plain html page. I do not need all the extra aps.net stuff. When I publish it, it wants to add a bin folder, and it wants to compile the site it seems. Is there any way I can disable this? I just want my index.html file together with some xml files copied to the ftp server of my hosting provider.