So I hear using jQuery is an anti-pattern in react. So how then are people injecting things like polyfills?
For example here for Object.assign(), Mozilla provides a very simple polyfill script that I'd like to try out. (yes I know there are things like babel-polyfill, etc. I just want to try injection js period, I don't need to get fancy here yet)
I assume you'd inject this in the componentDidMount(). But if not using jQuery are people simply using plain JS and the document object?
Related
I'm importing a library into a ReactNative project that uses document roughly 50 times. Because ReactNative, doesn't use a document, I will have to rewrite these lines in order for it to work in a ReactNative environment. The question is..
Is it possible to create a shim so that the original library is fully intact?
I would have to rewrite lines like document.body, document.createElement and document.appendElement . I guess document.body could just be my root container class, and the other two methods are self explanatory.
Because I've never seen anything like this before, I'm only guessing. Would be possible to import the library, and then bind document as a ReactNative component so that the component replaces the document in all of its mentions?
The JS file in question.
While it's possible to shim a document object in the global scope, I'd bet good money there is no way you'll get that component to work in React Native. It's too deeply coupled to native browser APIs to be feasible.
Instead, I would look into running the functionality inside a WebView, or finding an alternative solution to what you're trying to achieve.
It looks like Kandy, the library you are trying to use, offers iOS and Android SDKs. one solution might be to bridge the native SDKs to React Native.
I’m developing web app using Angular2. I use some external GUI libraries like: nanosSroller , qTip2. Problem is that some of them requires initialization like:
$('.panel').nanoScroller();
I’m not sure where to put this code. In my opinion best place would be tag in template file because this code is strictly view related but Angular2 removes all tags from templates so it’s not possible. I’ve ended up with custom service that is used inside ngAfterViewInit:
ngAfterViewInit() {
this.jsInitializer.initializeScroll('#user-panel');
}
I like this approach because I keep all GUI libraries dependencies in single service. What I don’t like about it is that I still have to pass manually css selector. Is there a better way to do this?
I am using requirejs so that I don't have every single script in the head tag for every page. The main motive behind switching to use requirejs is that we have plugins such as CodeMirror, with like 15 plugins to extend that too.
What I want to avoid is having for example:
require(["cm", "cmxml", "cmcss", "cmcodefold", "cmfoldgutter", "cmbracefold", "cmcommentfold" ....], fn);
I'd like to have this as just require(["cm"], fn); and automatically include all of the plugins with this. I'd also like to keep the plugins separate, so combining all the files into CodeMirror.js is not an option.
What I am wondering, before I go creating my own functions or modifying 3rd party code for this, is whether requirejs allows this kind of loading in any case? I have looked at the docs a lot and can't find anything, but that doesn't mean I haven't missed it or that it isn't documented. Thanks in advance.
Well I've managed to get this working using a shim for a script called cminit.js - the deps array simply lists all of the plugins for CodeMirror, which in turn have a dependency on CodeMirror which in turn has a dependency on jQuery. So one call to require for cminit.js automagically means that jQuery exists.
It works, but I'm not sure how much of this is best practice. Feel free to comment if you have a better way to do this.
I'm working on a JavaScript library which needs to give the user the ability to run some code on load. Of course, I'm familiar with window.onload, and things like $(function() {}); with jQuery. But I don't want to be dependent on another library, and I want this particular function (along with the rest of the lib, of course) to be cross-browser.
So is there an accepted way of attaching to the onload function without overriding another library's load functionality (or having mine overwritten if they include another lib after mine)?
Expose an initialization/onload method and require it be called by the consumer on load. In other words, push the issue off to whomever is using the library and will likely have a convenient method like that offered by jQuery.
This is a solved problem but it isn't simple: the answer to "$(document).ready equivalent without jQuery" has the code of how jQuery does this.
More hits: javascript onload without jQuery
Background
I am new to Node.JS but very experienced with JavaScript and jQuery. I have had no problem installing jQuery via npm install jquery, however, referencing plugins within the code is another challenge.
I have reviewed this similar StackOverflow question, and the solution appears to work but it seems to me that instantiating a "fake" browser window and injecting your jQuery plugin-based functions each time you need the plugin is possibly not the most efficient approach.
The specific plugin that is failing for me linq.js (yes, I am aware that js linq is available via npm but it is not the same as linq.js!).
NOTE: The plugin to which I am referring does not rely on any DOM elements; in my case, it simply runs JSON objects through various data functions. This is why I don't think I need to instantiate a window object.
Question
How do I properly import and use jQuery plugins in a Node.JS application?
You can't do this. JQuery manipulates DOM on the client-side, which means that it has no business on the server-side where NodeJs runs.
You don't.
You don't use jQuery on the server, ever. It has no place there, you don't have a DOM on the server and jQuery itself is a mediocre library to start with.
If you really want to use a "jQuery plugin" in node, you rewrite the plugin as a standalone module without a jQuery dependency.
As an aside, you also shouldn't need linq.js because it's an API you don't need, you already have array methods. Also your coding C# in JavaScript rather then learning JavaScript.
You also have all the array methods (map, filter, reduce, etc) so you simply do not need this. If you really want some of the sugar linq.js offers use underscore instead. (I personally recommend for ES5 over underscore)
Please use ECMAScript correctly rather then emulating C#.