Exclude folders on publish project using "dnu publish" - asp.net

How can I exclude folders from wwwroot using "dnu publish" command.
Example: in my project exists many folders
I need exclude wwwroot/lib and wwwroot/source.
I´m using clr 1.0.0-beta7-12302

The wwwroot folder is treated differently. It is called a webroot. The content in this folder doesn't go through globbing during publish (see here). It is recommended that source code and output are put out of the webroot.
Do you have scenario that you have to store source codes and binaries in this folder?

Within the Project.json file it looks like you can specify which files you would like to exclude when publishing using the publishExclude property in the sources section. https://github.com/aspnet/Home/wiki/Project.json-file#sources

I too was looking for a way to exclude the wwwroot/lib directory from being published and I came across this post from Scott Hanselman. In the post he shows how to change the storage location of bower components (ex. from wwwroot/lib to /bower_components).
For me this removed the wwwroot/lib directory, so these libraries are no longer published. I just thought I would throw this here in case someone may be able to use it.

MS dropped support for bower_components and node_modules exclusion in .NET Core 1.0 RTM. The best I was able to achieve was just to exclude the /src folders so the publish size could be reduced.
Project.json (Excluding Bower Components SRC files)
"publishOptions": {
"include": [
"wwwroot",
"Views",
"Areas/**/Views/**",
"appsettings.json",
"web.config"
],
"exclude": [ "wwwroot/**/src/**" ]
}

Related

How to copy Blazor CSS Isolation file to wwwroot folder at build?

Currently building on a plugin system with Blazor integration, I'm referencing the RCLs' components at runtime. So far so good, I've been able to overcome most issues (routing, activation, lifetime, interop, and most basic static web assets issues thinkable).
But now I'm running up a snag whilst trying to support Component CSS Isolation.
Indeed, the output file project.styles.css or its known counterpart project.bundle.scp.css aren't picked up by the ASP.NET Core runner, that has understandably no idea how to reference the dev paths in the buildtime-generated project.staticwebassets.runtime.json file (here's a small snippet) :
{
"ContentRoots": [
"D:\\source\\project\\wwwroot\\",
"D:\\source\\project\\obj\\Release\\net6.0\\scopedcss\\bundle\\"
],
"Root": {
"Children": {
"SocialGuard.YC.styles.css": {
"Children": null,
"Asset": {
"ContentRootIndex": 1,
"SubPath": "project.styles.css"
},
"Patterns": null
}
},
"Asset": null,
"Patterns": [
{
"ContentRootIndex": 0,
"Pattern": "**",
"Depth": 0
}
]
}
}
Paths and project name were changed for simplicity's sake
My first try was to figure out how to embed the file into the output .dll file, but running into a humiliating failure, and a big concern for release time NuGet-based deployment.
The big question now lies, as I've already had to compromise quite a bit on paths, is it possible to copy over the CSS Isolation output file straight into the wwwroot folder, at build time?
I'm not very knowledgeable with MSBuild, so I'm praying someone holds some kind of answer to this... ^^
I was trying to get my hands on the same file for different purposes.
Perhaps copying it in wwwroot will help you.
The documentation states the following:
At build time, a project bundle is created with the convention
obj/{CONFIGURATION}/{TARGET
FRAMEWORK}/scopedcss/projectbundle/{ASSEMBLY NAME}.bundle.scp.css,
where the placeholders are:
{CONFIGURATION}: The app's build configuration (for example, Debug,
Release).
{TARGET FRAMEWORK}: The target framework (for example,
net6.0).
{ASSEMBLY NAME}: The app's assembly name (for example,
BlazorSample).
So we can built this exact path with MSBuild properties and copy the file at Visual Studio post build events.
First you can test the path with:
ECHO "$(ProjectDir)obj\$(Configuration)\$(TargetFramework)\scopedcss\projectbundle\$(AssemblyName).bundle.scp.css"
Next you may copy the file to wwwroot
COPY /D /Y "$(ProjectDir)obj\$(Configuration)\$(TargetFramework)\scopedcss\projectbundle\$(AssemblyName).bundle.scp.css" "$(ProjectDir)wwwroot\css\$(AssemblyName).bundle.scp.css"
$(ProjectDir) is the path to your project folder.
$(Configuration) returns either Debug or Release.
$(TargetFramework) returns framework version. For example net5.0.
$(AssemblyName) of course returns your project assembly name, which also by default is the name of your scoped css bundle file.
I think what you're looking for is a Copy build action to trigger after building and bundling the css. So in your example, you would add something like this to the end of your app's csproj file:
<Target Name="CopyCssBundles" AfterTargets="AfterBuild">
<ItemGroup>
// Include path to whatever file(s) you want to copy from RCL, separated by a semi-colon
// Also works with relative paths
// Also allows glob patterns (e.g., ...\scopedcss\**\*.* to include all files in the scopedcss directory)
<MyCssBundles Include="{path_to_RCL_project}\obj\$(Configuration)\$(TargetFramework)\scopedcss\bundle\{RCL_assembly_name}.styles.css" />
</ItemGroup>
// Source files are whatever you named the above tag ("MyCssBundles" in this example)
<Copy SourceFiles="#(MyCssBundles)" DestinationFiles="wwwroot\%(RecursiveDir)%(Filename)%(Extension)" OverwriteReadOnlyFiles="true" />
</Target>
%(RecusriveDir) will preserve the directory tree of whatever files you included based on the include pattern. If you want the files directly in wwwroot you can remove that or you can specify a subdirectory to place them in as well (e.g., wwwroot\css\%(Filename)%(Extension)). If the directory does not exist it will create it when copying.
You can also have multilpe ItemGroup/Copy pairs in the same target if you want to separate things out to be more readable.

