signalr-no-jquery icon indicating copy to clipboard operation
signalr-no-jquery copied to clipboard

Published 20 hours ago • verified publisher icon DVLP

Please update the usage instructions with an example for "traditional" HTML without Babel/ES6 Modules

Open daiplusplus opened this issue 5 years ago • 0 comments

(I'd like to preface this post with a huge "thank you" for recently updating the library for SignalR 2.4.1 - that was only a few hours ago!)

In the old world, using the original SignalR client library is straightforward:

  1. Ensure you have jquery-2.2.4.min.js and jquery.signalr.2.4.1.js in your /scripts/ directory.

    • These files are automagically added to your project when you add the SignalR NuGet packages.

  2. Open your HTML file or template (e.g. Site.master, _Layout.cshtml, index.html, etc).

  3. Add this to your <head>:

    <script type="text/javascript" src="/scripts/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="/scripts/jquery.signalr.2.4.1.js"></script>
<script type="text/javascript" src="/signalr/hubs"></script>

  4. Add another <script> below that which then uses $.connection et cetera.

Now, I'm needing to use signalr-no-jquery in a project that doesn't have an existing JavaScript build process (beyond MSBuild/Visual Studio's built-in TypeScript compilation) and I'm stuck.

I was under the impression that signalr-no-jquery is a drop-in replacement for both jquery-2.2.4.min.js and jquery.signalr.2.4.1.js, but when I did npm install --save [email protected] I saw that the node_modules/signalr-no-jquery/build directory contained 2 files:

  • jQueryShim.js
  • signalR.js

and when I looked inside of those files, I saw they were both used require(), module.exports, and Object.defineProperty(exports, "__esModule" ), { etc } which means I can't use these files directly in a web-page (I think? please correct me if I'm wrong). And why is jQueryShim.js a separate file? I thought the whole point of signalr-no-jquery was that the jQuery shim is embedded within the signalr-no-jquery script file?

the documentation page says to just use import { hubConnection } from 'signalr-no-jquery, but I can't do that because:

  • My web-application needs to support browsers that don't support <script type="module">.
  • from 'signalr-no-jquery' won't work anyway because there is no file named signalr-no-jquery/index.js.
  • And as said above, require(), module, and exports can't be used in client-code.

So how do I actually use signalr-no-jquery with a traditional SSR web-application without a JavaScript build process?

I just want something like this:

    <script type="text/javascript" src="/scripts/signalr-no-jquery.min.js"></script>
    <script type="text/javascript" src="/signalr/hubs"></script>

daiplusplus avatar Nov 12 '20 10:11 daiplusplus