How to publish parallel plugin version streams of an npm package - vue.js

I'm maintaining a library (MyLib) published on npm that is a vuejs plugin. When I started this library, vuejs was at major version 2.x.x. vuejs now has a new major version 3.x.x that changed how plugins work.
Both 2.x.x and 3.x.x versions of vuejs are supported and will be for a while longer. I want my plugin library (currently version 5.x.x) to be available and supported for both.
Options I've seen or considered so far:
Have 5.x.x as the last version that supports vuejs#2 and 6.x.x and above for vuejs#3.
Easy enough
Doesn't allow me to release a new version with breaking changes that supports vuejs#2 ever if I follow semver rules.
Create a version 6.x.x of my library that supports both versions of vuejs.
Potentially possible, depending on the specifics.
Makes my library bloated because it needs to support both versions of vuejs and have (flaky) runtime version detection to choose the right code path.
Publish a separate library (e.g. MyLib-v2) that supports vuejs#3. Can possibly use a scoped package, but that would force users of 5.x.x of my library to change their dependency name with very poor discoverability.
Not sure how to manage this in a single repo. Monorepo?
Clunky, higher overhead
Is there a better way, or at least a not-awful way of managing publishing my library in this seemingly common scenario?

Use vue-demi. It lets you publish for both vue2 and vue3 in the same project. When using vue2, you have will access to the composition api as well.
https://github.com/vueuse/vue-demi
From the read me:
Vue Demi (half in French) is a developing utility
allows you to write Universal Vue Libraries for Vue 2 & 3

Related

Best practice for updating #vue/cli-plugin-unit-jest

I am using the following and want to know what is the best practice to update them? Can I change one, #vue/cli-plugin-unit-jest for example, and the rest update too?
#types/jest": "^24.0.19"
#vue/cli-service": "~4.5.0",
#vue/test-utils": "^1.0.3````
You'd have to upgrade the dependencies all individually and ensure you're using versions that are compatible with one another. However, vue-cli is being replaced by create-vue so if you're planning to upgrade your app you may want to follow the migration guide created by the Vue devs and go with their recommendations.
Here's the guide
And here's what the Vue.js team is currently saying about vue-cli
Vue CLI is the official webpack-based toolchain for Vue. It is now in maintenance mode and we recommend starting new projects with Vite unless you rely on specific webpack-only features. Vite will provide superior developer experience in most cases.

How to make a buildable publishable library with Nx that is framework agnostic for browser and node.js

I have a monorepo (Nx Workspace) that has many libraries that were generated with #nrwl/js. These libraries depend on each other. They are small utility libraries that I intend to publish on NPM as separate packages.
According to Nx docs:
#nrwl/js is particularly useful if you want to
Create framework agnostic, just plain TypeScript libraries within an existing Nx workspace (say to use in your React, Node or Angular app)
Publish TypeScript packages to NPM
Yet, I now realize that the build command associated with #nrwl/js does not take into account a library's dependencies on other libraries in order to include them as peerDependencies into its publishable package.json. It also looks like it is making just a simple commonjs build that would be compatible with node.js but not with browsers.
I know that #nrwl/angular takes care of all that stuff for you when you build a library with it if you had marked it as publishable. My question is how do I get the same behavior but for a library that is not meant for Angular but for general purpose Javascript use in any framework or environment.
It's still early in development so if a solution to my problem would involve regenerating the libs using some other Nx generator, it wouldn't be too much of a hassle for me to do so, and I'd consider it.
Edit
I have since changed the build executor to #nrwl/node, which has the buildable and publishable options and behave the way I need.
I believe that #nrwl/js will eventually gain that ability but as of 2022-01-05 it didn't have it. For now, someone looking to publish libraries on NPM probably should use #nrwl/node to generate his new library projects and not #nrwl/js
If you want to publish a NPM package as a "universal package" to be consumed by Node.js and the browser, you would need to build it as UMD, to cover most consumer environments.
Though modern browsers support ES modules (import and export), you might need extra setup steps to consume them.

Best way to import Javascript packages in .NET core app

