I'm trying to get Razor working inside my Xamarin project and I can't seem to get Visual Studio 2017 to recognize that the files need to be processed by the Razor preprocessor.
When I go to add a new file, there's no template for Razor or .cshtml, so I'm just adding a text file and change the extension to .cshtml. Then, in the file properties, I'm setting the Custom Tool to RazorTemplatePreprocessor.
However, despite doing this, Visual Studio does not generate the .cs file that I expect it to.
What am I missing?
UPDATE AND WORKAROUND: As a result of helpful conversation with #SushiHangover (see answer and comment chain below), it appears that .NET Standard library projects do not currently allow Razor files to be added through the Add Item wizard, and if you add them manually, they don't compile correctly. this is true as of Visual Studio 15.5.2. I've opened a bug with Microsoft, but in the meantime, I have super clunky workaround, which is as follows.
At the end of the day, Razor files as you might use them in a Xamarin project are only there to generate .cs files, which compile into classes containing a GenerateString method, which code can call to generate HTML that can then be fed into a WebView. So, I figured, why not just create a regular .NET Framework library (not .NET Standard) and put all my Razor files there. In that project, you can add them normally and they work properly.
But since the rest of my project is .NET Standard and I didn't want to mix and match, I don't actually have any of the other projects reference this library. Instead, I just include the generated .cs files as links (click the little arrow next to the Add button and choose Add as Link instead) in my "real" project (the one where I wanted to add them originally). So the library with Razor files has only one purpose, and that is to generate .cs files, period. Those files are actually compiled into a different library.
I hope this helps someone! When Microsoft fixes the bug, I'll update this thread again (and move my Razor files back to where they ought to be).
EDIT 2
Microsoft has marked my bug "Under Consideration." If this issue affects you, please upvote it to encourage them to fix it sooner rather than later.
https://developercommunity.visualstudio.com/content/problem/172997/razor-templates-not-working-for-net-standard-proje.html
The Razor file templates are available on Visual Studio for Mac (VS4M) under the "Text Templating" group, but the recent versions of Visual Studio for Windows (VS4W) they have gone missing.
On VS4W, you can just edit the .csproj that you are trying to add a Razor file:
A Compile item for the generated .cs file that includes a DependentUpon tag for the .cshtml file.
A None item for the .cshtml that includes the Generator and LastGenOutput tags
Create those two files (.cshtml & .cs) (they can be empty to start)
Example (Xamarin.iOS, Xamarin.Android, & PCL projects)
<ItemGroup>
<Compile Include="RazorTemplate.cs">
<DependentUpon>RazorTemplate.cshtml</DependentUpon>
</Compile>
</ItemGroup>
<ItemGroup>
<None Include="RazorTemplate.cshtml">
<Generator>RazorTemplatePreprocessor</Generator>
<LastGenOutput>RazorTemplate.cs</LastGenOutput>
</None>
</ItemGroup>
Example (NetStandard 2.0 project)
<ItemGroup>
<Compile Condition=" '$(EnableDefaultCompileItems)' == 'true' " Update="RazorTemplate.cs">
<DependentUpon>RazorTemplate.cshtml</DependentUpon>
</Compile>
</ItemGroup>
<ItemGroup>
<None Update="RazorTemplate.cshtml">
<Generator>RazorTemplatePreprocessor</Generator>
<LastGenOutput>RazorTemplate.cs</LastGenOutput>
</None>
</ItemGroup>
This is not the answer as I misunderstood the question so the answer is actually what #SushiHangover put above...
To get the Xamarin Razor pages the project has to be a WebViewApp and then you can add New PreProcessed Razor View to the project.
From the Xamarin Blog on the subject.
See our Building Hybrid apps with Xamarin documentation to get started building Razor Hybrid applications. Simply use Xamarin Studio to create a new WebView Application for iOS or Android, or add a WebView to any existing iOS or Android layout, and use Add New…Preprocessed Razor Template to incorporate Razor-powered web views into your Xamarin apps. For a slightly more complex sample of a data-driven Razor hybrid app, check out our RazorTodo app.
The documentation can be found here
More detail here as this details how to add the Razor view to each project.
For Visual Studio 2022 I refer you to this answer that worked for me:
https://stackoverflow.com/a/41116061/812013
When I entered 'RazorTemplatePreprocessor' for the file's custom tool as the answer suggests, I initially didn't notice that Visual Studio opens a dialog asking you to install a ASP .NET extension first. Once I installed this extension, I was then getting a cs file generating from a cshtml file.
Related
I have a C# project that I would like to include both .razor files and WPF .xaml files inside. This is a plugin project (ClassLibrary) that provides extensions to two apps: a web server hosting razor pages and a WPF desktop application. I would like to avoid having 2 different .csproj projects for this single plugin (and the overall application has numerous plugins so the additional project count would become substantial).
My project is currently targeting net5.0-windows TFM. For WPF support I use <Project Sdk="Microsoft.NET.Sdk" /> and set <UseWPF>true</UseWPF>. This works as expected and my .xaml files are identified as Page files and compile correctly. In order to get the compile to understand the .razor files I change the SDK to <Project Sdk="Microsoft.NET.Sdk.Razor" />. When making this change, however, the compilation of the .xaml/.xaml.cs files fails.
I have attempted to track down the underlying .targets/.props files used in the SDK to see how to support both what is happening using Microsoft.NET.Sdk.Razor and Microsoft.NET.Sdk with UseWPF=true. I'm hoping someone has figured this out already and can help me out or let me know if it is not possible without separating the functionality into multiple projects.
I have a razor class library (RCL) that contains all the pages from my blazor application. The CSS intellisense does not seem to work within the RCL unless I change the RCL .csproj xml tag From Sdk="Microsoft.NET.Sdk.Razor" To Sdk="Microsoft.NET.Sdk.Web" .
Example: <p class="..(no intellisense is shown if used within an RCL)"
I am using VS2022 with the latest updates. Any information that can help resolve this issue, is appreciated.
I wrote an extension, that tackles this exact problem.
It should solve your problem, as it scans every project that exists in the solution, not just the ones of the type Microsoft.NET.Sdk.Web.
Furthermore, it also adds support for isolated CSS contexts (*.razor.css files), as well as external files, which are linked via the <link> attribute in an HTML file.
You can find more info about it in the GitHub repo.
It seems Blazor css intellisense is not that great. So my work around was to change the .csproj to Sdk="Microsoft.NET.Sdk.Web" reload the solution and then add a "Program.cs" class file to the root with one line of code.
It doesn't matter what that line of code does just add a line of code. In my project I added a variable like var workAround="empty"; to the program.cs file.
Now the css intellisense magically works. It doesn't work that great but it works. Microsoft needs to fix this.
Another thing to add is to close visual studio and delete the .vs folder. This is a hidden folder where you project resides.
First the problem I'm trying to solve. I work on a large team and we are constantly having merge conflicts on our web.csproj file. The solution I was trying to implement was including content files using a wild card.
I'm trying to include all files in a directory in my web.csproj file like so.
<Content Include="Areas\Public\Client\**\*.js" />
<Content Include="Areas\Public\Client\**\*.html" />
<Content Include="Areas\Public\Client\**\*css" />
This works great at first glance. I can see all files matching these patterns in visual studio. The problem is, if someone deletes a files from Visual Studio, the IDE then enumerates ALL files in the csproj file and removes my wildcard lines above.
Have any of you solved this problem or have any suggestions?
Thanks!
This is not possible in VS 2015 without loosing the functionality to add/rename/move/etc. items and keep the wildcards.
The handling of globbing in project files is only impelmented by the new CPS-based project system in VS 2017, which is not (yet) used for "classic" .NET / ASP.NET projects.
There are ways to add the Content items during the build using globbing patterns (using custom targets) but these will not show up in the solution explorer (which is okay for auto-generated files)
I'm writing an application that will enable the creation of SQL files within visual studio. The user will enter commands via the Package Manager console which will generate sql scrips and deposit them in a specific directory within the Visual Studio Project.
The problem I have is that, when the files are generated, they are present on the file system, but not in Visual Studio. This is expected of course, as I need to then go and actively include the files within Solution explorer, but this isn't what I want. I want the files to "Magically" appear in solution explorer immediately after they're generated.
I've seen various solutions to similar problems mostly featuring amendments to the .csproj file such as this
<Compile Include="Sql\**\*.sql" />
but this isn't what i'm looking for. What i'm after is similar to how, for example, Entity Framework or MvcScaffolding work, where files / folders just magically drop into the project when commands run in PMC. I'm aware this runs off T4 templating, but that seems like too complex a solution for a simple issue like this.
I should qualify that there's no voodoo going on in the creation of the files, just plain old File.Create() stuff.
I'm open to any suggestions.
Thanks.
Check out this answer for a solution that worked for me. I have the same use-case where code outputs flat files and I need to include this output in the project.
At the end of your .csproj file add the following:
<Target Name="BeforeBuild">
<ItemGroup>
<Content Include="Sql\**\*.sql" />
</ItemGroup>
</Target>
IMHO, T4 is the way to go. You don't want to be bothering with older technologies for what you are trying to do.
Having said that, I wonder why is it required for the files to be added to the solution explorer? is it for source control purposes? (usually you don't want to source control auto generated files, you want to source control the original model).
Note that you could always click the 'show all' button and the files will appear in the solution explorer, without actually being a part of the solution.
Has anyone done any development of Compass for CSS/SASS in a standard C# ASP.NET environment?
Is there a single distribution I can just download that's ready to go for Windows or do I need install every piece of the equation and build compass myself?
Are there any plugins that make developing with Compass friendlier with VS2008 such as automagical handling of Compass/SASS in builds, syntax highlighting, and/or intellisense support?
If there aren't any VS IDE plugins what are the best options for a standalone text editor for handling coding in Compass?
To complete the last answers, you can install Web Workbench, a plugin for Visual Studio 2010 wich add syntax highlighting, intellisence and some other stuff for the SASS language (SCSS syntax only).
If you prefer using Compass and/or some other tools to compile your CSS, you should disable the built-in compiler. I listed some other SASS compilers here: Using SASS with ASP.NET.
To disable the built-in compiler: select the .scss file in Solution Explorer, go to the Properties window and delete the text from the Custom Tool box.
Since Web Workbench 3 you can now manage more easily what you want to compile with this plugin. See the Mindscape > Web Workbench Settings menu item.
Getting started with Compass,
First yes I have to install Ruby and the compass source and compile up my version of compass I followed the instructions on Compass's Wiki Getting Started.
After getting Compass and all it's dependencies installed and built I created my first project.
compass -f blueprint project-name
Which creates a default project with compass for the blueprint css framework, currently there's a bug in compass with the creation of the grid.png file in the images directory for compass so you need to copy the original grid.png from the source folder
C:\Ruby\lib\ruby\gems\1.8\gems\chriseppstein-compass-0.8.10
\frameworks\blueprint\templates\project
Or similarly located file depending on where you installed everything. One of the most important changes IMO for working with compass on asp.net is to change the SASS CACHE directive of compass. The SASS CACHE creates a bunch of temporary folders in your project directory which probably would have poor outcomes if they ended under source control. So open up config.rb and add this line
sass_options = {:cache_location =>
"#{Compass.configuration.project_path}\\tmp\\sass-cache"}
Make sure to note the escaped backslashs.
After this I modified the names of the folders that compass uses for how I wanted them named inside the config.rb and started getting to it with SASS and Compass. I recommend watching the hour long introduction to compass video it's very helpful and I learned alot from it: Watch the screen cast.
One of the things which this showed me was how to set compass to watch for file system changes and automagic compile the sass to css. By using
compass -w
This is working real well for me, just make sure you keep your css files checked out or turn them off read only if they're under source control if your project doesn't support concurrent checkouts.
For editing I'm using SciTE that's included with Ruby by default for the config.rb files or just the editor window in VS2008. For Sass I came across a big list on the HAML website. jEdit with highlighting syntax file for SASS was what I ended up using after trying a few. I'd still like to find a VS plugin for syntax highlighting so I don't need to use another editor but jEdit is definitely getting the job done.
My answer is a bit antiquated. Before following my original answer, I would recommend exploring the Nuget package SassAndCoffee. The full details can be found here.
How does it work?
SassAndCoffee embeds the original
compilers in the DLL as (Sass 3.2.0
and CoffeeScript 1.1.0 as of this
writing) and uses IronRuby and
Jurassic respectively to execute the
compilers against your source.
Why is
this better than [SOMEOTHERPROJECT]?
No external processes are executed
You don’t have to install Ruby or node.js
It’s in NuGet so you don’t have to fiddle with web.config
Files are cached and are rebuilt as-needed.
I wanted to add another alternative here. If you just want to ensure that compass builds the sass files and includes the css files when you build your ASP.net project you can add the following to your project(csproj) file under the project section:
<Target Name="AfterBuild" Condition="'$(Configuration)' == 'Release' ">
<Exec Command="compass compile --output-style compressed --force" />
<ItemGroup>
<Content Include="Styles\*.css" />
</ItemGroup>
</Target>
<Target Name="AfterCompile" Condition=" '$(Configuration)' == 'Debug' ">
<Exec Command="compass compile" />
<ItemGroup>
<Content Include="Styles\*.css" />
</ItemGroup>
</Target>
The first Target is for Release and will also compress the css, the other one is for Debug.
If you want to customize paths add a config.rb to the project root folder:
css_dir = "Content"
sass_dir = "Content/Sass"
This all of course requires compass and ruby to be installed and to be in the path of your machine.