Add external JS - script on the web page



  • I've got a very simple application with React in Typescript. Team help. npx create-react-app app-name --template typescript I created a React template, an application in a typescript language. Below is the minimum example where I'm just generating a simple web page and giving it to the client. That's it. Everything.that I changed in a sgenerated template:

    App.tsx

    import React, { Component } from 'react';
    import {Helmet} from "react-helmet";
    

    class App extends Component {

    render() {
    return (
    <div className="application">
    <Helmet>
    <meta charSet="utf-8" />
    <script src="jquery.min.js" type="text/javascript" />
    <script src="script1.js" type="text/javascript" />

            &lt;/Helmet&gt;
            &lt;div className="container"&gt;
              &lt;a id="Test"&gt;Hello world!&lt;/a&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    );
    

    }
    }

    export default App;

    script1.js

    jQuery(function ($) {
    "use strict"

     alert("Hello world!");
    

    });

    jquery.min.js - It's a loaded jQuery violin.

    All three files are stored in a src folder that is generated by a command. create-react-app♪ After the server is launched and the page is downloaded, the page content is successfully displayed, that is, the only tag. <a/>♪ Here's the message. alertwhich, when downloading the page, is described in the crypt script1.js - doesn't work. By checking the browser's log, I saw both violets were not loaded:

    Failed to load resource: the server responded with a status of 404 (Not Found)

    Also, there are no browser browser scruples on the source deposit. I've been experimenting with pathways, but I've never been able to download the violets.
    How can you fix it?

    P.S.: I don't download jQuery, the violin at his https, because I need a local violin.



  • So src is not an external folder!

    The console says, "There's nothing on the road," because they're not available from the site itself. Put the violin in the folder. publicand it'll work.

    Details can be read: https://create-react-app.dev/docs/using-the-public-folder/

    Don't forget to point out. / to receive them from the root of the site)



Suggested Topics

  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2