CODEWITHSUNDEEP
reactjs
Sai
Sai

Reputation: 53

External JS in React App - Rendering issue

I am new to react an trying to add external JS in react App. However no approach is working for me as JS does not work at all.

Below is my code. What is wrong with the code?

import logo from './logo.svg';
import './App.css';
import React, { Component }  from 'react';
import * as Yup from 'yup';
import ScriptTag from 'react-script-tag';
import {Helmet} from "react-helmet";

function App() {
  return ( 
  <div className='App'>
    <h1>This is external javascript - Helmet</h1>
    <Helmet>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js" 
    type="text/javascript" />
    </Helmet>
    
    <h1>This is external javascript - ScriptTag</h1>
      <ScriptTag isHydrating={true} type="text/javascript" 
      src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js" />
    
  </div>
  );
}

export default App;

Upvotes: 0

Views: 91

Answers (1)

Sujith Sandeep
Sujith Sandeep

Reputation: 1249

You cannot use jquery cdn directly inside the react js project. Rather you can go with the below plugin to use jquery inside your react js project,

https://www.npmjs.com/package/react-jquery-plugin

Just install it with below code,

npm install --save react-jquery-plugin

Upvotes: 1

Related Questions