Last post Jun 14, 2018 08:00 AM by vahid bakkhi
Jun 12, 2018 04:28 AM|pointtoshare|LINK
In my my SharePoint provider hosted app developed by MVC 5 Razor, all styles are working fine locally, i.e. CSS and JS files are loaded correctly but when I debug/deploy it to SharePoint online, most of the CSS and JS files are not loaded, returns
404 not found error, the reason why all my page styles and functionalities are malfunctioning. Few of them are loading. I have no idea why this is happening. Please help me to resolve the issue.
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />
<link href="~/Content/themes/base/datepicker.css" rel="stylesheet" />
<link href="~/Content/themes/base/jquery.ui.core.css" rel="stylesheet" />
<link href="~/Content/themes/base/jquery.ui.datepicker.css" rel="stylesheet" />
<link href="~/Content/themes/base/jquery-ui.min.css" rel="stylesheet" />
<link href="~/Content/themes/base/jquery.ui.theme.css" rel="stylesheet" />
@RenderSection("scripts", required: false)
Razor Index Page:
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<link href="~/Content/Bootstrap.min.css" rel="stylesheet" />
// Use the development version of Modernizr to develop with and learn from. Then, when you're
// ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
"~/Scripts/bootstrap-datepicker.js", // ** NEW for Bootstrap Datepicker
"~/Content/bootstrap-datepicker.css", // ** NEW for Bootstrap Datepicker
Jun 12, 2018 05:58 AM|vahid bakkhi|LINK
because your reference can't find the files in your publishing path, you said in local it was correct but when you moved them to SharePoint host it does not work,
you must be sure about your path and check in your SharePoint host exists your JS and CSS files
Jun 12, 2018 07:24 AM|pointtoshare|LINK
Thanks for your response. My folder structure is line-
Surprisingly, anything in Base folder is being loaded properly but nothing being loaded from any other folder. Nothing is loading from
Script folder as well. I have picked the right path on my Layout and other pages. I have tried creating new folder, putting files under it and picking the new path layout and Razor page but din't work. I have no idea what is going on.
Jun 12, 2018 07:29 AM|vahid bakkhi|LINK
is your site available on internet?
if yes please send me your domain address
Jun 12, 2018 08:15 AM|pointtoshare|LINK
The site is in debugging environment, and its internal. I have already shared all related files and the situation, nothing other than that.
Jun 12, 2018 08:31 AM|vahid bakkhi|LINK
in your URL write below address
for my is localhost:55862/Scripts/jquery-3.3.1.min.js
The first the test above URL and if your resource exsist in your host, you must see in your browser the js content
and let's tell me again
Jun 12, 2018 09:09 AM|pointtoshare|LINK
I get the following error while accessing the file through browser-
Description: HTTP 404. The resource you are looking for (or one of its dependencies) could have been
removed, had its name changed, or is temporarily unavailable. Please review the following URL and make sure that it is spelled correctly.
Requested URL: /Scripts/jquery-3.1.1.min.js
But , I checked the file exists in the location.
Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.7.2053.0
Jun 12, 2018 09:13 AM|vahid bakkhi|LINK
this means your resource is not exsist on that path
Jun 12, 2018 09:21 AM|pointtoshare|LINK
I have checked multiple times, the file is there and I can pick it from all of my razor pages. That's the wired thing happening to me.
Jun 12, 2018 09:27 AM|vahid bakkhi|LINK
your mean is, you can get the resource from Razor page but have a problem with Layout page?
Jun 12, 2018 09:35 AM|pointtoshare|LINK
I mean, I can link the files from any page including layout page during coding, as the files exists in the directory but get 404 error while access through any browser. For example, I linked it in all pages from directory the following way
Jun 12, 2018 09:52 AM|vahid bakkhi|LINK
can you please take a photo from your structure of your folder in your host location
Jun 13, 2018 08:05 AM|Nan Yu|LINK
Hi pointtoshare ,
May i confirm that you have linked the js/css and the function/css works in your application , but when directly accessing the js file , it shows 404 error ? Have you tried to check links using chrome F12 Developer Tools , the css/js file will return
the absolute path.
Jun 14, 2018 05:33 AM|pointtoshare|LINK
I have checked with F12 developer tools, the returned path contains the files, this is over sure. i have the following structure-
Anything under base
folder is being loaded but non other folder scripts/css/images are being loaded. If I create any folder under
base doesn't work. Only files directly under
base folder are being loaded, so strange.
Jun 14, 2018 08:00 AM|vahid bakkhi|LINK
You said in your first post . It works on local but not works on server. That means your publish file in your host aren't in right place. You must check your path in host and also you can set a static url for your resourse for test. For example go to your
host panel and get your bootsrap.css physical path e.g:
And set above path in your project reference and try it . If the browser detect it . We know your path is wrong otherwaise try other solution