IndexOutOfRangeException on Scripts.Render Bundle - bundles

I have the following in my BundleConfig.cs file to set up two bundles that I am trying to render.
bundles.Add(new StyleBundle("~/bundles/bootstrap").Include(
"~/Scripts/bootstrap.js",
"~/Scripts/bootstrap.min.js"));
bundles.Add(new StyleBundle("~/bundles/knockout").Include(
"~/Scripts/knockout-3.2.0.debug.js",
"~/Scripts/knockout-3.2.0.js",
"~/Scripts/knockout.mapping-latest.debug.js",
"~/Scripts/knockout.mapping-latest.js"));
Then I have this my shared layout to render the bundles, but I keep getting "IndexOutOfRangeException errors on these two lines:
#Scripts.Render("~/bundles/bootstrap")
#Scripts.Render("~/bundles/knockout")

It was a stupid mistake. Those were supposed to be ScriptBundles but I used StyleBundles.
It works now.

Related

Swashbuckle.AspNetCore .NET 6.0 blank swagger site

I am trying to setup swagger for the product I'm developing and cannot wrap my head around it.
I started with the most basic config as described here. The swagger.json was generated correctly under https://localhost/MyWebAPI/swagger/v1/swagger.json, but when navigating to https://localhost/MyWebAPI/swagger/index.html I get a blank site. Did some digging and most of the answers were revolving around setting up SwaggerEndpoint, RoutePrefix or some uri templates but none of them worked for me so I finally did what should have done in the first place and checked code of the site itself.
It is there... The url's seems correct:
var configObject = JSON.parse('{"urls":[{"url":"v1/swagger.json","name":"MyApp v1"}],"deepLinking":false,"persistAuthorization":false,"displayOperationId":false,"defaultModelsExpandDepth":1,"defaultModelExpandDepth":1,"defaultModelRendering":"example","displayRequestDuration":false,"docExpansion":"list","showExtensions":false,"showCommonExtensions":false,"supportedSubmitMethods":["get","put","post","delete","options","head","patch","trace"],"tryItOutEnabled":false}');
var oauthConfigObject = JSON.parse('{"scopeSeparator":" ","scopes":[],"useBasicAuthenticationWithAccessCodeGrant":false,"usePkceWithAuthorizationCodeGrant":false}');
// Workaround for https://github.com/swagger-api/swagger-ui/issues/5945
configObject.urls.forEach(function (item) {
if (item.url.startsWith("http") || item.url.startsWith("/")) return;
item.url = window.location.href.replace("index.html", item.url).split('#')[0];
});
The issue is and I kid you not the line with interceptors that is actually split into several lines and the browser wouldn't recognise it as a correct string.
Obviously I tried to pass null as the entire section, but that just brakes everything two lines later. I am in shambles...
I tried with several versions of Swashbuckle (currently using 6.5.0, but tried with some previous ones starting from 6.1.5). Any ideas how to fix it as I guess this must be generally working but there's just something weird/wrong that I'm missing.
Right... one of the most stupid things I've encountered lately. I started reading Swashbuckle source code and the only class that when serialised wouldn't get the JsonSerializerOptions as defined in Swashbuckle project is InterceptorFunctions, so it used mine... and mine would have WriteIndented set as true...

MVC Core 2.2 Image not displaying, 404 returned

