Browserify require stream with expose - browserify

I have a problem with requiring programmatically created modules for browserify.
var File = require("vinyl"),
browserify = require("browserify");
bundler = browserify();
bundler.require(new File({contents: new Buffer(...)}), {expose: "mymodule"});
bundler.bundle();
...
In the output file i have the content of buffer, but not exposed to "mymodule".
Does anybody used this case?

This was a bug in browserify, but was fixed with this patch: https://github.com/substack/node-browserify/pull/907
and your above code should work in version 6.0.1 and above

Since this question was posted James Halliday (substack, creator of browserify) has been hard at work coming up with the browserify handbook: https://github.com/substack/browserify-handbook
This resource is excellent. It goes really deep into how requires work and resolve dependencies in general. It is by far the best resource I have ever seen on the subject. Perhaps if you (or anyone else landing on this question with a similar problem) give it a read, the answer might jump out at you.
I know it's not a direct answer to your question, but I only recently found this resource, and I wish I knew it existed earlier.
For an introduction to browserify, I recommend watching this tagtree video: http://tagtree.tv/browserify-an-intro?share_code=uncoopered-inspirer

Related

When I use VS Code write Vue.js, the code color sometimes get chaos

as shown below:
I don't understand why, the syntax and format is correct, it's extremely confusing.
I review my code carefully but can't figure out
this seems to be a bug with VS Code. This could be because VS Code is not updated, or an extension that is not supported anymore.
first, try ctrl + shift + p and running >Developer: Reload Window this should reload your current environment and the error should be fixed.
If that doesn't work, try a different extension. I currently use Vetur, and Prettier.
And don't forget to make sure your VS Code is up to date. go to the bottom left and click the settings cog, then check for update or updates.
My answer is, "Start from scratch, and record your steps." I'm happy to share my notes on what is presently working: https://github.com/TheAutomaTom/VsCodeSettings-Vue3
My personal machine had been in that spot for some weeks, so I took a step back and dump out your cornucopia of extensions and their dependencies.
Only run pertinent language services. This is a tall order given how much a Vue + Typescript + Tailwind on Vite app covers. I am suspicious of generalized HTML/CSS/JS packs though, because they may not be built to parse Vue SFCs. Every new release of a services intended for other frameworks, like Angular or React, are still possible culprits (and moving targets).
I gave up getting Prettier and ESLint on stable ground. For a non-workplace thing, I feel okay about that. You may be having issues with a global package, if you've been experimenting. I've tossed out a couple branches following different tutorials. I intend to revisit this one since it has some example projects: rvest.vs-code-prettier-eslint
I've noticed the Volar team seems to let oddities squeak out a little more frequently than I remember in Vetur.... but we love them just the way they are. Sometimes I downgrade just to check if I've gone crazy, yet.

I get errors serving lit-element with the nollup development server

When serving lit-element components with nollup then I keep getting the following error in the browser console that I am not able to track down:
toast-messages.js:56 Uncaught TypeError: modules[number] is not a function
at create_bindings (toast-messages.js:56)
at toast-messages.js:57
at Object.48 (toast-messages.js:365)
at create_bindings (toast-messages.js:56)
at _require (toast-messages.js:141)
at toast-messages.js:249
at toast-messages.js:251
Can anyone point me in the right direction? (I can share my rollup.config.js if required)
This error means that a module has been requested, but there's no module with the specified id (number) included in the bundle. This can happen for a variety of reasons:
There's a call using require passing an invalid id.
Passing a string or something other than a number into require.
Using a library that was compiled to CommonJS but was not transformed to ESM.
It's likely that you're missing the CommonJS plugin, or if you are, then the CommonJS isn't able to catch the require call and convert it. The latter can happen because of obfuscation in the library code. CommonJS plugins work by using static analysis. It would be very difficult for the plugin to transform the following:
var r = require;
r('my-library-code');
Without executing the code, it would be difficult for static analysis to track this. A best effort attempt can be made, but there will be always a situation where it could fail.
So here's the following steps you should take:
* Confirm that the CommonJS plugin is being used.
* If it is, check the file in node_modules for unusual patterns.
* If there is, file an issue with the CommonJS plugin maintainer and see if it's possible to solve, and if not, you might need to contact the maintainer for the toast-message library.
I do realise I'm posting this very late, but better to answer later than never! To avoid this vague error in the future, in 0.10.2 of Nollup I've added a user friendly error that list some things to check for.
Hope this helps!

