Override bootstrap in .net core 2.0 using less - asp.net-mvc

In good old ASP.NET we would install Bootstrap as a NuGet package and it would install all the files in the ~/Content/bootstrap directory. This made it easy to create a custom bootstrap.less file that imported Bootstrap so that we could override what we wanted while still keeping the library intact so it could be updated at any time.
For example I could do this in my custom less file to enable a special bootswatch theme with some custom variables and overrides. I could then compile it and add it to the site css.
#import "bootstrap/bootstrap.less";
#import "bootstrap/_variables.less";
#import "bootstrap/_bootswatch.less";
#import "custom.less";
In dot net core 2.0 there is no ~/Content directory by default and css is really served from the new wwwrootdirectory. When installing Bootstrap through NuGet now, it is added as a "Dependency". I can't find a way to import the bootstrap less files as I used to though since I don't know the path, if there even is one.
I have created a custom ~/Styles/bootstrap.less file in which I try to use the imports above but the compiler can't find them. I have found the .less files in /packages/bootstrap.less.3.3.7/content/Content/bootstrap.less in my solution root but that does not seem to be accessible to the import-statements.
#import '../../packages/bootstrap.less.3.3.7/content/Content/bootstrap.less';
The error I get is simply:
FileError: '../../packages/bootstrap.less.3.3.7/content/Content/bootstrap.less' wasn't found.
Tried - [SOLUTIONPATH]\packages\bootstrap.less.3.3.7\content\Content\bootstrap.less,
....\packages\bootstrap.less.3.3.7\content\Content\bootstrap.less in \Styles_bootstrap.less
How can I override the bootstrap less files? Do I have to download bootstrap myself into my ~/Styles/ directory to be able to import them? That would ruin the possibility of updating through NuGet :/

.net core has stopped supporting Nugets for client side codes. Creating a new .net core project with either vs 2017 or using the cli dotnet new mvc would by default include the bower packages on the wwwroot/lib folder. To manage bower packages you can right click on the project and select "manage bower packages". Also note that .net core mvc by default is only configured to use the wwwroot folder as the client side content. Besides this, the compiled views are the only other content that are given to the client. This means that and Styles or Contents folder you create wouldn't be a client side code by default. You can add theses folders in the set up but its not recommended. The js and css files can be found in folders inside wwwroot.

Related

Asp net core read or write views at runtime

I have an asp .net core project. At runtime, I want to read and modify the views in my views folder in an editor, and at the same time, I want to save them and instantly reflect them on the site.
Can I both read and update views with the familiar file read and write method. Is it okay for me to do this at runtime?
How can I do this and what is the best way to make this work?
You could install the Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation NuGet package to enable runtime compilation.
1.Install the Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation NuGet package.
2.Update the project's Startup.ConfigureServices method to include a call to AddRazorRuntimeCompilation:
services.AddControllersWithViews().AddRazorRuntimeCompilation();
Reference:
https://learn.microsoft.com/en-us/aspnet/core/mvc/views/view-compilation?view=aspnetcore-5.0&tabs=visual-studio#enable-runtime-compilation-in-an-existing-project

Controllers folder missing Umbraco 8

I installed Umbraco 8.4 as per the instructions found at https://our.umbraco.com/documentation/Getting-Started/Setup/Install/install-umbraco-with-nuget
Once done within Visual Studio 2017 i tried to created a new Controller and the folder (Controllers) was missing.
I'm not sure if i've missed something but i didnt want to create the folder manually in case it introduces new problems later down the line.
I thought to recreate the project but instead of selecting Empty as the project to use MVC but after reading through a few threads it seems the correct way is to select an empty project.
Under the bin directory i do see System.Web.Mvc.dll
Am i missing something?
You should definitely not use the MVC project template when creating a new project - that will add all sorts of dependencies that will likely conflict with what comes with the Umbraco NuGet package.
Go with the "Empty" template and then add in the NuGet and it will give you the dependencies you need for Umbraco to run. If you need to add in other stuff from MVC afterwards, you can add these in a version that aligns with what the Umbraco package has added.
In regards to the Controllers folder - it really doesn't matter where this folder lives or what it is called. Controllers are registered by other means. You are totally fine to create this folder manually and call it whatever you prefer.
I think most people actually prefer to keep Controllers in a completely separate project in the VS solution. Then reference that project by your main project to ensure the compiled DLL is included in your web project - and thereby your controllers can be used by the Umbraco website itself. By doing this, you get a clean separation of your .cs source files so you won't accidentally be deploying those when you deploy your site. To do this you would of course require to add UmbracoCms.Core NuGet package to your other project in order to use Umbraco functionality.
Keep in mind if you are adding plain MVC controllers (not inheriting from the Umbraco base controllers - and therefore not getting automatically registered) you will need to manually register these controllers in the route table in order to access them.
This is no different from what you would do in a normal ASP.NET MVC project, but since this isn't added by default in an Umbraco project - you need to do it yourself.
See this answer for instructions on how to do it: https://stackoverflow.com/a/56972929/336105

