Menu
I want to deploy an ASP.NET Core web application via publishing profiles in Visual Studio 2017. Everything is copied to the destination folder and works fine, except the "site.js" file. In the destination folder, I see in the wwwroot/js folder both site.js and site.min.js, but the latter is empty. I also get a console error in the browser:
Failed to load resource: the server responded with a status of 404 (Not Found)
site.min.js
In page source however I see the file loaded correctly:
<script src="/wwwroot/js/site.min.js"></script>
Program.cs file:
public class Program
{
public static void Main(string[] args)
{
var host = new WebHostBuilder()
.UseKestrel()
.UseContentRoot(Directory.GetCurrentDirectory())
.UseIISIntegration()
.UseStartup<Startup>()
.Build();
host.Run();
}
}
Service configuration in Startup.cs:
public void ConfigureServices(IServiceCollection services)
{
services.AddMvc();
}
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
app.UseStaticFiles();
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
app.UseBrowserLink();
}
else
{
app.UseExceptionHandler("/Home/Error");
}
app.UseMvc(routes =>
{
routes.MapRoute(
name: "default",
template: "{controller=Home}/{action=Index}/{id?}");
});
}
_Layout.cshtml:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Dashboard</title>
<environment include="Development">
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" />
</environment>
<environment exclude="Development">
<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css"
asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
<link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
</environment>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a asp-area="" asp-controller="Home" asp-action="Index" class="navbar-brand">Home</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a asp-area="" asp-controller="Home" asp-action="Create">View orders</a></li>
</ul>
</div>
</div>
</nav>
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© 2018 - test app</p>
</footer>
</div>
<environment include="Development">
<script src="~/lib/jquery/dist/jquery.js"></script>
@*<script src="~/lib/jquery/jquery-validation/dist/jquery.validate.js"></script>*@
<script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
<script src="~/js/site.js"></script>
</environment>
<environment exclude="Development">
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.2.0.min.js"
asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
asp-fallback-test="window.jQuery"
crossorigin="anonymous"
integrity="sha384-K+ctZQ+LL8q6tP7I94W+qzQsfRV2a+AfHIi9k8z8l9ggpc8X+Ytst4yBo/hH+8Fk">
</script>
<script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/bootstrap.min.js"
asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.min.js"
asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal"
crossorigin="anonymous"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa">
</script>
<script src="~/wwwroot/js/site.min.js" asp-append-version="false"></script>
</environment>
@RenderSection("Scripts", required: false)
</body>
</html>
The site.js is in the wwwroot/js folder (I didn't move it or recreate it). I didn't change the bundleconfig.json either. Its content is the following:
[
{
"outputFileName": "wwwroot/css/site.min.css",
// An array of relative input file paths. Globbing patterns supported
"inputFiles": [
"wwwroot/css/site.css"
]
},
{
"outputFileName": "wwwroot/js/site.min.js",
"inputFiles": [
"wwwroot/js/site.js"
],
// Optionally specify minification options
"minify": {
"enabled": true,
"renameLocals": true
},
// Optionally generate .map file
"sourceMap": false
}
]
Is it something that I am missing out? Thank you in advance.
UPDATE:
I changed the site.min.js script tag:
<script src="~/js/site.min.js" asp-append-version="true"></script>
I no longer get the 404 error, but the site.min.js is still empty and therefore is a minification issue.
UPDATE 2:
site.js content:
$('#chkMinId').change(function () {
var checked = $(this).is(':checked');
var target = $('#txtMinId');
console.log(checked ? 'yes' : 'no');
if (!checked) {
target.prop('disabled', true);
} else {
target.removeAttr('disabled');
}
});
$('#chkMaxId').change(function () {
var checked = $(this).is(':checked');
var target = $('#txtMaxId');
console.log(checked ? 'yes' : 'no');
if (!checked) {
target.prop('disabled', true);
} else {
target.removeAttr('disabled');
}
});
286
Static files are stored within the project's web root directory. The default directory is {content root}/wwwroot , but it can be changed with the UseWebRoot method. For more information, see Content root and Web root.
in the wwwroot folder as shown below. You can access static files with base URL and file name. For example, we can access above app. css file in the css folder by http://localhost:<port>/css/app.css .
IWebHostEnvironment is included in the Microsoft. AspNetCore. Hosting package, you simply need to add it as a reference to your project by right clicking on your project file and selecting 'Manage Nuget Packages' then searching for Microsoft.
site.min.js 404 error:Change your site.min.js script tag to
<script src="~/js/site.min.js" asp-append-version="true"></script>
The wwwroot indicates where the 'root' is on the web server rather than the filesystem.
site.min.js:You have to install a nuget package called BuildBundlerMinifier. After installing this package, I saw my site.min.js file get populated with the code in site.js.
I found this from reading this helpdoc: Build-time execution of bundling and minification
111
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
