Visual Studio 2012 Website - Make Project Folder Mirror Explorer - asp.net

I'm guessing there's a standard way to do this that I never learned... I have a VS solution with some folders in it, you know, Models, Views, Controllers, etc. I added a few custom ones like Styles, Scripts, and Images. Naturally, I started saving images for the site in the Images folder in Explorer that VS created. I was sad to learn, however, that these files don't just show up in my solution, therefore they don't get Web Deployed either. Bummer. What is the right thing to do here?
P.S. Some of you probably jumped when I said I made a Scripts folder. I know about the built in minification stuff, and I don't want to use it at this point. Thanks.

If you don't mind getting your hands dirty in the .csproj file, firstly remove any existing file references from the Images folder of the project and then insert this before the <Import> tags.
<ItemGroup>
<Content Include="Images\**\*.*" />
</ItemGroup>
This will automatically include all files contained in the Images folder and its subfolders when the project is loaded.

Click Show All Files in the toolbar on top of Solution Explorer.
You can then right-click a file or folder and click Include in Project.
You also need to make sure that the files' Build Action is set to Content, but that should happen automatically.

Related

How to integrate wrapbootstrap theme into asp.net web site in visual studio 2013?

I am new to bootstrap. I downloaded a wrapbootstrap theme and is trying to include that in my website. In the downloaded theme, there are several folders under a folder called assets, like bootstrap, css, js, icons, img. Under bootstrap folder there are again subfolders called css, fonts and js. Can anyone please tell me where exactly in the project should i add these files? In case of a simple theme, I know we need to add the bootstrap css under Content folder and the bootstrap js under Scripts folder and we need to add it in BundleConfig.cs. But here, since there are different css files and js files, where can I include them?
Thanks in advance.
Where the files are located is really irrelevant so far as your application is concerned. The ~/Scripts and ~/Content folders are just a default convention that Visual Studio uses with the templates.
However, nothing is preventing you from moving them. When working with a template, you have one of two choices.
Leave the files as they are, and simply reference them, or include them into bundles in the paths they are located in.
Determine which CSS and JS files you need, and re-shuffle everything to suit your particular projects needs.
The first option makes it easier to upgrade the template in the future, while the second option makes your project files more coherent because they follow a similar structure.
At the end of the day though... it's all just a resource location for you web server to resolve. Do whatever makes sense for your project.

CSS/JS bundle in single file in mvc when publish with release option

I have created MVC application. When I publish the application on Azure with release option, all css and js file load in a single bundle in page. (Open view source of page then displays a single link for css).
When I publish a site with Debug option in publish profile then all CSS load individual.
My problem is when publish site with release option theme not load correctly, but with debug option theme loads correctly. I want to publish my application with Release option only. If anyone face this issue before and get any solution then please help me.
I have experienced this before when using bundling.
Say for instance your css file is located at: /Content/css/css.css
This css file then makes a reference to another file, or for example an image at /Content/images/image1.png via url('../images/image1.png').
You then set up your css bundle # /bundles/css.
All appears great in debug mode. However, when you set <compilation debug="false" .... in your web.config, suddenly the references made in the css file breaks. If you open your console in Firebug/Chrome dev tools and check the network tabs, you'll see resources failing to load, from an incorrect URL.
This happens because when debug mode is off, all the files are bundled and minified like they would be in production. In this case, the CSS file would be bundled and served from the URL /bundles/css. This results in the relative URL reference breaking. Where it once referenced /Content/images/image1.png, it now references /images/image1.png.
You have a few options to solve this:
Serve your bundled css files from the same folder as the actual css files. eg. /Content/css/cssbundle. This can become very tedious quickly.
Change all relative references in your css files to absolute references. eg. ../images/image1.png would become /Content/images/image1.png. This does mean you can't use a lot third party CSS bundled out of the box, you would have to check/change relative references if you wanted to bundle them.
Use the BundleTransformer nuget package. It automatically transforms relative urls to absolute ones during the bundling process.
The main differences of StyleTransformer and ScriptTransformer classes from a standard implementations: ability to exclude unnecessary assets when adding assets from a directory, does not produce the re-minification of pre-minified assets, support automatic transformation of relative paths to absolute in CSS-code (by using UrlRewritingCssPostProcessor), etc.
I personally recommend 3 as it is the easiest to maintain long term.