I'm new to the .NET Core framework and currently setting up a dashboard that uses Razor pages and some JavaScript interactions. For the few example projects I've created none of them came with a package manager from the get go, which imho is needed to keep the application maintainable. Coming from Node.js an Ruby on Rails background my default solution is NPM (or Yarn if you want).
I noticed however that Microsoft excluded Node from their base Docker images for .Net about 2 years ago (see here: https://github.com/aspnet/Announcements/issues/298).
This led me to questioning my solution to use NPM and I went looking for alternatives. I found that you can install Javascript libraries by wrapping them in Nuget packages and installing them via Nuget. But I'm hesitant to go this way as I've seen this pattern causing issues in Ruby on Rails. It adds an extra layer of maintenance and often the Ruby Gems where no longer maintained, meaning you're unable to move to the newest versions.
Then we have Libman, which is integrated into Visual Studio (https://learn.microsoft.com/en-us/aspnet/core/client-side/libman/libman-vs?view=aspnetcore-2.2) and draws packages from https://cdnjs.com, which I believe contains less packages (but according to Microsoft has everything you need). But their own blog (https://devblogs.microsoft.com/aspnet/library-manager-client-side-content-manager-for-web-apps/) says:
LibMan is not a package management system. If you’re happily using npm/yarn/(or something else), we encourage you to continue doing so. LibMan was not developed as a replacement for these tools. For example, the SPA templates (i.e. Angular and React) we ship for ASP.NET Core depend on npm and WebPack, and we have no plans to change that.
Then we're left with Bower, which is no longer an option, from https://bower.io/:
...psst! While Bower is maintained, we recommend using Yarn and Webpack or Parcel for front-end projects read how to migrate!
So I wonder, for a monolith app, is NPM or Yarn still the right choice and if so, why did Microsoft decide to exclude Node from their base images?
You mentioned LibMan which works just fine, but you need to configure it to download packages from unpkg which is a CDN for NPM and should contain everything that you can find on npm.

How to use npm packages inside dart code?

I have a flutter application running on the Dart programming language. I have published an npm package that I want to use in my flutter application. Is there any way I can use the existing npm package in dart or somehow automatically convert npm package to dart package?
Dart and Javascript are different programming languages. While it might be possible to transpile you lib from js to dart, it is not easily doable, nor maintainable, and most likely not generalisable.
Unless you are comfortable with both languages and their limitations, you should not try to convert an NPM package to some Dart code unless you don't have any other choice.
I would advise you to rewrite the NPM package in Dart instead.
REMARK : this answer is based on the hypothesis that you don't want to integrate JS code in a webview but actually use the code inside the Dart VM.
It really depends on what you are going for,
Are you compiling your flutter app for web ?
Dart's JS library might be what you're looking for...
Are you going to compile for Android?
Then there's Android JS, Flutter_liquidcore, Interactive_WebView.
It Really depends on what you are expecting the application to compile to.
But don't expect native app experience...
We converted a fairly large js library to dart (manually) it was surprisingly easy as the two languages are very similar.
Tl:Dr: Use a WebView or run a Node/Deno/SpiderNode subprocess.
Let me answer the title of your question; you're going to have to wrap it in a webview or a node.js subprocess that can communicate over IPC using something like DBUS. This is cutting edge hard experimental tech as of 2021.
If it's a small we'll tested package, you could babel transpile it to Dart and automatically run the tests.
if it's a large package like Nuxt, forget about it, or put it in a WebView.
If it's your own package, consider translating it to Dart and then transpiling to JavaScript. It's Trivial to go from Dart to readable Node/ES2021.
But do you want to really use Dart for everything? Will the community for Dart be as strong as the Trois, Vue, WebXR typescript community in 5 to 80 years?
My advice would be to use Dart for what it's good for, client side JavaScript. And use well tested packages that can transpile from TypeScript to Dart, or a webview.
Could you use glue subprocesses to run node/deno/spidernode? see the Termux F-Droid debacle, where if you want to run a Node server on the latest version of Termux, you can't use the Google Play Store, but F-Droid. Basically, JIT will make your App Store approval process slower, but they will only be able to ban it from a policy standpoint, not from a technical one. You should not use npm install, but instead bundle the installed modules with the released app build.
How does the deprecation of JIT play in a world of Fuku native like PWA's and Spectre? From a security perspective, deploying to Kotlin/Swift is a narrow minded way of outsourcing the responsibility of making compiler patches happen, you should be building at least one a month, or leave the business. From a privacy perspective, the handshakes and huristic privacy protections will come to PWAs as hard as they will for binary apps.

React JSPM testing framework

What is the best testing framework and its associated helper libraries to use for a project in React and JSPM? I'm looking for various libraries combined together and what is specific to that set which makes it a powerful toolset? (Looking to incorporate redux later on)
I recently build testing environment for a react application using JSPM.
I first wanted to use Jest, as it is recommended by the community with react. But then I found out that thread, saying support for JSPM/SystemJs wasn't on the roadmap at the moment.
Although it exists some work to make it work, see for example: https://www.npmjs.com/package/systemjs-jest
Then I chose to use Jasmine as it is quite known in my company, and I already worked with it.
Also I think Jest used to be based on Jasmine, so many react-specific matchers developed for Jest are also compatible with Jasmine.
So I ended up using Jasmine with Karma, using karma-jasmine and karma-uiuxengineering-jspm.
Make sure to read the documentation of karma-uiuxengineering-jspm thoroughly, it took me some time to set the environment up.
Some nice additions:
- jasmine-enzyme (installed with JSPM)
- karma-mocha-reporter (installed with npm)
- karma-phantomjs-launcher (installed with npm)