VirtualFileSystem for Script Page

I have a simple page calling a partial. Inside the partial I want to loop over a folder:


For simplicity I have this code below for all intents isn’t searching the sub folder because I couldn’t even get this to work with the root wwwroot folder. It always shows a 0 count and no files not matter what I put in the vsFileSystem param.

{{vfsFileSystem(".") |> to => fs}} - tried wwwroot and all diferent variations
{{ fs.allFiles() |> sliders }}
{{ sliders.count() }} always 0
{{#each slide in sliders}}
{{ slide | textDump }}

I tried adding

WebHostPhysicalPath= MapProjectPath("~/wwwroot"),
as well as

I’m not sure what I’m missing here. Any ideas, just a simple .net core app from scratch.

If you’re using SharpPagesFeature, it’s configured to use your AppHost’s VirtualFileSources which is configured to use your WebRoot, i.e. wwwroot.

So you should be able to get all files from dirFiles('img/sliders').

Yes, using SharpPagesFeature.

Updated code to:

{{vfsFileSystem(".") |> to => fs}}
{{ fs.dirFiles('img/sliders') |> sliders }}
{{ sliders.count() }}  --> 0 files
{{#each slide in sliders}}
{{ slide | textDump }}

Still shows 0 count, no files found. Is there a way for me to troubleshoot this someway?

The files are there b/c the slider is hard coded below this which is what I’m trying to replace.

I also checked this and the files are there:

AfterInitCallbacks.Add(host => {

            var files = GetVirtualFileSources().First(x => x is FileSystemVirtualFiles);
            foreach (var f in files.GetAllFiles()) {


Don’t use fs, just use what I’ve shown, i.e. just dirFiles('img/sliders') which is configured to use your AppHost’s Virtual File Sources.

The #Script VFS docs + scripts are at:

Replaced with:

{{ dirFiles('img/sliders') |> sliders }}
{{ sliders.count() }}
{{#each slide in sliders}}
{{ slide | textDump }}

Still no dice. Even if I put dirFiles('.'), allFiles() and every other one I tested, it still shows a 0 count.

The metadata debug inspector shows:

VirtualFiles Path C:\projects\git\other\cc4c-night-web\cc4c\cc4c
VirtualFileSources Path C:\projects\git\other\cc4c-night-web\cc4c\cc4c\wwwroot

Not sure how to troubleshoot this.

You need to use the to or assignTo script to assign a value, i.e:

{{ dirFiles('img/sliders') |> to => sliders }}
1 Like

Sometimes late night coding doesn’t mix well with syntax. Thanks for the feedback here. Since using the script apps/pages I wonder if it is possible to add an overload for the to=> syntax.

{{ allFiles() |>= variable }} without having to add the to=>. Just an idea to consider although the explicit to is probably clearer with its intent and doesn’t break the front end compatibility.

The pipeline operator is a fundamental construct in #Script which was expressly added as an extension to #Script JavaScript Expression support because of the clarity it adds, especially in template generation, where it’s often included in template languages.

As with every language that supports the pipeline operator, the target must always be a function, i.e:

{{ allFiles() |>= fn }} 

This concise syntax alleviates the need for requiring special syntax for other constructs like assignment, e.g. to and assignTo are simply just functions that you could implement yourself.

You’re asking to throw away the behavior of the pipeline operator (the most used an important construct in #Script) and replace it to be used as an assignment operator. No that is not possible.

FYI I’ve just added support for JavaScript variable declarations and assignment expressions in the latest v5.8.1 of #Script which will let you declare and assign variables with:

{{ var sliders = dirFiles('img/sliders') }}

See the announcement post for more examples.

1 Like