ASP Site - Updating Dlls on Change

When I make a change to the a aspx.cs page in my website and then build I notice that none of the dlls in the Bin folder are updated, the only dlls I can see in there are the references the web app uses. I want to bring across this one change rather than redeploy the whole site so where are the changes being saved?
I've tried various things like build solution, rebuild solution, build website, rebuild web site.
Is it possible my dll is being sent elsewhere? How would I go about finding out where?
In Solution Explorer, on root project node, right-click and select Properties. Click on the "Build" tab and look under "Output" section. Here you will see the actual output path and can change it to your bin folder.
In Solution Explorer, on root project node, right-click and try to Clean solution and then again build whole solution.

How might i setup my ASP.NET project to find my files?

edit I do not want to redirect pages, specific files etc. I would like to change the path where images, videos and other media are stored from the root source directory to the directory of my choosing. In this case c:/dev/prjfiles/prjname/public (c:/dev/prjfiles/prjname/ is my working directory) and i except when my html does img src="/pic.png" it will find the image in c:/dev/prjfiles/prjname/publi/pic.png. I need a working solution, i tried looking at how to set virtual directories and etc. I cant figure it out. Thus the bounty. I am generating the html, i am not writing asp:image runat="server" etc i am pulling data from a DB and outputing the html. The part that is still a WIP is the code that handles POST request. The html already exist but i cant have hundreds of files in site.com/here pollution my source directory (c:/dev/trunk/thisprj/thisprj/where my .aspx files are and i do not wish 500 .png/gif/jpg here)
I dont know how asp.net environments are usually set up. I am assuming i have a root path that is not available from the web, a bin/ where i may put my asp.net dll and a public where i stick in any files i want.
I would like to have my project files seperated from everything else. My JS, css and image files are in prjfiles/prjname/public with my sqlite db in prjfiles/prjname/ and extra binaries in prjfiles/prjname/bin.
The problem comes when i run my app and try to load an image. Such as /cssimg/error.png. My project does not find resource in my /public folder and i have no idea how to make it find them. How can i set my project up so it does?
NOTE: I set the working directory path so its at prjfiles/prjname/. In code i write ./bin/extrabin.exe and db.sqlite3 which access the files properly.
You might want to watch the getting started videos for ASP.NET
http://www.asp.net/get-started/
EDIT: More info added
As #Murph suggests, your assumptions are incorrect.
IIS takes care of blocking HTTP access to any important files and folders like your *.aspx.cs, and *.cs in the App_Code, any DLLs, anything under the App_Data directory and the web.config.
Content files, such as *.html, *.css, *.js, .gif, .jpg, .png are all served in the normal manner.
In this way, there is no need for a "public" folder.
I dont know how asp.net environments are usually set up. I am assuming i have a root path that is not available from the web, a bin/ where i may put my asp.net dll and a public where i stick in any files i want.
This is wrong assumption!
You have a root folder, which IS available in public. You set IIS or ASP.NEt Development Server to this folder.
(optional, but always needed) You have a web.config file in this root folder for configuration
You have a bin folder for your assemblies (each page or user control "include" compiles to a class)
(optional) You have App_Data as default folder for file-based DBs and/or other data files (say XML storage, ..)
(optional) You have an App_theme folder for styling and images. Read about ASP.NET themes.
(optional) You can add App_Code folder if you want to add classes to be compiled by the server.
You can create folders for scripts, etc...
Normally for complex logic, etc.. you create in a separate project outside the root and reference the result assembly in the bin folder.
Seriously, you cannot do ASP.NET work without an IDE or a manual. Visual Web Developer 2008 Express IDE is free and http://asp.net has tons of resources for getting started.
I don't know if I got the question right, but maybe you could try the <BASE> HTML tag.
HTML <base> Tag
"Specify a default URL and a default target for all links on a page"
There's a nice and simple example at W3Schools, check it out.
The negative side is that you need to put a <BASE> tag in each page you want.
It sounds like you should be able to create a virtual directory to do what you're asking -- but it's a very non-standard setup.
Keep in mind that IIS will prevent users from downloading DLLs and other project-level files, so you usually don't need to partition them off in a separate layer.
For example, just have a cssimg folder at the top level of your project, and skip the whole public folder thing.
I see where you're coming from. ASP.NET projects are set up a little differently from how you're treating them, but you can make them work like you want.
The root of an ASP.NET project IS publicly accessible. When you created your WebSite within Visual Studio, it created a default.aspx page right on the root. Are you hosting in IIS? If so, it's set up to serve up default.aspx by default. But I digress.
Here's how to make it work like you want (mostly):
Create a WebSite, then right-click the site and add a folder named "prjfiles". Right-click that folder and make another named "public". Create another subfolder of that one called "cssimg".
Now, if you want to use the image you mentioned, you'd reference it like this: "~/prjfiles/public/cssimg/error.png" (pathing starting with the root) or "./cssimg/error.png" if you're coming from a page in the public folder (relative pathing).
Really, though, you're doing too much work. Here's how to make it work with less effort:
Create your WebSite, right-click the project and add a folder called "cssimg".
Treat the root as you would the "public" folder- put your pages right there on the root or in subfolders, as needed. You can reference that same image file like this now: "./cssimg/error.png" (relative) or "~/cssimg/error.png" (start from root)
There's also another way to tell the engine where to look for resources, but it's for your css files. Inside the "head" tag, you can add a "style" element (with type="text/css") and inside that you can add something like this: #import '<%= ResolveUrl("~/prjfiles/public/cssimg/styles.css") %>';
Good luck!
If I correctly understood your problem, you're trying to find files which aren't physically stored on a filesystem folder, or stay on a different folder. You can deal with this problems by implementing a UrlRewrite mechanism.
I suggest you to read URL Rewriting in ASP.NET and, after, to take a look into this implementation: A Complete URL Rewriting Solution for ASP.NET 2.0.
If I understand all this correctly (please comment with any correction) right now all your files are together in the root directory and you use <img src="/img.png" /> and it works.
If this is the case, make another directory in the directory the images are in, say call that directory images and put the image files there. now use <img src="/images/img.png" />.
Done.

