ASP.NET Razor Pages JavaScript file returns undefined error

Question

This one's a little tricky, but here goes:

I downloaded some files from a website I'm working on shifting from Wordpress to ASP.NET Razor Pages. In the original files there are an 'assets' folder, a 'lib' folder (containing the font folder and css and js files), as well as the index.html file.

When I open the files and run the index file in my Chrome browser, the web page runs normally (the entire page is very responsive and done in JavaScript, so the .js files are very important). Here's a look at the current page for your reference

When I make the change over to my ASP.NET Razor Pages project, the file runs, but I get the following error:

Uncaught ReferenceError: playerjs is not defined

I go into the code to check it out, but I can't seem to find what's actually wrong with it. There's only one call of playerjs in the entire file. Here's the link to the .js main file if you're interested .

My question: Is there a protocol when moving a regular .html file and its accompanying .js files from a Wordpress site to an ASP.NET Core site?

I wonder if it's due to the fact that I'm working with a .CSHTML file and its accompanying .CSHTML.CS file. This is pretty confusing.

Any help on this would be greatly appreciated!

Answer 1

As @itminus pointed out. The js files did not load correctly because I was using the default layout partial page. I assume that the js files were competing with other js files. I discovered that moving your conventional .html file, and its corresponding files, is as easy as copying and pasting, but you have to do it right.

Here's how to do it:

1. In your Pages folder, create a new folder that is going to house the .cshtml file
2. In that folder, add a new razor page, but make sure you uncheck the layout option
3. Copy the code in your .html page and paste it into your .cshtml file
4. Make sure you place your js and css files in the wwwroot folder
5. Also make sure you point your links and scripts properly
6. If you point to something in a js file or script, then make sure you grab the root url and point that toward the right files

I hope that helps someone that just isn't thinking about the Layout page getting in the way.

Thanks to all who were willing to help!