How to access the assets folder in angular solution when having different root locations

I am having a css file in my assets/css folder, that needs to access some fonts in the assets/fonts folder. I can make it work localhost by writing url('/assets/fonts/myfont.svg').
On the server this isn't working because the path to the root of my site is mydomain.com/myapp/. I have changed the base from to
Then I have tried:
url('assets/fonts/myfont.svg')
url('~assets/fonts/myfont.svg')
url('./assets/fonts/myfont.svg')
But then the solution won't compile ( Can't resolve 'assets/fonts/myfont.svg')
Thanks very much in advance!
Can you try this url ~src/assets/fonts/myfont.svg
It definitely works for me.
You have to declare all your assets in your angular.json file like for example assets folder which is usually declared by default. That makes your assets folder directly available and after the build process, you would notice assets being transferred in the dist folder. Then to use anything from the assets you would write /assets/img.png. The slash before tells the link to take the directory from the root, whereas assets/img.png can sometimes be interpreted from the current directory.
you have to check angular.json and change the assets root like this
"assets": [
"src/favicon.ico",
"src/assets"
],
and the source root under projects like this:
"sourceRoot": "src",

.Net Core 1.0 Relative Project Dependencies Not Found

I have the project structure:
/src
- common
- common-x
+ project.json
- module-a
- project-a
+ project.json
- project-a-tests
+ project.json
+ global.json
I'm trying to include the common-x project using relative file paths in the global.json file.
The global.json file in the module-a directory is as follows:
{
"projects": [
"project-a",
"project-a-tests",
"../common/common-x"
]
}
and the project.json file in project-a is
{
// Default config options are also in this...
"dependencies": {
"Microsoft.NETCore.App": {
"version": "1.0.1",
"type": "platform"
},
"common-x": {
"target": "project"
}
}
}
project-a-tests has no problem referencing project-a since they are in the same directory, but project-a can't find the common-x project. I receive a "Unable to resolve ..." error from dotnet restore.
I have tried using absolute paths but that doesn't work either. The closest solution so far is to use symlinks but that is not preferable.
Note: This is all being run on Ubuntu 16.04.
You should only need to specify top level folders in your global.json file, since sub-folders will be scanned automatically. Global.json reference.
So your global.json should look like this.
{
"projects": [ "src" ]
}
If you are still getting any dependencies issues that might related to compatibility problems between projects/modules, however I would need to see the exact output you are getting to troubleshoot that.
UPDATE
A few tips that might be useful:
Delete old project.json.lock files
Add a .sln solution file if you don't have one created.
UPDATE 2
As per your comment, the working solution was to move global.json into src folder, and list your top-level folders in the projects array.

Bower ASP.NET Core MVC missing jquery.validate.js file

