Use Blazor JS Initializers to include nimble-components JS
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 39
- Forks
- 14
- Avg merge
- 1d 16h
- Merged PRs (30d)
- 13
Description
📌 User Story
Originally suggested here: https://github.com/ni/nimble/pull/517#discussion_r859198476
Blazor supports JS initializer files, which can be named libraryName.lib.module.js to automatically be included in Blazor projects that reference libraryName (it's both automatically included in wwwroot, and in the Blazor-generated HTML pages for the app).
We might be able to use this feature to automatically include the nimble-components JS for clients, which they currently need to do manually:
<head>
<link href="_content/NimbleBlazor.Components/nimble-tokens/source/fonts.css" rel="stylesheet" />
</head>
<body>
<script src="_content/NimbleBlazor.Components/nimble-components/all-components-bundle.min.js"></script>
</body>
To do that, our NimbleBlazor.Components.lib.module.js file would look something like
import 'nimble-components/all-components-bundle.min.js';
export function afterStarted(Blazor) { /* existing custom event registration code */ }
Then run it through Rollup.
Our font CSS wouldn't be automatically pulled in without additional work.
Optimally there'd be a way for clients to opt out if they only wanted to depend on a few Nimble controls, not all of them.
Needs vetting/ opinion of @atmgrifter00 when he's back (for overall idea + opinion of likelihood that clients would want to create their own smaller Nimble bundles)
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the proposed NimbleBlazor.Components.lib.module.js initializer and the existing custom event registration code, then review how Rollup handles the nimble-components bundle. Done means clients receive the all-components-bundle automatically while the opt-out and font CSS limitations have a documented or agreed approach.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, rollup
- Domain
- build-system, frontend
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100