Angular.js NuGet vs core reference?

In Visual Studio, when you add the Angular.js NuGet package, it adds a ton of angular javascript files. I've always just added the direct reference to angular.js (local or via google URL) to my projects and it always works fine.
What's the reason for using the NuGet version of Angular.js?
With Nuget it's easier to get all dependences (if they exists) and monitor updates when they comes out and install them.
But in case of Angular.js Nuget still just copy some js files in your project. So if you don't plan to follow updates and you know all dependences you can just copy your files.

direct nuget where to put files

I am working with nuget and find it excellent with my MVC4 project. I use it for all my external dependencies.
I have run in to one small problem with it. For example, installing the jQuery package, it places the jQuery files in to the Scripts folder. My preference is that it places the javascript files in to a libraries folder within scripts. So instead of
Scripts/jquery-1.8.3.js
I want to place it in
Scripts/libraries/jquery-1.8.3.js
Yes I can manually move it but then I lose the features of nuget. Any way that I can direct where a package places the files like this?
This is not supported yet
dupe of
NuGet scripts to different directory
, nuget codeplex issue is here http://nuget.codeplex.com/workitem/1914

JSF facelets template packaging

As always, i'm a little confused.
Here https://community.jboss.org/wiki/ModularWebAppsWithJSF2 i've learned that it is easy and works out of the box to bundle templates in separate jars since JSF 2.0.
The only problem is: i can't get it working. I simply deploy a "page.xhtml" in all flavors (META-INF directory, resources directory, root; with and without faces-config.xml) in a jar that is included in the web application WEB-INF/lib and request something like http://host/demo/faces/page.xhtml or do an "include" or "decorate" on the template. I get an exception.
Here Java EE6> Packaging JSF facelets (xhtml) and ManagedBeans as JAR my favorite JSF teacher explains to use a custom ResourceResolver to do exactly this. As i debugged the resource resolving i have no doubt that this will work and will give it a try.
This is the question about the mechanics - what is the difference between the two approaches?
Which resources exactly are looked up in META-INF/resources automatically?
Facelets compositions (so, just plain *.xhtml pages, templates and include files) are resolved by ExternalContext#getResource() which delegates to ServletContext#getResource(). This requires a Servlet 3.x compatible container because /WEB-INF/lib/*.jar!/META-INF/resources resolving from is new since Servlet 3.0. If you aren't on Servlet 3.x yet, or want to put those JARs on a different location for some reason, then you'd need to create a custom ResourceResolver. See also How to create a modular JSF 2.0 application?
Facelets composite components and static resources (so, <cc:xxx> components and CSS/JS/image resources which are to be loaded by <h:outputStylesheet>, <h:outputScript> and <h:graphicImage>) are resolved from the classpath by ClassLoader#getResource(). To include the JAR file in the classpath scan of JSF, you'd need to include a JSF 2.x compatible faces-config.xml file in the /META-INF folder of the JAR file. The same story applies to #ManagedBean, #FacesValidator, #FacesConverter, #FacesComponent and other JSF artifacts.
When developing in Eclipse, you can choose Web > Web Fragment Project to create such a module project. It is not much different from a normal Java project, expect that it will implicitly include JavaScript facet and a targeted runtime, autocreate a /META-INF/web-fragment.xml file and get associated with an existing Dynamic Web Project by adding itself as a deployment assembly to that project.
You can also use an existing standard Java project with the right folder structure prepared. The /META-INF folder has to go in Java source folder. The web-fragment.xml file is by the way optional. You just have to manually add the Java project to the Deployment Assembly section of the main web project properties. Do not add it as another project in project's Build Path section.
When you're (manually) building a JAR file out of it, you need to make sure that the directory entries are added to the JAR, otherwise Facelets compositions can't be resolved. If you're building by build tools like Eclipse/Ant/Maven/etc, this has also to be taken into account. If this is not controllable, a custom ResourceResolver is the most reliable approach.

Resources