UPDATE:
Visual Studio - File - New - Project
- ASP.NET Core Web Application (.NET Core) - Web Application
I left the default name WebApplication1
expand the wwwroot folder
expand up to wwwroot/lib/jquery-validation
in the jquery-validation folder we can see this (see img below)
- right click the WebApplication1 project in the src folder
- click on Manage Bower Packages
- Bower Package Manager screen asking to update jquery and jquery-validation (see img below)
clicked Update jquery
**everything looks normal (see img below)
clicked Update jquery-validation
dist folder has disappeared (see img below)
The text below is before I UPDATED this Q
I created an empty ASP.NET Core MVC web application in VS2015CE.
I added the bower.json file, that manages client-side stuff of the app.
Via Bower I downloaded jquery, jquery-validate, jquery-validate-unobtrusive.
Bower created a lib folder in the wwwroot folder.
Somewhere in the ~/lib/jquery-validate/ I should be able to find jquery.validate.js and it's "child" - the jquery.validate.min.js
There were no such files there, so I became suspicious and I created another project, this time a NOT empty web application.
I then compared both jquery-validate folders in the lib folders of the two applications.
My first project (created as EMPTY) has the following folder
structure:
dist folder is not present
My second project (created as WebApplication, NOT empty) has the
following folder structure:
dist folder is present and inside it there's the jquery.validate.js file and also it's child, the jquery.validate.min.js file.
What am I doing wrong? Or is it a bug in VS2015? Or a Bower bug?
You need to run the Grunt file which will build the dist folder for you. The best way I've found to do this right now is to install the Grunt Launcher extension. You can then right click on the package.json file within the jQuery-validation folder and select "NPM Install". That should build the dist folder for you.
I haven't found a way to automate this yet, but I'm sure there is. Just started using Gulp and wasn't using Grunt until I ran into the problem you're having. If someone has some tips there, that would be great. Good luck!
Right click on Bower.json file and select Open Command Line ==> PowerSell
type bower update
That's how I resolved my problem..
If Bower doesn't restore the correct packages:
delete everything from the directory value specified in .bowerrc which is located into your web project folder (e.g. wwwroot/lib)
open Git Bash (Git SCM for Windows -> when installing, choose Git Bash option)
go to your web project folder (where bower.json is located)
run the following:
bower cache clean
bower install
OR
bower update
Below it's an example of bower.json file:
{
"name": "asp.net",
"private": true,
"dependencies": {
"bootstrap": "3.3.7",
"jquery": "2.2.0",
"jquery-validation": "1.14.0",
"jquery-validation-unobtrusive": "3.2.6"
}
}
Unfortunately, none of the above offered solutions worked for me.
The problem was solved by smart people at Microsoft with a VS update or by those working on open source stuff.
Must have been a bug or something.
Anyway, thanks for the help guys..

Bower with Visual Studio Publish

I want to use Bower in an MVC 4 application, developed in Visual Studio 2015. I know when you have a MVC 5 project, with Visual Studio 2015 Update 1, there is a nice UI for Bower management, much like the nuget interface. This part is not really critical.
I am using bower currently - I have npm and bower setup, and I have the package.json and bower.json files in the solution. When you save, Visual Studio automatically runs "npm install" and I have a postinstall step in package.json to run "bower install".
I do not want to put the bower_components into the solution (or source control). What I want is to just keep the json config files, and when you save, all dependencies are retrieved.
This all works fine in development, but what doesn't work is right clicking the Web Project, Publish. Publish does not run "npm install", and does not include files not included in the solution (except it seems to work with nuget packages not included in the solution somehow). The "Publish Web" functionality is how my web applications are deployed to production using IIS deployment.
How can I make Visual Studio Web Publish work with Bower?
An alternative - I have seen there are new hooks for Team System Builds that will run gulp tasks, but I don't know that you can publish directly to IIS in this manner.
instead of referencing/deploying the complete bower_components folder, you can use a gulp or grunt script (pick whatever you prefer) to copy the correct files out of the bower_components folder to something like scripts/lib.
You can then include these files in source control and subsequently deploy them.
The following is a grunt file that I use to accomplish this:
module.exports = function (grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON("package.json"),
copy: {
main: {
files: [
{
expand: true,
flatten: true,
src: [
'node_modules/vss-sdk/lib/VSS.SDK.js',
'node_modules/moment/moment.js',
'node_modules/moment-timezone/moment-timezone.js',
'node_modules/jquery/dist/jquery.js',
'bower_components/datetimepicker/jquery.datetimepicker.js',
'bower_components/datetimepicker/jquery.datetimepicker.css',
],
dest: 'scripts/lib',
filter: 'isFile'
}
]
}
}
});
grunt.loadNpmTasks("grunt-exec");
grunt.loadNpmTasks("grunt-contrib-copy");
};
In ASP.NET Core (ie MVC6), Bower is configured (in a .bowerrc file) to add scripts to wwwroot/lib rather than a bower_components folder. That content does get published by Visual Studio.
The same approach using .a bowerrc file will work for MVC4 webs (at least if you are using Visual Studio 2015). However, it also gets checked into version control so it might not be exactly what you want.
The .bowerrc file can be used to do various things (see http://bower.io/docs/config/). However, to get Bower to add scripts to the project in ~/scripts/lib, you simply add the following json:
{
"directory": "scripts/lib"
}

Resources