MVC core 2.2 C#
What am I doing wrong?
I have been searching the web and seems I am following all advises. This isn't a complex situation, nonetheless it is not working.
The image shows all the setup.
Image loaded in Image\logo.png
Using #URL.Content
I licked also in "Publish image" if it made any difference.
Image here:
https://imgur.com/GQnj9kg
Any thoughts?
As no one answered...
Seems that you have to do more stuff in Core 3.1 than just calling the image. Images are now considered "static files" and you have to tell your application they exist:
On startup.cs
app.UseStaticFiles();
app.UseStaticFiles(new StaticFileOptions()
{
FileProvider = new PhysicalFileProvider(
Path.Combine(Directory.GetCurrentDirectory(), #"Images")),
RequestPath = "/Images"
});
Also make sure that the image properties say "Copy To Output Directory":"Always", because this thing simply doesn't add the image to your build unless you tell it to do it.

Problem configuring CKEDITOR in Magnolia RichTextField

I can't customize toolbar buttons in Magnolia's RichTextField
in Yaml file add configJsFile: /ckeditor/configJsFile.js pointing to config file under resource folder in java module project
- name: text
class: info.magnolia.ui.form.field.definition.RichTextFieldDefinition
configJsFile: /ckeditor/configJsFile.js
i18n: true
once configJsFile.js added RichTextField start showing up all imaginable buttons and it is too many
I tried to remove some buttons groups in configJsFile.js even comment out all content inside config funtion CKEDITOR.editorConfig = function( config ) { ... } that's make any effect.
Any idea how I can configure toolbar content in Magnolia's RichTextField?
Here is original configJsFile.js taken from Magnolia doc site
Which version of Magnolia are you using?
Worst case scenario you can change the default settings from
'ckeditor/config-default.js'
Hope that helps,
Cheers,
I was wrong assuming that magnolia pointed to java resources.
Once I put CKEditor config file into folder from magnolia properties I've got what I wanted
see magnolia.resources.dir=${magnolia.home}/modules

WebPack in VS2015: How to configure a new pack?

I've started with a template from this extension to have a running angular2+ .net core starting point. I didn't want to use boostrap, but materialize-css, so I removed the bootstrap package in package.json, instead I added "materialize-css": "0.98.0",
Then I edited the webpack.config.vendor.js, I removed bootstrap and added materialize-css to the "vendor" list.
Then I rebuilt everything, but it seems that materialize-css is still not present(cannot find its css classes). I tried to clear the browser cache, tried even to open on a brand new browser(edge), but still, no materialize-css classes.
What did I miss?
EDIT
Currently, my vendor list is the following:
vendor: [
'#angular/common',
'#angular/compiler',
'#angular/core',
'#angular/http',
'#angular/platform-browser',
'#angular/platform-browser-dynamic',
'#angular/router',
'#angular/platform-server',
'angular2-universal',
'angular2-universal-polyfills',
'materialize-css',
'es6-shim',
'es6-promise',
'jquery',
'zone.js',
]
You're doing everything correctly, just need to do one thing slightly differently. In your webpack.config.vendor.js, instead of materialize-css, add materialize-css/dist/css/materialize.css to the vendor array:
...
entry: {
vendor: {
...
'materialize-css/dist/css/materialize.css',
...
}
}
This will include the css to your resulting bundle. If you also need fonts and js from materialize-css, you'll need to configure appropriate loaders, see https://www.npmjs.com/package/materialize-loader

js in html is not executing in Phoenix framework sample app

I'm playing around with the phoenix framework. I copied the chat example entirely but I'm not getting any results.
In fact when I write console.log("testing") in my app.js I notice that my console does not log anything...
I am getting the error referenced in this link:
phoenix framework - invalid argument at new Socket - windows
However that error seems to be related to Brunch not working in windows. When I brunch build, I can confirm that app.js has the console.log("testing") that I included.
Nevertheless, I don't see that console log when I visit my localhost:4000.
Why is JS not executing?
Turns out the guide is missing a key line that made it not work.
The guide has the following:
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="<%= static_path(#conn, "/js/app.js") %>"></script>
</body>
But that is missing the below line which you can put above the body tag.
<script>require("web/static/js/app")</script>
Even as Chowza already solved this question I would like to propose another, possible cleaner solution, using the autoRequire feature of Brunch.io.
The problem occurs because Brunch.io does not autoRequire the app.js under Windows correctly. Chowza worked around this issue by requiring the file manually in the html. You can omit the manual require if you alter the /brunch-config.js as follows: Change from
modules: {
autoRequire: {
"js/app.js": ["web/static/js/app"]
}
}
To
modules: {
autoRequire: {
"js/app.js": ["web/static/js/app"],
"js\\app.js": ["web/static/js/app"]
}
}
This way the app.js is autoRequired, even if you work on a Windows based system.
I would like to mention, that this solution is based on the link Chowza himself posted, so all credit goes to him for pointing to the link.

Resources