Creating Cytoscape.js extensions

Max, I want to update my extension to the new format, but I am running into issues with placement of custom code. It seems that the extension framework has been updated a lot since I added an extension 4 years ago. Is there a way to get better documentation on getting started with adding a extension? I am happy to help write up the documentation if you can help answer some questions that I think would help get people started. Let me know.
The only thing that really changed is that the scaffolder creates a webpack project for you. The extension registering procedure is the same: http://js.cytoscape.org/#extensions/api
For example, cytoscape( 'collection', 'fooBar', function(){ return 'baz'; } ) registers eles.fooBar().
I guess the main thing is that there are a lot more files than what the previous scaffolder generated, so it might be harder to find things. The layout output has lots of files, because it creates a skeleton impl for each of the continuous case and the discrete case.
The scaffolder isn't strictly necessary. You could use another build system (or none at all) as long as you call cytoscape(). For example, if you only care about publishing to npm for people who use webpack/browserify/rollup, then you could just use cjs require('cytoscape') to pull in the peer dependency. Exporting a register function is nice if you want to allow the client to decide the order of extension registrations with cytoscape.use(extension) (or extension(cytoscape)).
You're right that there should be some more docs on the output of the scaffolder. Maybe a summary of the files would suffice. We could add a tutorial in the blog later if need be. Both the docs and the blog just use markdown, so the content could go in either place.

Patch Gecko to introduce a synonym for a supported CSS property ("appearance" for "-moz-appearance")

I am working on a firefox fork and would like to duplicate -moz-apperance as appearance. I have tried duplicating it as a shorthand property but this throws errors at the compile stage using ./mach build The documentation seems cryptic.
There's documentation about implementing new CSS properties, which might be hard to follow, but browsers are complex pieces of software.
(Currently this question is too broad to provide an answer that's not link-only.)
update: an actual answer from dbaron (via mozilla.dev.platform):
by adding entries to:
https://mxr.mozilla.org/mozilla-central/source/layout/style/nsCSSPropAliasList.h

What's the right way to make pickadate play well with browserify?

I've been struggling and very frustrated because I can't find a way to make pickadate play well with browserify. I'm migrating a Backbone app from AMD but pickadate seems impossible to work with it. I must say that I began to use browserify recently so I'm not an expert but I could migrate the rest of my code without any major incident. Of course I'm open to receive some tips and references to master browserify :)
I have jquery and pickadate installed via npm and when trying to use pickadate I'm getting the classic error:
undefined is not a function
I used this way of requiring (note the use without assigning the require to a variable):
require("jquery");
require("pickadate");
I saw this on an answer here at stackoverflow (Requiring pickadate.js with Browserify) but it doesn't work in my case.
Any help or reference about where to find help will be pretty much appreciated.
The current version of pickadate as a module only exposes the instance of PickerConstructor but it doesn't expose DatePicker neither TimePicker so every time we try to instantiate a date picker or time picker we got the error undefined is not a function because neither of them have been loaded and so no jquery.extend invocation have been made to append them to the jQuery object.
What is needed is some kind of facade / wrapper to expose all the pickadate functionality out of the box.
For this I made some small changes directly to the pickadate code base. I added an index.js that works as the facade / wrapper for picker.js, pick.date and pick.time, allowing them to be used out of the box with Browserify by issuing the typical require('pickadate'). It doesn't need to be assigned to a variable since pickadate attaches itself directly to the jQuery object. You can check this gist with the index.js code I used
This change is a copy of the way the CryptoJS library by #evanvosberg exposes its different algorithms through the same pattern implemented in its index.js file.
The only additional change would be to modify the property main in pickadate package.json to point to index.js.
I've just send a message to #amsul, the pickadate author asking for the possibility of integrate this changes directly into the pickadate github repo.
I hope people trying to use pickadate with browserify can find this solution and stop getting frustrated trying to make them play well together!
Greetings to everybody!