CODEWITHSUNDEEP
reactjs
mmuserdev
mmuserdev

Reputation: 27

Where can I add js libraries in reactJs project?

I want add stomp.js file to reactjs project. Where should I add this file? In angular are two options: index.html or angular.json. How about react?

JavaScript code from other project:

function connect() {
    //connect to stomp where stomp endpoint is exposed
    var socket = new WebSocket("ws://localhost:8080/greeting");
    ws = Stomp.over(socket);

    ws.connect({}, function(frame) {
        ws.subscribe("/user/queue/errors", function(message) {
            alert("Error " + message.body);
        });

        ws.subscribe("/user/queue/reply", function(message) {
            showGreeting(message.body);
        });
    }, function(error) {
        alert("STOMP error " + error);
    });
}

Current project structure: project structure

Upvotes: 0

Views: 52

Answers (2)

Mechanic
Mechanic

Reputation: 5380

1 - install the library (using npm or yarn)

2 - import them in any file you need

There is no need to define them in a central namespace or something (indeed package.json will act like that);

for example stomp.js:

1 - npm i @stomp/stompjs

2 - now using it's Client in app.js

import { Client } from "@stomp/stompjs";

function App() {
  const stompClient = new Client({});

  return (
    <main> 
      
    </main>
  );
}

Upvotes: 1

mmfallacy
mmfallacy

Reputation: 186

You can add external js files through the import keyword in ES6. Basically you should do:

import exportedFunction from "<path-to-file>/stomp"

This should work, assuming that "stomp.js" is a file in your project structure and not a package to be installed (in this case you should install it using the package manager first before importing)

Reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import

Upvotes: 0

Related Questions