ASP.NET Setup Project - how to include static files not in VS?

I am working on an ASP.NET MVC web application, and am working on the Web Setup portion. We are using SVN for version control. One of the issues is that the we are currently having is that the web designers modify and add a lot of html, css and js files that end up in the Content folders, but they don't add them to the VS project, so the new files don't get included in the installer.
One option is that we have to try to teach them to always go into VS and manually add the files, but we're on a large project and it's getting down to crunch time, so trying to get people to learn something new in a technology that they don't know will result in too many mistakes, so I'd like to work around that if possible.
Is there some way to get the setup project just to include files from a folder on the file system, instead of a project's designated content files?
Thanks!
I think I've figured it out:
Make sure that the installer project includes the Content Files for the web app. Then go into the web app's csproj file with a text editor and find the ItemGroup where the static Content files are listed. Then add an entry with a wildcard in it and the installer will package them in.
<ItemGroup>
<Content Include="Content\test.html" />
<Content Include="Content\*.html" />
<Content Include="Content\*.gif" />
<Content Include="Content\*.css" />
<Content Include="Content\*.jpg" />
<Content Include="Content\*\*.js" />
Right click on the folder in the File System view of the Web Setup project, and select Add, File...
It doesn't look like you can add an entire folder this way though, so you would have to add every file individually to the Setup program.
EDIT:
Aren't all files from your project folder included in a WebSite project in Visual Studio? Then it's just a case of having your WebSite project and Web Setup project in the same solution, then right-click on the Web Application Folder in the Web Setup project, select Add, Project Output... and then select the WebSite Project in the drop down and Content Files from the list box and click OK.
Unfortunately I don't think there is an out of the box way to do this, as projects maintains references to the files individually.
You could achieve what you need via a custom macro, or asking your other team to edit the .csproj XML file (perhaps simpler or riskier, depending on their background).

Resources