Reference Dependencies in VS2015 from wwwroot - c#

I have an MVC Web API application created with VS2015 using the new preview C# 6.
The project by default comes with a Dependencies folder and a wwwroot folder. Both of these reside in the root of my project.
In the wwwroot I have an index.html which is trying to reference angular.js which can be found in the Dependencies/Bower folder (the actual path name is $(project_rootDir)/bower_components/.
So in my index.html I simply do:
<script src="../bower_components/angular/angular.js"></script>
When I start IIS Express and check what file the index.html is trying to load through console then I see it's trying to get it from:
localhost:5000/bower_components/angular/angular.js
But the path should be:
localhost:5000/../bower_components/angular/angular.js
But it seems like it cannot reference JS files from outside of the wwwroot folder. So I'm sort of stuck. What can I do? I want to reference the JS files from the Dependencies folder from the wwwroot folder.

EDIT: This answer relates to the new Asp Net MVC Core 1.0 in Visual Studio 2015.
Just wanted to update this as it's taken me a while to do this and google keeps bringing me back here. Short answer is you don't have to copy anything to anywhere.
#rdans answer is right in saying to look at the link (https://docs.asp.net/en/latest/client-side/bower.html) the most crucial element for this question is that to add a bower configuration file as soon as you create a project.
There is a .bowerrc file that also gets created which is what copies the newly installed bower components to the wwwroot folder (currently set to "directory": "wwwroot/lib").
You then have to follow the instructions to add the following code to the StartUp.cs file.
app.UseStaticFiles();
Then when you want to reference the file ensure you have a ~ at the start of the src url.
Hope this helps someone.

The files need to be copied to the wwwroot folder. I guess this should be happening automatically but I was having problems with this earlier as well. I followed the steps in this article to copy the relevent files.
http://docs.asp.net/en/latest/client-side/bower.html
The steps wernt exactly as described. Here's what I ended up doing:
Right click on gulpfile.js
Click on "Task Runner Explorer"
Double click on "Tasks -> Copy"
You should now see a "lib" folder in wwwroot with the necessary files.

Related

Nancy looks for views in wrong project

Edit
I just downloaded the source code of the tutorial project from GitHub. When I build and run the project, I see that the Website/Modules/ folder is copied into the bin/Debug folder of the Service project. But this does not happen when I build my Service project.
What could be the reason?
I am following the tutorial in this link.
I have completed the part until the index.html is added and should show Nancy is working! when the webpage is loaded.
I had to change the ViewLocationConventions to
$"../../../Service.Website/Website/Modules/{context.ModuleName}/views/{viewName}"
Only then everything works fine with Nancy 1.x version. Why doesn't it work when I use
$"Website/Modules/{context.ModuleName}/views/{viewName}"
like in the tutorial?
And when I use Nancy 2.x, it cannot find the view file at all. No matter what I set ViewLocationConventions to.
i.e., it still looks for the Website/Modules/Root/view/index.html file in the Service project.
Any other workaround, other than moving the view files itself to the Service project?
Quick background of the tutorial:
The solution has 2 projects Service and Service.Website as shown below.
Service is a Topshelf service that hosts a server that runs the web project
Service.Website is a web project using Owin and Nancy
Thanks to #hellyale's comment, I had to set the Copy to Output Directory of the index.html file to Copy always.
This then copies the file to the bin/Debug folder and Nancy is now able to find the view.

Where are asp.net website project settings stored?

If we look at the settings page of a asp.net website project ( press alt+enter ) . It looks like this:
However, no where in the solution / website folder i can find out where these settings are stored ? there is no csproj file created for "website project" .
The reason I am asking this is because when I add the solution to github , and then clone on another machine, the references are lost and the project will not compile anymore. But if i copy the entire project folder to another computer, it compiles fine.
So for sure, there are some settings file that are not added to git repo.
Does anyone have any idea where these settings are stored ?
I will write down what I found later on for anyone's reference. The Contents in the reference list ( as pasted in the image above ) seem to be read real time from Bin folder of the project . So adding a dll file in Bin folder directly and closing/opening the Property page will show the newly added Bin file as reference.
There is a .sln file for website projects, just not where you might expect it. For Web Site projects, it is created in your default Projects location e.g. C:\Users\username\Documents\Visual Studio 2010\Projects\YourWebSite\YourWebSite.sln (or wherever you have your default Projects location set up in Tools/Options/Projects and Solutions).

How to rename "wwwroot" folder used as web root in ASP.NET 5 web project

I would like to rename the web root folder in my ASP.NET 5 project to something other than wwwroot. When I manually rename that folder, the project no longer recognizes it as the web root folder. The project properties page does not allow the web root to be modified. Is there any way to rename and/or reassign the web root folder in ASP.NET 5 web projects?
The docs don't quite explain your desired process. They assume someone wouldn't rename wwwroot but would just use another folder. As you mentioned in comments, you must use hosting.json, not project.json as was previously suggested. However, the order of operations matters if you want to rename wwwroot rather than just use another folder. To get the desired result:
Create the test folder (instead of renaming wwwroot folder)
Add the hosting.json file with the webroot entry pointing to the test folder.
If VS doesn't restart/reopen the project, just restart VS and you should see the test folder now show up as the webroot.
At that point, you can move contents from wwwroot to test if that hasn't already happened.
You can manually rename the folder but you would need to update/create the hosting.json to specify the name of web root folder.
{
"webroot": "wwwroot"
}
beware: there are changes in progress between releases that are not reflected in the official docs at the time of this post yet. i.e.: check here

How to create folder in mvc solution directory so that it is included in project?

I am new in mvc and c# and I can't solve following problem:
I am trying to create a folder named "Items" in solution folder.
I have tryed to use CreateDirectory method:
Directory.CreateDirectory("~/Images");
But it didn't work for me - folder wasn't created ..
Partly working solution was to create a folder by :
Directory.CreateDirectory(Server.MapPath("~/Images"));
"Items" folder was created, but it is not included in the solution:
How to create folder in solution directory so that it is included in project ?
(I needs to by done by code not by hand)
You need to understand what solution and csproj file is used for
In general, they're being designed and used for development with Visual Studio, and once the project is compiled, all these files will be ignored and excluded from the deployment package
Directory.CreateDirectory(Server.MapPath("~/Images"));
The code above simply create the directory if not existed yet in the deployment package at run-time, so you won't see it in your solution unless you run the project locally (either debug/release mode, it does not matter here). However, everything will run normally in hosted environment (ex: IIS).
For your information, here's the brief of what solution and csproj is
solution (.sln) file: contains information to manage one or many individual projects, contains build environments (for each project), start up mode (useful when you want to start multiple projects in one run), project dependencies and so on. Take a note that VS also read from suo file (solution user options) which is used to defined user-custom preferences (you should not include the .suo file in the version control, because it's custom settings)
csproj file: define the structures of project, what the namespace is, what is static folders, embedded resources, references, packages, etc.
Lastly, if you create the folder manually, VS will auto include that folder into deployment package AND csproj, but depends on the file type, you might need to change the Build Action and Copy To Output Directory in file properties.
Hope it helps.
A deployed web application on a web server doesn't have any notion of Visual Studio solution or projects. So the Directory.CreateDirectory(Server.MapPath("~/Images")) is the correct way to create a folder inside your web application at runtime but we cannot be talking about including it into a solution because this hardly makes sense in a pre-compiled web application. If you create the directory on your local development machine, you could always manually include the folder to the corresponding .csproj file, but at runtime this will not make any difference whatsoever.
The reason I wanted to create a folder (if didn't exist) was to make sure it exits before I try to store image in it.
After reading posts here and a few google searches I have concluded that the proper way to handle image upload would be
To create (In my case) folder "Images" by hand to be sure it exists
Then storing uploaded img in existing folder:
string path =Server.MapPath("~/Images/"+ UploadedImageName);
file.SaveAs(path);

Images and plugins fail to load when mvc-3 application is published to Windows Azure

When we publish mvc-3 project to windos azure, Is it copy all files and folder under the project name folder, means likes Scripts, Contents, etc ?. I am asking this because i just publish my mvc-3 application to windowsazure and after that when i run it using staging url then it not shown the images, plugin are stop working and when i inspect under chrome then it shows :
If you notice than there are few Scripts ( like sammy.js ) and stylesheets ( like Site.css ) which are present but maximums are not. Can please anybody explain me how can i fix this?
Ok , i found out the root cause, this is happening because each time when i was downloaded the new plugin
i just copy the .js from its source folder and then paste it into my project's Scripts folder. But only after
putting the file inside the Scripts folder does not includes it in the project. You can`t see that file in the
solution explorer until you explicitly include it in the project.There is a button in the solution explorer on the top
of it for show all file, included the files which are not the part of the project.Then Just right click on the
file which you want to included in the project and select option Include in the project. Then only that
file becomes the part of your project. Now you can publish the project and everything will works fine.
Make sure they are included in the .csproj file
Make sure they are marked as Build Action: Content

Categories

Resources